Ontwerp de perfecte e-mailtemplate

3 juli 2017

Nieuwsbrieven zijn een goede manier om je doelgroep te bereiken en je verkoop te verhogen. Hierin is het belangrijk dat je qua inhoud waardevol bent voor je abonnees en dat je opvalt in de mailbox. Dit betekent goede inhoud en een perfect ontwerp. In dit blog duik ik in de UX-kant van een e-mailontwerp. Dit gaat namelijk veel verder dan een goede titel en een overzichtelijke opmaak.

1-koloms opmaak
E-mails moeten steeds kleiner worden. E-mailclients, zoals Outlook, maar ook smartphones hebben meer beperkingen dan webbrowsers. Dit betekent dat de gemiddelde nieuwsbrief zelden groter is dan 600px breed. Kijk je naar het aantal kolommen, dan is een 1-koloms opmaak of maximaal 2-koloms aan te raden. Wanneer je nadenkt over de inhoud, kijk dan of je dit kunt samenstellen voor een 1-koloms opmaak, zodat de tekst lekker doorloopt op de pagina en gemakkelijk leest.

   

In het eerste voorbeeld hierboven, zie je een 1-kolomsopmaak. Waar je denkt dat een 1-koloms opmaak saai wordt, blijkt niks minder waar. De schuine hoeken en platte opmaak geven het geheel een modern en lekker leesbaar tintje. Het tweede voorbeeld laat een 2-koloms opmaak zien. Doordat er meerdere producten op dezelfde manier worden weergegeven, leent zich hier een 2-koloms opmaak. Zorg er dan wel voor dat deze opmaak ruim is opgezet en goed responsive is. Bij smallere schermen moet de informatie dan wel mooi onder elkaar klappen.

Zorg voor een sterke call-to-action
Wanneer je wilt dat je nieuwsbrief converteert, bijvoorbeeld doordat een bezoeker naar je website gaat of een aankoop doet, heb je een sterke call-to-action (CTA) nodig.
Een CTA is een button die een gebruiker aanmoedigt om te klikken. Deze button linkt mensen door naar je website of bijvoorbeeld een download- of bestellink. Wat voor een e-mail je ook stuurt, als het goed is heeft deze altijd een doel en wil je dat de gebruiker, naar aanleiding van je e-mail, iets doet.

Hieronder zie je een e-mail met een duidelijke CTA; Stuur $100. In dit geval om je vrienden $100 korting te geven op hun bestellingen bij Postmates. Besteed aandacht aan de tekst in je CTA. Zorg dat je een korte omschrijving gebruikt (maximaal 5 woorden), dat duidelijk is wat de button doet en dat men aangespoord wordt om dit nu te doen. Nog een mooi voorbeeld: na het zien van de mailing van American Airlines weet je ook precies waar je moet klikken om in te checken.

   

Informatie boven de vouw
Websites en smartphones kennen een zogeheten vouw. Dit is het bovenste gedeelte van je scherm en is het eerste dat men ziet. Informatie onder de vouw kan uit beeld verdwijnen en niet gezien worden door de gebruiker. Zet belangrijke content, of afbeeldingen die de aandacht trekken, altijd bovenaan. Dat haalt de gebruiker over om door te lezen en door te scrollen naar beneden.

Grid
Als je veel nieuwsbrieven ontvangt herken je terugkerende elementen. E-mails zijn vaak opgemaakt in vaste grids (roosters). Dit zorgt namelijk voor herkenbaarheid en biedt een snelle manier van werken; het wiel hoeft niet constant opnieuw te worden uitgevonden. Door de herkenbaarheid in je e-mailings door te voeren, kan een gebruiker de mailing snel scannen en de relevante informatie er gemakkelijk uithalen. Zie bijvoorbeeld deze e-mail van Google:

Door gebruik te maken van een grid probeer je de aandacht te pakken en het doel van je nieuwsbrief te verduidelijken. Combineer dit met een sterke opmaak (goed ontworpen en het liefst in 1 kolom) en een goede call-to-action. J hebt dan de basis voor een goede e-mailing.

Dit blog verscheen eerst op Designmodo


Comments

  1. lesbians humping - 11 november 2017 at 01:15 - Beantwoorden

    My programmer is trying to convince me to move to .net from PHP.
    I have always disliked the idea because of the expenses.
    But he’s tryiong none the less. I’ve been using Movable-type on a number of websites for about a year
    and am worried about switching to another platform.
    I have heard very good things about blogengine.net.
    Is there a way I can transfer all my wordpress content into it?
    Any help would be greatly appreciated!

  2. Kimber - 1 november 2017 at 15:19 - Beantwoorden

    It is proven to cause dysentery inside bees which
    results in death of entire colonies particularly in places the location where the temperatures are somewhat cold.
    So, when you complete your manuka honey facial, you are able to keep giving you better skin’s health insurance appearance with other natural ingredients like COQ10.
    You can never put a good enough price forever
    lessons as good advice from a specialist beekeeper go a long
    way in aiding that you becoming the very best you’ll be able to be.

  3. http://cufakaho.jigsy.com/ - 1 november 2017 at 15:14 - Beantwoorden

    We have all read that insecticides and pesticides include the basis for
    honey bee deaths and the claims certainly they make
    sense. So, once you complete your manuka honey facial, you
    are able to keep enhancing skin’s health and appearance along with other
    natural ingredients like COQ10. You can never
    put a good enough price for good lessons nearly as good advice from a professional beekeeper should go further in aiding you to definitely becoming the most effective you’ll be able
    to be.


Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *