Průměrný čtenář se rozhodne za 2-3 vteřiny, jestli bude v e-mailu pokračovat nebo ne. Říká se, že dneska uživatel nečte, ale skenuje.
A skenování se dá předvídat, existují vzorce, které můžete využít i při tvorbě svých newsletterů. Pokud váš design těmto vzorům odpovídá, čtenář přirozeně dojde tam, kam ho chcete – ke kliknutí. Pokud ne, zavře e-mail a vy se nikdy nedozvíte proč.
V dnešním newsletteru se podíváme na 3 nečastější vzory, které v designu fungují a vy je můžete využívat při přípravě svých e-mailů.
Vzor #1: F pattern – pro e-maily s více textem
F vzor vychází z heatmap studií. Oko nejprve přelétne horní část e-mailu zleva doprava, pak se vrátí doleva a sjede dolů – vzniká tvar písmene F.
Využijte to takhle:
- Header nahoře musí zaujmout okamžitě – to je první horizontální přelet
- Klíčová informace patří doleva – tam oko začíná každý nový řádek a tráví tam nejvíce času
- Podnadpisy a odrážky usnadňují skenování podél levého okraje
- Doplňující info a detaily klidně vpravo – čtenář se k nim dostane, když ho obsah zaujme
- CTA dejte dolů doleva – přesně tam, kde oko přirozeně skončí
Kdy ho použít: newslettery, informativní e-maily, e-maily s více sekcemi.
Vzor #2: Z pattern – pro vizuálně silné kampaně
Z vzor funguje jinak. Oko jde z levého horního rohu doprava, pak diagonálně dolů doleva, a znovu doprava – vzniká Z. Vychází z tzv. Gutenberg Diagramu.
Klíčová pravidla:
- Nejdůležitější informaci dejte do první “nohy” Z – horní levý roh
- Výrazné vizuály nebo nadpisy podél celé Z dráhy drží pozornost
- Minimum textu – Z vzor funguje, jen pokud zpráva je stručná a jasná
- Rozvržení musí být vyvážené – žádná sekce nesmí být přeplněná, jiná prázdná
Kdy ho použít: promo kampaně s produktovými fotkami, akce, image-heavy emaily.
Vzor #3: Obrácený trojúhelník – pro jedno jasné sdělení
Tohle je nejjednodušší a nejsilnější vzor pro ecommerce a spoustu akčních e-mailů.
Základna trojúhelníku je nahoře – tam je nejdůležitější informace. Obsah se postupně zužuje směrem dolů. Na špičce trojúhelníku je CTA.
Jak ho sestavit:
- Header nebo logo – vizuálně silný vstup, posiluje značku
- Hlavní zpráva rovnou – co nabízíte, proč teď, žádné omáčky
- Podpůrné detaily níže – výhody, podmínky, doplňující info
- Jedno silné CTA tlačítko úplně dole – špička trojúhelníku
Kdy ho použít: flash sale, limitované nabídky, jednoduché oznámení s jednou akcí.
Realita je, že většina e-shopů tyhle vzory nezná a staví e-maily intuitivně. Výsledek je, že oko čtenáře nemá kam jít – a čtenář klikne jinam.
Co si z toho odnést
Nemusíte redesignovat celou šablonu. Stačí se při příštím e-mailu zeptat: “Jakou cestou povedu oko čtenáře od otevření ke kliknutí?”
Vyberte vzor podle obsahu, umístěte CTA tam, kde oko přirozeně skončí, a porovnejte výsledky s předchozí kampaní.
Pokud chcete projít vaše šablony a podívat se, jestli vizuální struktura pomáhá nebo škodí konverzím, napište mi, rád se na vaše e-maily podívám 😉
