De anatomie van het perfecte e-mail design

Afleidingen, smartphones en andere mobiele apparaten veranderen de manier en het tijdstip waarop we onze e-mail bekijken. Ons e-mail design moet veranderen.

Er zijn enkele basiselementen die alle e-mail designs moeten hebben om je boodschap goed over te laten komen bij je ontvangers. Elementen die er bovendien voor zorgen dat ontvangers het gewenste gedrag vertonen en je e-mail marketing resultaten oplevert. Ieder van die elementen afzonderlijk beïnvloedt de totale impact die design heeft op je open-, click- en conversieratio’s. Deze elementen samen vormen de structuur, de anatomie van het perfecte e-mail design.

Weet jij waar je e-mails worden geopend?

Nog maar een paar jaar geleden kon je ervan uitgaan dat je berichten op het werk of thuis op een desktop computer geopend werden. Met de opkomst van smartphones en tablets is dat inmiddels totaal veranderd.

E-mail kan op veel verschillende plekken gelezen worden, maar allemaal vallen ze in een van de drie categorieën: desktop, webmail of mobiel. De mobiele categorie groeit nog steeds hard. Volgens Litmus (testtool om o.a. te meten op welke platformen je e-mails geopend worden) werd in juli van dit 44% van de e-mails op een mobiel apparaat geopend.

Deze trends in mobiel gebruik zijn van grote invoed op het design van je e-mail. Tegelijkertijd mag je niet vergeten dat ander groot deel van berichten wordt gelezen op verschillende web- en desktopplatformen als Outlook, Gmail en Apple Mail. Op alle platformen moet je e-mail zijn werk doen. Voor elk platform moet je andere design- en coderingsuitdagingen trotseren.

Zo is het perfecte e-mail design opgebouwd

Om je mailings consistent te houden en de verwachtingen van je ontvangers te sturen is het slim om je e-mail op te splitsen in onderdelen. Dit zijn de algemene elementen waaruit de anatomie van het perfecte e-mail design bestaat.

 

Pre-Header: verlengstuk van je onderwerpregel

Zoals de naam al aangeeft, staat de pre-header helemaal bovenaan, nog boven de header. Een belangrijk deel van je e-mail, omdat de tekst die hier staat in veel e-mailprogramma’s (Gmail, Outlook en de verschillende mobiele e-mailclients) naast de onderwerpregel verschijnt. Het speelt een rol bij de beslissing van je ontvanger om de mail al dan niet te openen.

Jammer genoeg zie je heel vaak dat op de plaats van de pre-header de link naar de online versie staat: ‘Klik hier om dit bericht in uw webbrowser te lezen’. Deze link moet je wel bovenin laten staan, maar zorg dat de allerbovenste plek wordt gebruikt voor een marketingtekst die te maken heeft met de content. Let er op dat je een tekst kiest die een verlenging of uitbreiding is van je subjectline en niet een herhaling. Wees creatief!

Header: de eyecatcher

De meeste aandacht van je ontvanger gaat uit naar de header. Het is het meest geklikte onderdeel van je e-mail. Het bevat vaak het logo en enkele navigatie links. Helemaal compleet maak je het als je ook social media volgbuttons in de header plaatst.

Belangrijk is dat de header je merk- of bedrijfsbranding goed volgt, zodat de e-mail herkenbaar is. Dat zorgt voor een betrouwbare uitstraling en zo voorkom je dat je als spammer wordt gezien.

Om het design geschikt te maken voor mobiele gebruikers is het beter te simplificeren dan alle content van de header in de kleine beschikbare ruimte te persen. Gebruik responsive design om navigatie en andere links weg te laten, zodat je ontvanger zich kan focussen op je hoofdboodschap zonder zijn beleving tekort te doen.

Primaire content

