Typografie voor het web: dress to impress

14 september 2015 | Simplefly

Wanneer een webdesigner aan een nieuwe ontwerpklus start, is een van de eerste vragen die beantwoord moet worden: welk lettertype wil ik gebruiken?

En vervolgens: welk gevoel wil het bedrijf overbrengen aan bezoekers? Met andere woorden: wat is karakter van het bedrijf?

Het juiste font, een passende outfit

Een lettertype (=font) kiezen kun je vergelijken met het kiezen van de juiste outfit: t- shirt (informeel) of overhemd met das (formeel), of iets er tussenin? Zoals onze outfit vaak iets over onze persoonlijkheid zegt (in ieder geval over ondergetekende), is dat met een font net zo.

Het juiste gevoel overdragen

Een goede webdesigner kiest dus een font dat het juiste gevoel overdraagt. Wanneer we de gemiddelde website bekijken, bestaat deze uit afbeeldingen, maar ook veel tekst (soms zelfs te veel). Typografie is veel meer dan alleen het juiste font kiezen. Een webdesigner moet namelijk zorgen dat een tekst ook goed leesbaar is. Denk daarbij aan aan zaken als contrast, regelafstand, (functionele) witruimtes en lettergroottes.

Laten we eens wat dieper ingaan op de fontkeuze:

stop2

Het font links is serif (met schreef), rechts zie je een sans-serif (schreefloos) font. Het verschil is duidelijk: het ene voorbeeld (links) is vriendelijk en elegant, het andere voorbeeld (rechts) geeft krachtige, directe boodschap. Nog een visueel voorbeeld:

1. foto wrong2

2. foto good2

In het eerste voorbeeld koos ik voor elke foto een niet-passend lettertype, je ziet dat er iets niet klopt. In de tweede foto staan de juiste lettertypes bij de juiste afbeeldingen. Je ziet dus dat elk font een eigen persoonlijkheid heeft. Wanneer we het verkeerde font kiezen, kunnen we de bezoeker dus een verkeerde indruk geven.

De structuur van een font

Elk lettertype heeft een specifieke

structuur2

gebaseerd op een grid. Dit grid zie je normaal gesproken niet, maar in dit voorbeeld heb ik het zichtbaar gemaakt.

Met behulp van zo’n grid heb ik een simpel geometrisch font ontworpen:

myfont2

Je kunt fonts maken op basis van geometrische vormen, maar ook met een persoonlijke touch, zoals een handschrift:

handwriting2

Dus ik dacht: waarom niet een lettertype ontwerpen dat is gebaseerd op mijn eigen handschrift? Zie hier het eerste voorbeeld van het font ‘Susy’s Handwriting’:

susy font2

Wat vind je ervan?