Hoe je mooie e-mails ontwerpt

May 9, 2024
hoe je e-mails ontwerpt

Als je op zoek bent naar een hulpmiddel om langdurige klantrelaties op te bouwen, is er niets beter dan de goede oude e-mail methode. De mogelijkheid om je publiek te bereiken op een plek die mensen elke dag bezoeken – hun inbox – stelt je in staat om leads om te zetten in tevreden klanten, en om de betrokkenheid te behouden.

Hetzelfde geldt als je een blogger bent, een evement-organisator of als je werkt voor een non-profitorganisatie. Wanneer vertrouwen en een band opbouwen met gebruikers op de eerste plaats komt, is e-mailmarketing een must-have en vormt het de fundering van je digitale strategie. Van pakkende onderwerpen tot slimme landingspagina tekst die converteert, het wordt nog steeds beschouwd als het 5e meest effectieve digitale marketingkanaal voor marketeers!

De belangrijkste reden waarom e-mail zo effectief is, is dat het mensen de vrijheid geeft om het te openen en te bekijken, in plaats van willekeurige ongewenste digitale advertenties of berichten op social media.

Maar gezien het aantal commerciële e-mails dat dagelijks wordt verzonden, is de inbox een slagveld voor de aandacht van ontvangers, dus je moet iets doen om op te vallen!

Het kan stressvol zijn om na te denken hoe je e-mails er professioneel kunt laten uitzien en tegelijkertijd ontvangers kunt overtuigen om verder te lezen dan de onderwerpregel.

Een manier om dat te doen, is door middel van mooie e-mails.

Met Piktochart kun je meteen beginnen met het maken van geweldige e-mails. Laat je inspireren door onze sjablonen en maak e-mails, visuals voor social media, presentaties en meer! Begin gratis.


Verbazingwekkend mooie e-mails ontwerpen

Zoals het team van Piktochart altijd aangeeft: het menselijke brein is zo’n 60k keer sneller ingesteld op het verwerken van visuele informatie dan op tekst. Terwijl het je ontvangers veel meer tijd kost om een e-mail met platte tekst door te nemen, duurt het slechts een seconde om een visuele e-mail te verwerken. Dit is een enorm goede uitkomst in een overvolle inbox!

Bij e-mailmarketing zal er altijd discussie zijn over de vraag of e-mails met platte tekst beter zijn dan HTML e-mails of andersom. Vergeet niet dat als je alleen platte tekst verstuurt, je niet in staat bent om het aantal geopende e-mails bij te houden. Je kunt dus geen resultaten van de campagne volgen, en je berichten missen visuele impact. E-mail kan dienen als een medium om je merk op de best mogelijke manier te introduceren en onder de aandacht te brengen.

Om ervoor te zorgen dat je campagnes blijven hangen en mensen aanspreken, moet je een aantal best practices voor e-mailontwerp kennen. Hier zijn een paar tips die ik met je wil delen, zodat je je ontvangers aangenaam kunt verrassen met visueel verbluffende e-mails!

hoe je visueel verbluffende e-mails maakt

Laat je inspireren door kant-en-klare sjablonen

Je wilt er zeker van zijn dat je een sjabloon hebt waar je tevreden mee bent en die je inhoud een boost geeft. E-mailmarketing tools geven je een selectie van kant-en-klare e-mailsjablonen die je tijd kunnen besparen in de ontwerpfase, zodat je je kunt concentreren op het maken van professionele e-mails.

Als je geïnteresseerd bent in andere soorten sjablonen, dan zijn deze presentaties, infographics, posters, brochures en meer openbaar beschikbaar. Maak gewoon een gratis Piktochart account aan en bewerk een bestaande visual om het gemakkelijker te maken.

In elke tool die sjablonen aanbiedt, kun je er eentje kiezen die je leuk vindt en deze aanpassen aan je voorkeuren en imago van je merk. Sjablonen bestaan uit verschillende soorten inhoudsblokken die probleemloos kunnen worden gekopieerd of verwijderd. Bovendien hoef je je met responsieve FreshMail-sjablonen geen zorgen te maken over de weergave van je e-mail op verschillende apparaten, en kun je je klanten een geweldige mobiele ervaring bieden.

professioneel ogende e-mailsjablonen

Ontwerp zelf een sjabloon

Als je niets vindt dat echt aan je behoeften voldoet, kun je altijd vanaf nul beginnen en zelf professionele e-mailsjablonen ontwerpen. Sjablonen zijn opgebouwd uit blokken, net zoals een muur is opgebouwd uit bakstenen. Met een drag-and-drop editor in je e-mailsysteem heb je geen coderingsvaardigheden nodig om je eigen project te ontwerpen. Kies gewoon blokken en voeg ze toe om je sjabloon op te bouwen, en pas stijlen en andere elementen aan naar wens.

