Optimalizace emailu: Není HTML jako HTML

"Chci HTML e-mail"

HTML má mnoho verzí - dnes se nejčastěji pracuje s HTML5, dynamickým obsahem, javascripty, a dalšími technologiemi, které se obvykle nazývají Web 2.0 a umožňují vytvářet úžasně dynamické stránky, animovat obsah a používat efektní přechody. Nic z toho není v e-mailech možné... Webový kodér tak narazí na historickou bariéru, se kterou vetšinou nemá žádné zkušenosti.

Setkáváme se s tím skoro každý den - grafik připraví klientovi šablonu pro jeho nový e-mail, dodá ji v HTML a výsledek je moderní, krásný, ... a nepoužitelný. Návrh a kódování pro e-mail má svá velmi striktní pravidla a zároveň mnoho výjimek pro jednotlivé e-mailové klienty. Pokud si grafik a kodér nejsou těchto pravidel a omezení vědomi, výsledek obvykle skončí velmi špatně a vede ke kompletnímu redesignu.

Řešením není ani realizace e-mailových kampaní v čistě grafické podobě, neboť tento druh kampaní je nutné dávkovat velmi opatrně. U čistě grafické kampaně je výrazně náročnější příjemce zaujmout a docílit tak požadované akce a dochází tak mnohem rychleji k ignoraci e-mailů ze strany příjemců.

Naopak při použití kampaní obsahujících jak textové informace, tak grafické prvky má odesílatel mnohem větší možnost příjemce obsahem zaujmout. Tato varianta si však vyžaduje pečlivou přípravu a zpracování. Zarovnání, odsazení, barvy textu a odkazů, zobrazování obrázků, celková koncepce... - zde všude pak může dojít k výraznému rozdílu ve vzhledu e-mailu napříč různými poštovními klienty. Ačkoli výsledný e-mail nemusí být nutně zcela nečitelný, rozhodně kazí dojem a snižuje účinnost kampaně.

Zobrazování e-mailové zprávy napsané v HTML kódu neoptimalizovaném pro poštovní klienty:

Optimalizovaná HTML šablona

Oproti tomu stejný návrh s použitím optimalizované šablony myslí na všechny poštovní klienty napříč všemi možnými zařízeními, kde jde e-mail číst. Počítá s jejich specifiky a přizpůsobuje se jim. Pokud je HTML kód "správně" napsán pro poštovní klienty, tak se odesílaná zpráva zobrazí všude čitelně a bezvadně. E-mail tak bude perfektní jak v Outlooku, tak ve webové poště freemailové služby, tak i v mobilu či tabletu.

Zobrazování e-mailové zprávy napsané v HTML kódu optimalizovaném pro poštovní klienty:

V některých případech se klient rozhodne pro optimalizaci s cílem vytěžit maximum podporovaných možností na určité skupině e-mailových klientů, které nejčastěji používají jeho příjemci na úkor kompatibility s méně rozšířenými klienty. Na tomto přístupu není nic špatného, pokud mu předchází dostatečná analýza používaných zařízení a klientů. Bohužel se často setkáváme s tím, že klient upřednostňuje zobrazení kampaně ve svém specifickém e-mailovém klientu na úkor kvality zobrazení v klientech příjemců - optimalizace zobrazení by se měla proto vždy provádět s ohledem na finální příjemce a nikoliv na jednotlivce v rozhodovacím procesu, který může používat zcela atypické prostředí.

Kontrola zobrazování

Už tedy víte, že je vhodné se obrátit na kodéra, který má zkušenosti s kódováním e-mailů, než na webdesignera, jehož specializace je někde jinde. Ale jak si dodaný HTML kód zkontrolovat? Jak zjistit, jak se e-mailová zpráva zobrazuje v jakých poštovních klientech. Jednoduše. V Mailkitu použijte náhledy - Mailkit vám zdarma ukáže, jak se vaše e-mailová kampaň zobrazuje v následujících e-mailových klientech:

• Seznam.cz
• Centrum.cz
• Azet.sk
• Zoznam.sk
• Outlook 2003
• Gmail

Pro pokročilejší testování je pak k dispozici sada zpoplatněných náhledů (pro uživatele Syndicate & Agency je 50 vygenerování kompletní sady náhledů za měsíc zdarma), ve které naleznete dalších více jak 40 poštovních klientů:

• Android 2.3 *
• Android 4.2 *
• AOL Mail (Explorer)
• AOL Mail (Firefox)
• AOL Mail (Chrome)
• Apple Mail 7
• Apple Mail 8
• BlackBerry 4 OS *
• BlackBerry 5 OS *
• Color Blindnes (simulovaná barvoslepost)
• Gmail (Android) *
• Gmail (Firefox)
• Gmail (Chrome)
• Google Apps (Explorer)
• Google Apps (Firefox)
• Google Apps (Chrome)
• iPad (Retina displej) *
• iPad Mini *
• iPhone 5s (iOS 7) *
• iPhone 5s (iOS 8) *
• iPhone 6 *
• iPhone 6 Plus *
• Lotus Notes 7
• Lotus Notes 8
• Lotus Notes 9
• Office 365 (Explorer)
• Office 365 (Firefox)
• Office 365 (Chrome)
• Outlook 2000
• Outlook 2002/XP
• Outlook 2007
• Outlook 2010
• Outlook 2013
• Outlook 2016 (Mac OS)
• Outlook.com (Explorer)
• Outlook.com (Firefox)
• Outlook.com (Chrome)
• Mozilla Thunderbird
• Windows Phone 7.5 *
• Windows Phone 8 *
• Yahoo! Mail (Explorer)
• Yahoo! Mail (Firefox)
• Yahoo! Mail (Chrome)

* Jedná se o náhledy zobrazení na mobilních zařízeních.

Nezapomeňte, že kontrola zobrazení není otázkou estetiky, ale především účinnosti - tak, jako má znění předmětu vaší zprávy vliv na míru otevření, tak má struktura, vzhled a obsah vaší kampaně zásadní vliv na její úspěšnost co do počtu prokliků a tím i vaše obchodní výsledky.

Ani sebezajímavější sdělení nebude úspěšné, pokud ho příjemce neuvidí - zamyslete se proto již ve fázi návrhu vaší kampaně nad tím, jakou formu zvolíte, kde a jak budou prezentovány prvky, kterými budete zaujímat pozornost vašeho příjemce a zda budou vždy dobře viditelné. Vyhněte se plně grafickým e-mailovým kampaním se zbytečně rozsáhlou nabídkou a délkou - e-mail není leták ani katalog.

Pokud vaše kampaň nezaujme v prvních cca 10 centimetrech, příjemce o obsah ztratí zájem. Je jen velmi málo vyjímek z tohoto pravidla a ty jsou postavené především na dlouhodobé a systematické práci s příjemci a budování značky. Přípravu kampaně proto rozhodně nepodceňujte a od počátku pracujte na budování vaší image a komunikaci se zákazníky.

Pokud potřebujete pomoc s přípravou či optimalizací vaší kampaně, nebo potřebujete poradit, neváhejte nás kontaktovat.