Als je één onderdeel van je e-mailbericht moest kiezen dat je ontvangers niet mogen missen, dan is dit je primaire content. De eerste reden waarom je het bericht stuurt (verkoop, promotie van een nieuw product of dienst, aanmoediging om in te schrijven voor een event), is de content die de primaire plek moet innemen. Houd het bij 1 onderwerp, zorg dat dit niet vertroebeld wordt door meerdere boodschappen.

Zorg verder dat de lengte van het primaire item niet te lang is,  maximaal 1 of 2 alinea’s. Mensen besteden niet veel tijd aan een e-mail, lange stukken tekst worden niet gelezen. Zet er een grote titel boven en maak de call-to-action duidelijk en in een oogopslag zichtbaar.

Secundaire content

Secundaire content volgt onder de primaire content of wordt in de rechter kolom naast de primaire content geplaatst. Dit item neemt minder ruimte in beslag dan de primaire content.

Hoe goed je je publiek ook segmenteert, het lukt je nooit iedereen met je content tevreden te stellen. Met secundaire content vergroot je de toegevoegde waarde van je mailing door meer informatie of producten te bieden aan je ontvangers. Hoewel kleiner van formaat moet je secundaire content ook een titel, afbeelding en call-to-action bevatten.

Ik zie wel eens mailings voorbij komen met een eindeloze reeks secundaire items. Dat werkt dan weer niet. Uit onderzoek is gebleken dat mensen niet teveel keuze willen hebben, dan kiezen ze helemaal niet meer. Dus, beperk je tot 2 of 3 items. Bovendien besteden de lezers vaak niet meer dan 10 seconden aan je mail. Veel verder dan het doorscannen van het bericht komen ze niet. Ga daarom, voor het versturen van je mail, na of je de belangrijkste informatie in minder dan 10 seconden kunt opnemen.

Call-to-action: wees duidelijk en creatief

Met de call-to-action vertel je je ontvangers wat je wilt dat ze doen: je aanbieding of je nieuwste product bestellen, aanmelden voor een event, je volgen op LinkedIn of een whitepaper downloaden. Iedere e-mailing die je verstuurt moet een duidelijke call-to-action bevatten.

Wees creatief, een link met “Klik hier” werkt al lang niet meer. Je ontvangers moeten overgehaald worden om te klikken. En het moet duidelijk zijn wat volgt na het klikken (bestellen, downloaden).

Ik raad je aan je call-to-action als button weer te geven. Experimenteer met kleur, vorm en grootte om na te gaan wat bij jouw publiek het beste werkt.

Steeds vaker zie je grote HTML buttons. Die zijn gemakkelijk aan te klikken, ook op kleine mobiele schermpjes. Bovendien zijn ze ook zichtbaar als de ontvanger de afbeeldingen geblokkeerd heeft.

Footer: benut deze ruimte ook

De footer is het laatste onderdeel van je e-mail. Meestal vind je daar de contactgegevens, privacy statement en reageer- en uitschrijflink. Maar je kunt er nog veel meer mee doen!

Een goede manier om de respons van je bericht te verhogen is om een lijstje met nuttige links op te nemen. Ik noem dat ‘catch-all’, links naar pagina’s op je website met informatie voor ontvangers die in de overige content niets interessants hebben gevonden. Je zult zien dat je doorklikpercentage stijgt.

Nog even over de ideale breedte van je e-mail design

Tot slot nog even aandacht voor de breedte van e-mails. Ik zie weleens mails van 2000 pixels breed voorbij komen:

Er zijn veel verschillende schermbreedtes, maar 2000 pixels is wel wat veel van het goede. Ga uit van 500 tot 600 pixels, dat komt meestal goed over. Wil je ook rekening houden met mobiele gebruikers, dan moet het nog smaller. Hanteer dan een responsive design, daarbij past de breedte zich aan het apparaat waarop geopend wordt aan.

(Dit artikel is een bewerking van de whitepaper ‘Anatomy of the perfect Email Design’ van Lyris, met toevoeging van voorbeelden uit onze eigen praktijk.)