Bedenk wat je wilt bereiken met je sjabloon. Bedenk wat voor soort en hoeveel informatie je gaat versturen. Als je dit bedacht hebt, plan dan een eenvoudige en strakke sjabloon die je inhoud op een gemakkelijk te begrijpen manier weergeeft.

Pro tip:

Steeds meer e-mails worden geopend op mobiele apparaten, en de belangrijkste regel die je moet volgen, is om te ontwerpen voor de bovenste 640px in lengte en 7,6cm in diepte.

De helft van 640px is 320px, wat een veelgebruikt breekpunt is voor mobiele telefoons. Tablets hebben geen breekpunten nodig, dus daarop je ontwerp zal responsief werken.

Denk na over je lay-out

Rangschik je sjabloon op een wijze dat je abonnees het belangrijkste eerst zien. Rangschik je inhoud van boven naar beneden en plaats altijd je belangrijkste nieuws met een oproep tot actie als eerste en boven de vouw. In e-mailontwerp is dit ongeveer 350 pixels hoog en 650 pixels breed. Dit gebied zal in de meeste e-mailprogramma’s zichtbaar zijn zonder dat je naar beneden hoeft te scrollen.

Internetgebruikers besteden 80% van hun tijd aan het lezen van boven de vouw geplaatste inhoud, en uit onderzoek van Nielsen Norman Group blijkt dat we een “F”-patroon volgen bij het lezen van internetcontent, waaronder e-mails. Als je waardevoorstel en CTA bovenaan staan, kun je er zeker van zijn dat abonnees je boodschap niet zullen missen.

patroon in het lezen van e-mails

Andere e-mailelementen die de moeite waard zijn om boven de vouw te plaatsen, zijn:

  • je logo – dit vertelt je abonnee van wie het bericht komt
  • een voorbeeldlink – een link waarmee een abonnee het bericht in een browser kan bekijken als de e-mail niet goed wordt geladen

  • overtuigende afbeeldingen – plaats alt-tekst op elke afbeelding om ervoor te zorgen dat je boodschap wordt overgebracht voor het geval de visuele elementen niet worden geladen in de inbox van een abonnee. Alternatieve teksten kunnen zeggen wat er in het bericht staat als abonnees de afbeeldingen niet te zien krijgen.

Maak je nieuwsbrief sjabloon gemakkelijk voor de ogen van de lezer. Gebruik veel witruimte, want dit verbetert de leesbaarheid van je bericht en laat de inhoud echt opvallen. Dit is een gouden regel voor het ontwerpen van visuele inhoud, en het laat afbeeldingen er overzichtelijk en netjes uitzien. Deze en andere voordelen van het gebruik van witruimte worden mooi uitgelegd in deze blogpost.

Om spamredenen is het ook belangrijk om de hoeveelheid tekst versus afbeeldingen in je e-mail in evenwicht te houden. Veel e-mailfilters geven een SPAM-score op basis van de verhouding tussen afbeeldingen en tekst. Zorg ervoor dat je e-mails alleen relevante details bevatten en dat elk stukje tekst of visueel element een doel dient.

Pro tip:

Gebruik voetteksten in berichten om spamfilters te omzeilen en om succesvol in de inbox van abonnees te belanden. Breng de verhouding tussen beeld en tekst in evenwicht door items met veel tekst, zoals je privacybeleid, in de voettekst van je e-mail te plaatsen. Antispamfilters zullen het tekstblok detecteren en er gunstig op reageren, waardoor de reputatie van je servers toeneemt.

Typografie – lettertypen die geschikt zijn voor e-mails

Bij het ontwerpen van e-mails gaat het er vooral om dat e-mail apps de campagnes goed weergeven. Als het gaat om tekst, kunnen de meeste problemen worden opgelost door een veilig lettertype te gebruiken, of een lettertype dat is geïnstalleerd of wordt ondersteund door elk apparaat en wordt weergegeven door elke browser in elke e-mail serviceprovider. Het gebruik van een veilig lettertype garandeert dat je abonnees dezelfde tekst zien die je hebt ontworpen wanneer je je nieuwsbrief op meerdere apparaten samenstelt.

lettertypen voor e-mails, e-mail lettertypen

Als je wilt dat je nieuwsbrief goed wordt weergegeven op mobiele apparaten, is een grootte voor sectietitels 30px met 22px het absoluut minimum. Tekst in de hoofdtekst van het bericht moet uit minstens 14px bestaan.

De belangrijkste regel bij het kiezen van een lettertype is dat je tekst goed leesbaar moet zijn. Beperk je letterkeuze tot 2 of 3 soorten. Een groot deel van het samenstellen van een goed ontwerp is ervoor zorgen dat het algehele uiterlijk consistent is. Het FreshMail-team heeft een hele blogpost geschreven over hoe je het juiste lettertype voor je e-mail kunt kiezen dat aansluit bij de stijl van je boodschap. Je kunt het hier lezen.

