Fonts

Fonts in je website. Vroeger kon je alleen ‘websafe’ fonts (=lettertypes) gebruiken: fonts die iedereen op z’n computer had staan. Sáái, want altijd hetzelfde en niet altijd zo mooi.
Of je moest een custom font uploaden naar je website. Dat kostte tijd en soms geld en was onhandig voor de leek.

Tegenwoordig is het anders. Met Google fonts kan nu iedereen in zijn/haar website gebruikmaken van een veelheid aan lettertypes. Hoera!

Design

Hoera? De designer duikt misschien wel in elkaar van afschuw: met zo veel opties komen minstens zo vele ongelukkige keuzes. Welk lettertype je kiest en hoe je verschillende lettertypes met elkaar combineert, heeft enorm veel invloed op het karakter van je site. Daar zit een hele wetenschap achter. De psychologie van beeldtaal is een enorm interessant en uitgebreid vakgebied.

Hulp

Gelukkig wordt de leek (of tijdbesparende prof) geholpen door designers die graag hun kennis delen. En soms maakt iemand zó iets moois, met zó veel liefde en toewijding, dat ik hem of haar wel kan knuffelen.

Dat is het geval bij deze blogpost van Lou Levit. Er zijn veel artikelen te vinden met mooie suggesties voor fontpairings (lettertypecombinaties), maar deze dame heeft er wel heel erg haar best op gedaan. Zo heeft ze niet alleen een lijst van 50 mooie combinaties van Googlefonts gemaakt, maar deze ook in de context geplaatst van interessante tekstquotes over design én kleurkeuzes tegen de achtergrond van vrij beschikbare kunst van het Rijksmuseum. Daar neem ik mijn hoedje voor af.

Hoe te gebruiken?

Als je, zoals veel van mijn klanten, Avada gebruikt (of een ander theme dat Googlefonts geïntegreerd heeft, bekijk hier een lijst met kandidaten), is het heel simpel: ga in je thema-opties naar de sectie met typografie (Avada: Avada, Theme options, Typography) en kies daar de juiste fonts voor body (de broodtekst; het ‘normale’ lettertype) en headers (de koppen).

Heb je dat niet, dan zul je een paar regels code in je site moeten verwerken. Selecteer in dat geval het juiste lettertype in Google fonts en volg de aanwijzingen. De twee genoemde locaties (<head> en CSS) zijn in de meeste thema’s tegenwoordig makkelijk toegankelijk gemaakt met een apart venster in de theme options.

Gaat het je toch boven de pet, neem dan contact op met je webbouwer.

Reliable PDF Ultimate Google font pairings

Bekijk de prachtige combinaties van Googlefonts hier: Reliable PSD Ultimate Google font pairings. Je kunt er ook lezen over haar afwegingen en de post in één keer als pdf downloaden, als je dat handig vindt.