Het verborgen gewicht van weblettertypes
Mooie typografie kan een dure prijs vragen in prestaties als je niet oplet. Zo houd ik lettertypes scherp zonder de laadtijd te beladen.
Een slecht beheerd lettertype betekent enkele honderden kilobytes, tekst die bij het laden verspringt, en een prestatiescore die wegzakt. En toch blijft typografie een van de sterkste hefbomen van een identiteit.
Drie regels die ik altijd toepas: enkel de werkelijk gebruikte gewichten laden, bestanden serveren in WOFF2, en het hoofdlettertype preloaden om de flash of invisible text te vermijden.
Subsetten verandert alles. Een lettertypebestand bevat vaak honderden tekens voor alfabetten die je nooit zult gebruiken. Door enkel Latijn te behouden, deel je het gewicht soms door drie of vier.
Variabele lettertypes zijn een ander wapen: één bestand dekt elk gewicht van een familie. Zodra je er minstens drie gebruikt, is het bijna altijd lichter dan elk gewicht apart laden.
Aan de fallback-kant definieer ik altijd een coherente system-font-stack. Loopt het custom lettertype vertraging op, dan blijft de tekst leesbaar in een verwant lettertype, zonder bruuske layout-shift wanneer de echte font binnenkomt.
Ik vermijd ook te veel families te stapelen. Twee goed gekozen lettertypes, soms drie, volstaan om een duidelijke hiërarchie te bouwen. Daarboven win je rommel en verlies je samenhang.
De juiste reflex: vraag je af of elke kilobyte aan font de boodschap echt dient. Als het antwoord nee is, verdwijnt hij.