Spreek met kleur

De meerderheid van de consumenten geeft aan dat kleur de belangrijkste factor is die hun keuze voor alledaagse artikelen beïnvloedt. Kleur speelt een belangrijke rol en kan helpen om je boodschap over te brengen.

Houd het in het ontwerp van je e-mail bij een paar kleuren, zodat je ontwerp er strak uitziet. Kies kleuren die deel uitmaken van je merkidentiteit of gebruik kleuren waarmee je je marketingaanbod kunt aanpassen en lezers in de juiste stemming kunt brengen. Laten we zeggen dat je een zomer nieuwsbrief verstuurt – speel met felle kleuren en geef een seizoensgevoel mee met zonnig geel of zacht blauw dat geassocieerd wordt met de zee.

Volg deze regels bij het kiezen en combineren van geschikte kleurenparen:

  • Complementaire kleuren – Dit is de basismanier om kleuren te combineren in een ontwerp. Het draait allemaal om het kiezen van twee kleuren op tegengestelde posities op dit wiel.
complementaire kleuren
  • Analoge kleuren – Controleer hoe dicht kleuren bij elkaar liggen op het kleurenwiel. Kleuren die naast elkaar liggen, gaan goed samen.
analoge kleuren
  • Triade van kleuren – Combineer drie kleuren, elk op gelijke afstand van de andere.
triade van kleuren

Maak het extra boeiend met interactieve functies

Als je je wilt onderscheiden van de rest, kun je de aandacht van je lezers krijgen door dynamische elementen toe te voegen.

Een grappige GIF, ingesloten enquête of geanimeerde CTA kan de betrokkenheid verhogen door simpelweg een glimlach op het gezicht van de ontvanger te toveren.

Gebruik deze echter spaarzaam. Je verstuurt tenslotte professionele e-mails. Het vullen van je e-mails met wilde GIF’s kan ertoe leiden dat mensen op de afmeldlink klikken of zelfs de e-mail naar de spammap sturen.

Het toevoegen van interactieve functies in je e-mails moet altijd een duidelijk doel hebben en dient in lijn te zijn met de stem en boodschap van je merk. Een e-mail die is overladen met onnodige interactieve functies kan de lezer verwarren en overweldigen in plaats van hem te boeien. Ga dus voorzichtig te werk en geef altijd prioriteit aan de gebruikerservaring.

Stuur niet te veel berichten in één e-mail

Heb je je ooit al afgevraagd hoeveel elementen een gemiddeld persoon in één keer kan onthouden? Psycholoog Alan Baddeley ontdekte dat de maximale informatiekanaal capaciteit van mensen ongeveer 2 tot 3 bits informatie is, wat overeenkomt met het vermogen om onderscheid te maken tussen vier en acht verschillende dingen.

Overlaad je lezer dus niet met te veel informatie!

overlaad je e-mail niet, overlaadde informatie

Gebruik de inzichten van Alan Baddeley bij het samenstellen van je e-mail of nieuwsbrief. Je bericht moet tussen de 5 en 9 afzonderlijke stukken bevatten. Maar als het echt nodig is om meer te verzenden, probeer dan je inhoud op te delen in categorieën, waarbij elke categorie uit niet meer dan 4 items bestaat.

Wij volgen deze leidraad ook in onze maandelijkse nieuwsbrief. Het bericht bevat ons belangrijkste nieuws en 3 andere koppen om te lezen.

e-mailsjabloon van freshmail

Vergeet niet je nieuws of categorieën te onderscheiden door je secties duidelijk af te bakenen met scheidingen of randen en witruimte. Je e-mail opsplitsen in onderwerpen met duidelijke subkoppen helpt je lezer het bericht te scannen en je inhoud beter te begrijpen.

Maak een statement met overtuigende visuals

Visuele inhoud trekt mensen aan en laat abonnees je boodschap beter begrijpen. HubSpot voerde een onderzoek uit en vroeg meer dan duizend professionals of ze de voorkeur gaven aan HTML-gebaseerde of tekstgebaseerde e-mails, en of ze de voorkeur gaven aan e-mails die voornamelijk uit tekst of uit afbeeldingen bestonden. Bijna 2/3 koos voor e-mails op basis van HTML en afbeeldingen.

e-mail enquête hubspot

Een goede foto zegt meer dan duizend woorden, en in elke marketingcampagne is visuele waarde uiterst belangrijk. Meestal hoef je geen fotograaf te zijn en de foto’s zelf te maken.

