Triky při tvorbě newsletteru: Šablony, kódování a užitečné nástroje

U tvor­by newslet­teru se můžete pořád­ně zapotit. Občas je to rake­tová věda, pro­tože každý e‑mailový klient (Sez­nam, Cen­trum, Gmail, Out­look apod.) může zobraz­it konkrét­ní části odlišně. Jak se s tím vypořá­dat a co byste obec­ně měli dodržo­vat? To se dozvíte právě v tom­to článku.

Každý den uži­vatelům chodí desítky e‑mailů a vy se musíte probo­jo­vat mezi ty, které auto­mat­icky neskončí v koši nebo ještě hůř – označené jako spam. K tomu vám nepomůže jen skvělý obsah, důležitá je také dobrá for­ma

Nejjistější variantou je použití edi­toru pří­mo v mailin­govém nástro­ji. To zaručí, že se většině klien­tů zobrazí newslet­tery správně. Na druhou stranu jste ale lim­i­to­vaní tím, co takový edi­tor umí. Pro­to se v PROFI­CIU neomezu­jeme pouze na fun­gování v rám­ci daného nástro­je, ale šablony také kódu­jeme pří­mo na míru. Díky tomu si můžeme v newslet­teru vytvořit prak­ticky cokoliv.

Jak pos­tupo­vat při tvor­bě šablony a které nástro­je použít? 

V PROFI­CIU pos­tupu­jeme tak, že nejprve provedeme audit aktuál­ního stavu. Poté zkon­trolu­jeme šablony a koukneme na nejdůležitější věc – doručitel­nost. Násled­ně navrhneme, co by se dalo zlepšit.

Co všech­no kontrolujeme?

  • Je šablona responzivní? Zobrazu­je se správně na mobilu a tabletu?
  • Vykres­lu­je se korek­t­ně na většině nejpouží­vanějších e‑mailových klien­tů? K tomu­to testování používáme nástroj Email on Acid.
  • Přesvědčíme se, že šablona neob­sahu­je zakázaný obsah, jako jsou zkra­co­v­ače typu Bit­ly, scrip­ty atd.
  • Koukneme na design šablony. Shodu­je se s webem?
  • Není šablona celoo­brázková? Mají grafiky doplněné alt popisky, pří­pad­ně prázd­ný alt=““, pokud šablonu kódu­jete? Ten­to popisek se zobrazí v pří­padě, že se obrázek nenačte. Pro lep­ší čitel­nost ho můžete také nastylo­vat.
  • Dejte si také pozor na špat­ný poměr plochy obrázků a tex­tu. Přes­né čís­lo není stanovené a každý klient (Sez­nam, Gmail) s ním pracu­je rozdíl­ně. Stačí ale, když se vyvaru­jete celoo­brázkovým e‑mailům.
  • Používáte v šabloně doporuče­nou šířku 600 až 700px? Pokud budě váš e‑mail širší, tak se v něk­terých klien­tech zobrazí až po scrollování. 
  • Jsou CTA prvky (napřík­lad tlačít­ka) nakó­dované v HTML? Jestli né a vkládáte je jako obrázek s odkazem, je možné, že se někde vůbec nezobrazí.
  • Jaká je velikost odesílané zprávy? I na tom záleží, pro­tože nad zhru­ba 102 kB se v Gmailu část zprávy ořízne. Velikost zjistíte ve vašem nástro­ji nebo si šablonu stáh­něte na disk. Pří­pad­ně si otes­tu­jte zasláním tes­tu na Gmail.
  • Máte nas­tavené odkazy tam, kde to dává smysl? Obec­ně jsou to mís­ta jako nad­pis, obrázek a CTA.
  • Dejte si pozor na špat­ný kon­trast v tex­tu. Pís­mo by mělo být čitelné.
  • Odlište se a použi­jte tře­ba ani­movaný obrázek. Napřík­lad pro slevové akce se hodí odpočítávání do jejich skončení. Na to můžete vyzk­oušet Sendtric. Ani­maci si zase můžete vytvořit v EZGIF.
  • Jaká je doručitel­nost? Máte nas­tavené DKIM, SPF, DMARC? Jaká je kvali­ta data­báze? Otes­tu­jte si ji napřík­lad v nástro­ji Never­bounce.

Tip: Dejte si pozor na GIF. Tře­ba Out­look v něk­terých verzích zobrazí jen první snímek z GIFu. Pří­pad­ně můžete použít pod­mínky a v Out­looku zobraz­it obrázek a v jiném klien­tu GIF.

