Typografie
De huisstijl van het CIBG gebruikt net als alle overheidssites het lettertype "RO Sans".
Paragraaf
Voor de introductie van een pagina kan een standaard paragraaf voorzien worden van
de class .lead
. De alinea komt er
dan uit te zien zoals deze alinea, zodat er meer nadruk op komt.
Een normale paragraaf ziet er uit zoals de tekst die je nu leest. Standaard wordt er marge toegevoegd onder aan elke paragraaf om visuele ruimte te creƫren met opvolgende elementen.
Weergave van diverse kopniveau's
Koppen van het niveau h2
worden standaard in het blauw getoond en niet
dikgedrukt, omdat deze bijna alleen voorkomen bij het gebruik in formulieren. Wanneer je
h2
op een content pagina gebruikt, kun je de class .content
toevoegen aan de h2
tag. Hierdoor wordt de kop zwart en dikgedrukt.
Header classes onafhankelijk van kopniveau
De visuele weergave van de koppen veranderen standaard op basis van het kopniveau. Tegenwoordig worden er meer complexe schermen ontwikkelt, waarbij het soms nodig is om meer hierarchie aan te brengen met behulp van lettergrootte.
Hierom zijn er ook classes beschikbaar waarmee koppen in drie maten weergegeven kunnen worden. Let er hierbij op dat de opbouw van de koppen nog wel valide is.
Opsommingen
Voor het tonen van opsommingen zijn er ordered, unordered en unordered-unstyled varianten.
Het is ook mogelijk om een lijst met pijltjes ervoor te tonen. Over het algemeen wordt deze alleen gebruikt om een lijst met links te tonen.
Inline elementen
Dikgedrukt en cursief
Om nadruk te leggen op een deel van een alinea kan gebruik gemaakt worden van strong
en em
tags. Het op dat dit
expliciet niet gebruikt mag worden om hele alinea's te benadrukken.
Links
Links in een lopende tekst moeten herkenbaar zijn door onderstreept te zijn.
Externe links openen in een nieuw venster en zijn herkenbaar doordat er een icoon voor staat. In een externe link moet een screenreader tekstalternatief aanwezig zijn waarmee wordt aangegevens dat de link in een nieuw venster opent.
Metadata
Op een onderschrift toe te voegen kan de class meta
worden toegevoegd. Let er op dat een onderschrift visueel bijna altijd gekoppeld is aan content
waar het bij hoort. Zorg er voor dat dit ook voor screen readers duidelijk is.