Eenvoudig online te kopen stockfoto’s en gratis stockfoto bronnen bieden eindeloze mogelijkheden voor elk beeldmateriaal dat je wilt opnemen in je nieuwsbrief. Het is echter een uitdaging om afbeeldingen op te nemen in e-mails. Ten eerste moet je ze hosten op een webserver en vervolgens moet je ze in je e-mail plaatsen om te worden gedownload wanneer het bericht wordt geopend.

Denk aan het volgende als je e-mails verstuurt met grafische inhoud:

  • Vermijd achtergrondafbeeldingen waar tekst op staat. Veel e-mailclients ondersteunen ze namelijk niet.
  • Host je afbeeldingen op een webserver
  • Sla afbeeldingen op als .png of andere lossless indelingen
  • Beperk afbeeldingen in één campagne tot 120kb in totaal
  • Plaats je grafische inhoud aan de linkerkant van het nieuws als je een nieuwsbrief voor contentmarketing verstuurt. Afbeeldingen krijgen meer aandacht doordat we van links naar rechts lezen
  • Gebruik foto’s van de best mogelijke kwaliteit en licht je producten uit met behulp van focus
  • Zorg ervoor dat de afbeeldingen in je e-mail klikbare links zijn, aangezien mensen vaak niet alleen op CTA-knoppen klikken, maar ook op andere plaatsen op een afbeelding.
  • Gebruik menselijke gezichten – deze trekken de ontvanger meer aan dan andere objecten

Pro Tip:

Als je de aandacht van je abonnees wilt richten op wat er in je CTA staat, gebruik dan een afbeelding van een persoon die naar de CTA kijkt. Het werkt! Abonnees volgen de blik naar de klikbare knop.

e-mail tips, persoon die naar de cta kijkt

Ontwerp een onweerstaanbare CTA

De call-to-action is een cruciaal onderdeel van je e-mailcampagne, want het is een belangrijke drijfveer voor je campagnedoelstellingen. Het menselijk brein is van nature nieuwsgierig naar wat er gaat gebeuren, en je kunt inspelen op deze nieuwsgierigheid in je call-to-action! Mensen houden van ontdekken en verkennen, dus ze zullen ook proberen uit te vinden wat er gebeurt als ze op een CTA klikken.

Om ervoor te zorgen dat je CTA converteert:

  • Plaats je CTA boven de vouw en maak het het eerste wat je abonnees zien na het openen van het bericht
  • Maak het klikbaar. Voeg een hyperlink toe met een groter lettertype of maak de CTA in de vorm van een grafische knop
  • Grafische knoppen zijn de meest opvallende en populaire vorm van CTA
  • Gebruik contrasterende kleuren en omring de knop met witruimte om hem nog meer te laten opvallen
  • Vertel je abonnees precies wat je wilt dat ze doen met behulp van praktisch taalgebruik
  • Het is gemakkelijk om de mist in te gaan door te veel keuzes te creëren. Met één CTA moet je nog steeds een beslissing nemen: klikken of niet klikken. Houd het simpel; vaak is één CTA genoeg
  • Als je meer dan één CTA hebt, rangschik je CTA’s dan op belangrijkheid van de grootste naar de kleinste.
  • Knoppen in je nieuwsbrief moeten groot zijn (minstens 44px x 44px), want gebruikers op smartphones moeten erop kunnen klikken zonder het scherm te hoeven vergroten.

ReallyGoodEmails heeft CTA-knoppen gecatalogiseerd op basis van gebruikte kleuren en hun betekenis. Misschien heb je hier iets aan bij het ontwerpen van je volgende campagne.

cta knoppen kleuren

Pro Tip

Herhaal je CTA in een naschrift om meer klikken te krijgen. We verwachten iets belangrijks in elke “P.S.”, dus laat het niet verloren gaan. Je oproep tot actie zal niet gemist worden in dit deel van het bericht.


Ik hoop dat deze tips je helpen om je boodschap stijlvol over te brengen. Welke ontwerpmethoden voor e-mail hanteer jij? Voel je vrij om je ideeën toe te voegen in de commentsectie hieronder.

Nog één ding! We hebben een speciale aanbieding voor lezers van de Piktochart-blog. Probeer FreshMail eens en ontwerp prachtige e-mails met onze responsieve sjablonen!

Gebruik deze link om je account aan te maken. Je kunt FreshMail gratis gebruiken met tot 500 abonnees. Als je mailinglijst groter is, kun je elk type abonnement kopen met 15% korting!

Veel succes met je e-mailcampagnes!


Van Piktochart: Houd er rekening mee dat niet alle e-mailmarketingplatforms HTML-insluitingen in hun sjablonen accepteren, dus als je van plan bent je infographic of visual als HTML-code in te voegen, controleer dit dan eerst bij je e-mailplatform.

MariaWachal
Maria Wachal