How to

Checklist voor optimaal ontwerp van de e-mailnieuwsbrief

0

De e-mail nieuwsbrief is een belangrijk online marketingmiddel. Vanuit ontwerpersperspectief is het de uitdaging om de nieuwsbrief elke keer weer zo aantrekkelijk mogelijk te maken. In mijn vorige artikel ging ik in op het optimaal bereik. In dit artikel tips voor het optimaliseren van het ontwerp van de e-mailnieuwsbrief.

In de afbeelding hieronder vind je een schets van hoe de ideale nieuwsbrief opgebouwd is. Tips per onderdeel worden hieronder besproken.

Figuur 1. De e-mail nieuwsbrief

Figuur 1. De e-mailnieuwsbrief

1.Linker bovenhoek: bevat de belangrijkste call for action

De linker bovenhoek is het belangrijkste gedeelte van de nieuwsbrief. Dit is wat de ontvanger als eerste onder ogen krijgt. Dit geldt vooral voor zakelijke ontvangers, aangezien Outlook-gebruikers vaak een leesvenster rechts of beneden in beeld zien. Plaats daarom de belangrijkste call for action in de eerste 10 centimeter (±380 pixels) van de linker bovenhoek. Lees hierover en over hoe om te gaan met de header, pre-header, onderwerp, afzender en linker bovenhoek in mijn vorige artikel.

2.Banner header: plaats sitenavigatie

Overweeg om het logo en de navigatie in de e-mail op te nemen. Hiermee bied je lezers de mogelijkheid meer over jouw bedrijf te ontdekken dan alleen de content in de mail. Neem niet zomaar de navigatie van de site over, maar plaats alleen items die relevant voor de lezer zijn. Zo triggert een ‘Alle aanbiedingen’ wel, maar ‘Over ons’ minder. Het voorbeeld hieronder van Sjopze.nl speelt hier goed op in door alleen triggerende navigatie-items zoals ‘Aanbiedingen’ en ‘kortingscodes’ te presenteren.

Figuur 2. Sjopze nieuwsbrief met triggerende navigatie en goed onderwerp

Figuur 2. Sjopze nieuwsbrief met triggerende navigatie en goed onderwerp

3.Het content gedeelte: tips

Schrijf tekst kort en bondig

Een lezer scant een e-mailnieuwsbrief gemiddeld 51 seconden. Maak daarom de tekst zo kort en scanbaar mogelijk door gebruik te maken van:

  • Bullets met maximaal 1 regel tekst erachter
  • Nummers en tekens (niet voluit geschreven: € is veel beter scanbaar dan ‘euro’)
  • Vetgedrukte tekst voor de belangrijkste boodschap
  • Links en ‘call for action’-buttons (gebruik geen ‘klik hier’ of ‘lees meer’, maar veelzeggende teksten als ‘bekijk de aanbiedingen’)
  • 1 onderwerp per paragraaf (noem het onderwerp in de eerste zin)
  • Een samenvatting van maximaal 25 woorden bovenaan de e-mail
  • Een maximale breedte van 500 a 600 pixels, om horizontaal scrollen te vermijden
  • Afbeeldingen. Ook deze versterken de focus van de lezer: de tekst naast een afbeelding wordt meer gelezen.
  • Vergeet ook niet dat veel gebruikers de mail op een mobiele telefoon bekijken. Het eerste mobiele scherm toont gemiddeld 100 karakters, ongeveer 20 tot 25 woorden.

Vermijd het gebruik van rich media of formulieren

Houd de opmaak zo simpel mogelijk. Gebruik geen rich media of formulieren, omdat deze geblokkeerd kunnen worden door mailservers. Wil je wel rich media of formulieren gebruiken, plaats dan een preview in de mail en een link naar de site.

Laat de vormgeving  aansluiten bij die van de site

Gebruik voor herkenning en consistentie na het doorlinken herkenbare visuele elementen uit je website, overeenkomstig met de merkwaarden.

Het gebruik van afbeeldingen

Afbeeldingen worden veelal gebruikt om de nieuwsbrief een aantrekkelijkere uitstraling te geven. Sommige nieuwsbrieven hebben de gehele content in een afbeelding staan. Een groot probleem bij het gebruik van afbeeldingen is echter dat mailservers afbeeldingen standaard kunnen blokkeren. In plaats van de afbeelding staat er een kruis. Enkele tips om slim om te gaan met afbeeldingen:

  • Gebruik afbeeldingen ter ondersteuning van de content en niet als basis. De hele nieuwsbrief moet te begrijpen zijn zonder de afbeeldingen
  • Zorg voor goede alt-teksten als compensatie voor geblokkeerde afbeeldingen
  • Voeg in de code van afbeeldingen de hoogte en breedte toe, zodat de lay-out van de e-mail niet verandert bij blokkering van afbeeldingen
Figuur 3. Geblokkeerde afbeeldingen zorgen ervoor dat de boodschap van de Skype mail in eerste instantie niet overkomt

Figuur 3. Geblokkeerde afbeeldingen zorgen ervoor dat de boodschap van de Skype-mail in eerste instantie niet overkomt.

De opmaak van het contentgedeelte