Vlast­ní tvor­ba e‑mailingové šablony

Podle výsled­ků audi­tu přis­toupíme k úpravě šablony v edi­toru nebo si šablonu nakó­du­jeme na zák­ladě vytvořeného návrhu. K tomu používáme tyto nástroje:

Exis­tu­jí také edi­to­ry na tvor­bu šablon. Pěkné si zdar­ma vytvoříte napřík­lad v nástrojích:

Tip: Vadí vám, že Out­look auto­mat­icky přidává odkaz na adresy, datum a tele­fon­ní čís­la? Upravte si šablony dle návo­du.

Práce v oblíbeném Mailchimpu

Jeden z nejpop­ulárnějších e‑mailingových nástro­jů Mailchimp má svůj kódovací jazyk. Díky němu si můžete šablonu sami vytvořit a pomocí proměn­ných ji dokonce udělat editovatelnou. 

Doku­mentaci k Mailchim­p’s Tem­plate Lan­guage najdete zde. S Mailchim­pem máme něko­likaleté zkušenos­ti, takže vám pří­pad­ně s čímko­liv rádi poradíme. Najdete nás také mezi exper­ty na Mailchimp.

Tip: Vkládáte odkaz na YouTube? Vložte ho pomocí YouTube zkra­co­v­ače, jinak se video zobrazí na Sez­na­mu špat­ně a může to rozhodit design e‑mailu.

Šablonu máme. Na co si dát pozor při rozesílce?

Přichází čas na rozesílku. Nejdříve zkon­trolu­jte jméno odesílatele. Pří­jem­ci prvně kouka­jí na odesílatele a teprve pak na před­mět. Neskrýve­jte svou iden­ti­tu, pří­jem­ce by měl být jas­ný. Zapomeňte na adresy typu no-reply a neodpovidat.

Odesílací adresa musí být živá a ideál­ně také speciál­ně určená pro newslet­ter (napřík­lad newsletter@ nebo novinky@). Dobré je také to, když je na doméně o řád vyšší, tedy novinky@​newsletter.​proficio.​cz. Přede­vším ale odlište komu­nikaci pro transakční e‑maily a newslet­ter – nepoužíve­jte jed­nu adresu pro všech­no.

  • Využi­jte vešk­erý pros­tor, kterým můžete zau­j­mout zákazní­ka. Neza­pomíne­jte vyplnit pre­head­er text, který se zobrazu­je za předmětem. 
  • Omezte používání speciál­ních znaků v před­mě­tu, pro­tože napřík­lad Sez­nam to penal­izu­je. Sluníč­ka, letad­la a koleč­ka můžete umístit právě do preheaderu.
  • NEPIŠTE PŘED­MĚT VELKÝ­MI PÍS­ME­NY! Jed­no slo­vo je v pořád­ku, ale celý před­mět určitě né. 
  • Vyvaru­jte se nevhod­ných slov. 

Schvál­ně, jestli najdete chy­bu v tom­to před­mě­tu: Just 1 € From Vien­na Air­port to Mari­bor Via Graz. Napište nám do komentářů. ;)

Tip: Nechcete, aby byl obrázek v newslet­teru jako odkaz? Pozor na Gmail, který po prok­liku zobrazí obrázek v okně a zobrazu­je odkaz obrázku ke stažení. Pokud tomu chcete přede­jít, tak nas­tavte na obrázek prázd­ný odkaz. Více infor­ma­cí najdete tady.

Kdy poslat?

To záleží na okol­nos­tech. Podle dat z e‑shopu dovedete poz­nat, kdy lidé nejčastěji nakupu­jí. To může být odra­zový můstek. V jiných pří­padech tes­tu­jte, tes­tu­jte a tes­tu­jte. Z naší praxe nejlépe vycháze­jí úterý a čtvrtek dopoledne. Měnit můžete i odesílatele nebo tře­ba rozložení newslet­teru. Prověřu­jte ale vždy jen jed­nu změ­na, ať test můžete vyhodnotit.

Zajímáte se o e‑mailing? Potře­bu­jete pora­dit s nas­tavením vaše­ho mailin­gového nástro­je? Nemáte čas na mail­ing a hledáte něko­ho na správu? Napište nám!

Luboš Segeťa
Luboš Segeťa

Od roku 2013 mě pohltil e‑mail mar­ket­ing. Snažím se v něm zužitko­vat znalosti z tvor­by webů a online mar­ketingu. Hledám způ­so­by, jak co neje­fek­tivněji budovat vztah mezi klien­tem a poten­ciál­ním zákazníkem.