Lettertypen in e-mail

Wat je leert

Ontdek meer over de mogelijkheden en beperkingen van het online gebruiken van lettertypen en hoe je e-mails kunt versturen die aansluiten bij je merk.

Hoe lettertypen werken

Lettertypen zijn weergaven van tekst en kunnen worden gebruikt in printmedia of online media. Je bent misschien bekend met enkele van de meest voorkomende lettertypen, zoals Arial of Times New Roman, maar er zijn duizenden andere lettertypen die je kunt gebruiken om je merk te communiceren en te vertegenwoordigen.

Met online media (zoals websites of e-mails) zijn je lettertype-opties bijna onbeperkt. Maar wanneer je je creatie met iemand anders deelt, ziet deze er mogelijk niet precies hetzelfde uit, omdat niet alle apparaten toegang hebben tot dezelfde lettertypen.

Er zijn twee belangrijke manieren waarop een apparaat een lettertype kan openen en gebruiken: systeemlettertypen (d.w.z. lettertypen die zijn opgeslagen op het apparaat dat je gebruikt) en weblettertypen (d.w.z. lettertypen die worden geladen vanaf een externe server)

Over systeemlettertypen

Computers en telefoons worden geleverd met een reeks vooraf geïnstalleerde lettertypen. Er zijn enkele veelvoorkomende geïnstalleerde lettertypen (op de meeste apparaten staan bijvoorbeeld Georgia en Verdana), maar apparaten kunnen sterk verschillen in wat ze standaard bevatten. Lettertypen die door de meeste apparaten worden gebruikt, worden "web-safe"-lettertypen genoemd.

Over weblettertypen

In tegenstelling tot webveilige lettertypen worden webfonts vanaf een externe server geladen, tegelijk met de content die je bekijkt. Aangepaste lettertypen zijn meestal webfonts. Als je een webfont gebruikt, wil je ook een webveilig fallback-lettertype instellen, voor het geval een bepaald apparaat je webfont niet kan laden.

Over back-up-lettertypen

Wanneer je iets online bekijkt, of het nu een webpagina of een e-mail is, zit er achter de schermen CSS (code die wordt gebruikt om content online op te maken) die je apparaat vertelt welk lettertype moet worden weergegeven. Als je apparaat geen toegang heeft tot het lettertype, controleert het de CSS op een "fallback lettertype" (een lettertype of lettertypen, geselecteerd door de persoon die de website of het e-mailbericht heeft gemaakt, om te gebruiken als het voorkeurslettertype niet beschikbaar was). Fallback lettertypen moeten webveilige lettertypen zijn die de meeste apparaten kunnen gebruiken. Ze geven je meer controle over hoe je bericht wordt weergegeven wanneer iemand het bekijkt op een apparaat dat geen aangepaste/weblettertypen ondersteunt.

Als er geen fallback-lettertype beschikbaar is, of als het fallback-lettertype niet wordt ondersteund door het apparaat dat wordt gebruikt, gebruikt het apparaat een standaardlettertype, zoals Arial of Times New Roman. Standaardlettertypen verschillen sterk per apparaat en app.

Hoe lettertypen werken in e-mail

Sommige e-mailclients ondersteunen webfonts, maar andere niet. Wanneer iemand je e-mail opent in een inbox of op een apparaat dat geen webfonts ondersteunt, zien ze in plaats daarvan een standaardlettertype. Je kunt bepalen welke systeemlettertypen als back-ups worden gebruikt door een fallback-lettertype in te stellen.

Als iemand je e-mail opent op een apparaat dat webfonts ondersteunt, wordt het font geladen vanaf de URL die je in de CSS van je e-mail hebt opgegeven. Als het apparaat toegang heeft tot het font, wordt het weergegeven; anders gaat het door naar de fallback fonts.

De volgende e-mailclients ondersteunen webfonts (aangepaste fonts):

• Apple Mail
• iOS Mail (de standaard e-mailbrowser op iOS)
• Google Android (behalve Android 2.3, dat de @import -methode die door Google- en Adobe-lettertypen wordt gebruikt niet ondersteunt)
• Samsung Mail (Android 8.0)
• Outlook voor Mac

Houd er rekening mee dat Gmail, een van de grootste e-mailclients, webfonts over het algemeen niet ondersteunt. Er is echter één uitzondering: Gmail ondersteunt Roboto wel.

Lettertypen in je e-mails optimaliseren

De beste manier om ervoor te zorgen dat je e-mail er op alle apparaten consistent uitziet, is door een webveilig lettertype te gebruiken. De standaardlettertypen van Klaviyo zijn over het algemeen webveilig. Je vindt de lettertypen die Klaviyo aanbiedt in:

• Content > Images & Brand > Merkassets
• Het tabblad Stijlen van je e-mails
• De sectie Stijlen van alle e-mailblokken die tekst bevatten
• Het tabblad Stijlen van de editor voor het aanmeldingsformulier

Tips voor het gebruik van aangepaste lettertypen

Als je liever een aangepast lettertype gebruikt, gebruik dan de tips hieronder om ervoor te zorgen dat je e-mails er op verschillende apparaten goed ontworpen uitzien.

Gebruik reservelettertypen

Selecteer een websafe fallback-lettertype dat zo goed mogelijk bij je aangepaste lettertype past. Je kunt een fallback-lettertype selecteren uit de standaardlettertypen van Klaviyo bij het configureren van het aangepaste lettertype.

Gebruik tekst in afbeeldingen

Hoewel een e-mail met alleen afbeeldingen je bezorgbaarheid kan schaden, kun je strategisch een combinatie van tekst in afbeeldingen en tekst in tekstblokken gebruiken om een e-mail te maken die bij je merk past. Kies een aangepast lettertype in je huisstijl voor je koppen en call-to-actions (CTA's), en combineer dit met een webveilig lettertype voor je hoofdtekst.

Gebruik afbeeldingen met je merklettertype voor geselecteerde tekst, en zorg ervoor dat je alt-tekst toevoegt wanneer je de afbeeldingen aan je e-mail toevoegt. Pas daarna het webveilige lettertype toe op de rest van de tekst in je e-mail. Het resultaat is een e-mail in je merkstijl die aansluit bij je site en tegelijk toegankelijk is voor de inboxen van je abonnees.

Grondig testen

Ongeacht welke methoden je kiest, test je e-mails grondig, vooral wanneer je een nieuw ontwerp gebruikt. Stuur de e-mail naar jezelf op meerdere apparaten om ervoor te zorgen dat je tevreden bent met hoe deze op elk apparaat wordt weergegeven. Je kunt ook gebruikmaken van e-mailtestprogramma's zoals Litmus of Email on Acid om te testen op een breder scala aan apparaten.