Voor de opmaak van het contentgebied zijn meerdere mogelijkheden. Zorg er in ieder geval voor dat de e-mail start met een samenvatting in maximaal 25 woorden. Hierop baseert de lezer of hij verder leest of niet.

KPN varieert in de opmaak van haar nieuwsbrieven: van tekstueel tot visueel. Door niet steeds voor dezelfde opmaak te kiezen, trekt een mail weer opnieuw de aandacht van zijn lezer.

Figuur 4. KPN varieert in de opmaak afhankelijk van het doel van de mail; informatief, verkoopgericht en loyaliteitgericht

Figuur 4. KPN varieert in de opmaak, afhankelijk van het doel van de e-mail: informatief, verkoopgericht of loyaliteitgericht.

Figuur 5. NS informatieve manier van presenteren

Figuur 5. NS: informatieve manier van presenteren.

De NS stuurt een e-mail die er nogal informatief uit ziet, terwijl deze wel acties bevat. ‘Lees meer’ als tekst op de knoppen helpt niet bij het versterken van de boodschap.  Content naast de afbeeldingen plaatsen helpt wel om de aandacht naar de titels te trekken.

Figuur 6. Neiman Marcus speelt helemaal in op “hurry up marketing” en exclusiviteit voor de lezer

Figuur 6. Neiman Marcus speelt helemaal in op ‘hurry up marketing’ en exclusiviteit voor de lezer.

Het voorbeeld van Neiman Marcus is helemaal gericht op conversie. Door de actie als exclusief te bestempelen en door de tikkende klok, weet de lezer dat hij snel tot actie over moet gaan. Bij deze actie bestaat echter het gevaar dat het gehele bericht niet zichtbaar is doordat de afbeelding geblokkeerd wordt. Nieuwe abonnees zullen dus slechts een kruis te zien krijgen in hun e-mail. Abonnees die jouw bedrijf als ‘veilige afzender’  hebben bestempeld, krijgen wel direct de afbeelding te zien. Je zou dus kunnen overwegen om twee versies van je e-mailnieuwsbrief te verzenden.

4.Aanhef en sign off : persoonlijk

Maak de e-mail zo persoonlijk mogelijk. Dit kan door de naam van de ontvanger in de aanhef te gebruiken. En door een persoonlijke sign off the plaatsen. De sign off is de afsluiting van de e-mail. Herhaal  hier de call for action en maak duidelijk van wie de mail komt, het liefst persoonlijk ondertekend.

Figuur 7. Persoonlijk ondertekende sign off van Crutchfield en een e-mail adres van de oprichter van Trendwatching

Figuur 7. Persoonlijk ondertekende sign off van Crutchfield en een e-mailadres van de oprichter van Trendwatching.

5.De footer: adres en uitschrijfopties

Geef het fysieke adres van je bedrijf weer. Dit toont aan dat het om een ‘echt’ bedrijf gaat, waar je bij problemen ook mensen te spreken krijgt. Plaats een link waarmee de lezer zich kan uitschrijven. Bied naast uitschrijven de optie om een e-mailadres en de voorkeuren van de ontvanger aan te passen. Als de gebruiker slechts iets aan zijn instellingen wil veranderen of niet zo vaak een e-mail wil ontvangen, verlies je zonder deze optie de lezer. Een andere optie is het bieden van een pauze-optie. Steven Fockema Andreae schrijft hierover in zijn artikel. Dit biedt de gebruiker de optie om geen nieuwsbrieven tijdens zijn vakantie te krijgen of juist alleen wintersportnieuwsbrieven te ontvangen in de maanden voor het wintersportseizoen.

In de footer kunnen ook functionaliteiten als ‘share with friends’, ‘follow us on twitter’ of ‘become our fan on facebook’ opgenomen worden.

Figuur 8. Persoonlijke sign off en footer met opties om e-mailadres aan te passen of uit te schrijven

Figuur 8. Persoonlijke sign off en footer met opties om e-mailadres aan te passen of uit te schrijven.

Tot slot

Gebruik deze tips om het ontwerp van je e-mailnieuwsbrief te optimaliseren. Onderzoek daarnaast welke mailservers het meest gebruikt worden door jouw abonnees en optimaliseer de nieuwsbrief hiervoor. De e-mail staat zeker niet op zich. De landingspagina waar de gebruiker na doorklik op terechtkomt, moet goed aansluiten bij je nieuwsbrief. En uiteindelijk gaat het natuurlijk om de conversie. Meet waar de bezoekers (mogelijk) uitvallen. Als je weet waar de flow niet goed loopt, kun je in een usability-test uitzoeken waarom het daar fout gaat.

De e-mail nieuwsbrief is een belangrijk online marketingmiddel. Vanuit ontwerpers perspectief is het de uitdaging om de nieuwsbrief elke keer weer zo aantrekkelijk mogelijk te maken. In mijn vorige artikel ging ik in op het optimaal bereik. In dit artikel tips voor het optimaliseren van het ontwerp van de e-mail nieuwsbrief.
In de afbeelding hieronder vind je een schets van hoe de ideale nieuwsbrief opgebouwd is. Tips per onderdeel worden hieronder besprok