Wil je resultaat met je website dan moet je niet je bezoekers wegjagen.
Verkeerde lettertypes zijn een trefzekere manier om je publiek af te schrikken.
Hier lees je hoe je dat voorkomt en waar wij zelf op letten.
Het ideaal is meestal dat je op de website een van de lettertypes van de huisstijl gebruikt. Vaak blijft het bij een ideaal omdat maar weinig lettertypes -of fonts- echt geschikt zijn voor gebruik op websites. Je kiest dan een font dat zo dicht mogelijk in de buurt komt. Of als dat mag en past, een heel ander lettertype. Maar wat je ook kiest, er zijn spelregels waar je rekening mee wilt houden. In dit artikel vind je de dingen waar je op kan letten in je keuzes. Helemaal onderaan vind je een lijst met 'webveilige' lettertypes.
Het is belangrijk om fonts te testen op gebruik, leesbaarheid en volledigheid. Dat doe je omdat er in je keuze bepaalde "gebreken" kunnen zitten die je in eerste instantie niet verwacht:
Bepaalde letters van een font kunnen met elkaar worden verward als ze klein worden weergegeven; dan is er bijvoorbeeld haast geen verschil tussen 2 letters N of 1 enkele M.
Tegelijkertjd zijn er lettertypes die alleen in weergaves van 10-12 pixels goed ogen en er vervormd uitzien als ze voor koppen of titels worden gebruikt.
Voor onbekendere font-sets geldt dat ze niet altijd volledig zijn; er kunnen speciale letters of tekentjes ontbreken maar ook een cursieve weergave kan niet in het font-pakket zitten.
Gebruik je een afwijkend of speciaal font dan is de kans groot dat een bezoeker dat lettertype niet op de machine heeft staan. Als dat zo is dan kan de browser het lettertype niet weergeven* en wordt het lettertype vervangen voor een standaard font. Het bedoelde effekt is dan weg en er ontstaat een lelijk uiterlijk dat storend werkt op de aandacht van de lezers/bezoekers. Een apart punt is het verschil tussen windows en macintosh. De standaard meegeleverde verzameling lettertypes zijn voor deze systemen anders en ook de weergave van een bepaald font kan bij de een anders zijn dan bij de andere.
*Om deze situatie te ontlopen zijn (programma-) oplossingen bedacht die niet waterdicht zijn en technische beperkingen met zich meenemen.
Dan maar een afbeelding?
Een andere mogelijkheid is om tekst met een bijzonder lettertype in een afbeelding te plaatsen. Op zich werkt dat voor de doorsneebezoeker. De grote kanttekening is dat dergelijke 'tekst' eigenlijk een plaatje is.
De inhoud van een afbeelding is onleesbaar voor slechtzienden en voor zoekmachines**. Om deze reden wordt belangrijke informatie nooit in een afbeelding geplaatst.
**De relevante informatie in alt en/of title definities plaatsen is maar een halve oplossing omdat een zoekmachine meer gewicht geeft aan echte tekst.
De lettertypes in de lijst hieronder zijn webveilig. Dat wil zeggen dat ze in bijna elke situatie op dezelfde manier worden weergegeven. Los van het apparaat en los van de browser waar je mee surft. De lijst is opgesteld door W3C-. Deze organisatie ontwikkelt en promoot internationale standaarden voor websites.
De lettertypes zijn opgedeeld in de drie belangrijkste soorten fonts voor gebruik op het web. Ze zijn gemakkelijk uit elkaar te houden. Bij SERIF -fonts hebben de letters kleine haaltjes aan de uiteinden van de letters. Bij SANS-SERIF -fonts ontbreken die haaltjes. MONOSPACE is de derde familie en heeft een ander soort eigenschap: alle letters van een monospace font zijn precies even breed.
Lettertypes voor onderdelen op webpagina's (titels, alinea's, commentaar, etc.) worden apart toegewezen. De webdesigner benoemt een font voor een onderdeel een geeft daarbij alternatieven om op terug te vallen.
In de linker kolom van de lijst is is het net zo gedaan. Het eerste - meest linker font- is het lettertype dat moet worden weergegeven. Iedere daarop volgende naam is telkens een zo goed mogelijk alternatief voor als het font dat ervoor staat niet kan worden weergegeven. Voor het geval een computer geen enkele van de lettertypes kan produceren wordt tot slot de font-familie benoemd.
En dan, tot slot, de lijst!
| namen: | Voorbeeld tekst: |
|---|---|
| Georgia, serif |
Dit is een alinea |
| "Palatino Linotype", "Book Antiqua", Palatino, serif |
Dit is een alinea |
| "Times New Roman", Times, serif |
Dit is een alinea |
| namen: | Voorbeeld tekst |
|---|---|
| Arial, Helvetica, sans-serif |
Dit is een alinea |
| Arial Black, Gadget, sans-serif |
Dit is een alinea |
| "Comic Sans MS", cursive, sans-serif |
Dit is een alinea |
| Impact, Charcoal, sans-serif |
Dit is een alinea |
| "Lucida Sans Unicode", "Lucida Grande", sans-serif |
Dit is een alinea |
| Tahoma, Geneva, sans-serif |
Dit is een alinea |
| "Trebuchet MS", Helvetica, sans-serif |
Dit is een alinea |
| Verdana, Geneva, sans-serif |
Dit is een alinea |
| namen: | Voorbeeld tekst |
|---|---|
| "Courier New", Courier, monospace |
Dit is een alinea |
| "Lucida Console", Monaco, monospace |
Dit is een alinea |