Deze handleiding is bedoeld om je te helpen bij het begrijpen van de mogelijkheden en beperkingen bij het ontwerpen van e-mailtemplates. Door rekening te houden met deze richtlijnen, creeër je e-mails die consistent worden weergegeven in verschillende e-mailclients en apparaten.
E-mailclients (met name outlook) maakt gebruik van verouderde technieken. E-mails moeten daardoor in tabellen en cellen worden opgebouwd. Dit beperkt je in een aantal dingen.
Fonts
De volgende fonts kun je zonder zorgen gebruiken. Deze worden als geschikt beschouwd voor alle e-mailclients:
Sans Serif Web Safe Fonts: Arial Arial Black Tahoma Trebuchet MSVerdana | Serif Web Safe Fonts: Courier Courier New Georgia Times Times New Roman | Monospace Fonts: Courier Courier New |
zie voor meer info: https://templates.mailchimp.com/design/typography/
Google fonts kunnen worden gebruikt maar zijn enkel zichtbaar voor:
- Outlook2000 ( idd 2000🫠)
- iOS Mail
- Apple Mail
- Android (default client, not Gmail)
- Thunderbird
Voor de overige (en dus meeste) e-mailclients is het websafe-font zichtbaar.
Afbeeldingen
Afbeeldingen zijn zeer geschikt voor e-mail. Ze worden echter vaak standaard geblokkeerd door e-mailclients en zijn pas zichtbaar na acceptatie van de gebruiker.
png, jpg en gif zijn vooral geschikt voor e-mail. Met png kun je ook gebruikmaken van transparantie.
Zie ook: https://spotler.nl/blog/png-jpg-of-gif-welk-bestandstype-gebruik-wanneer
Achtergrondafbeeldingen.
Deze kun je binnen 1 “cel van een tabel” gebruiken. Dat ziet er dus zo uit:
Wel:
- Niet: Een kronkelende lijn op de achtergrond die meerdere cellen doorkruist.
Border-radius
De meeste e-mailclients ondersteunen geen ronde hoeken. Dit kan echter wel in afbeeldingen worden toegepast door .png te gebruiken met transparantie.
Video
E-mail ondersteunt geen video. Wel kunnen gifjes worden gebruikt of afbeeldingen met daarop een playbutton. Dit simuleert een video.
Meer weten?
Voel je vrij om mij te contacten:
Sander van Zaane
mail@sandervanzaane.nl
0611123632