Triky pri tvorbe newslettera: Šablóny, kódovanie a užitočné nástroje

Pri tvorbe newslettera sa môžete poriadne zapotiť. Občas je to raketová veda, pretože každý e-mailový klient (Centrum, Gmail, Outlook atď.) môže zobraziť konkrétne časti odlišne. Ako sa s tým vysporiadať a čo by ste mali dodržiavať? To sa dozviete práve v tomto článku.

Každý deň chodia užívateľom desiatky e-mailov a vy sa musíte prebojovať medzi tie, ktoré automaticky neskončia v koši alebo ešte horšie – označené ako spam. Na to vám nepomôže len skvelý obsah, dôležitá je aj dobrá forma.

Najistejším variantom je použitie editora priamo v mailingovom nástroji. To zaručí, že sa väčšine klientov zobrazia newslettery správne. Na druhej strane ste však limitovaní tým, čo editor dokáže. Preto sa v PROFICIU neobmedzujeme len na fungovanie v rámci daného nástroja, ale šablóny kódujeme aj priamo na mieru. Vďaka tomu si môžeme v newsletteri vytvoriť prakticky čokoľvek.

Ako postupovať pri tvorbe šablóny a ktoré nástroje použiť? 

V PROFICIU postupujeme tak, že najskôr urobíme audit aktuálneho stavu. Potom skontrolujeme šablóny a pozrieme sa na najdôležitejšiu vec – doručiteľnosť. Následne navrhneme, čo by sa dalo zlepšiť.

Čo všetko kontrolujeme?

  • Je šablóna responzívna? Zobrazuje sa správne na mobile a tablete?
  • Vykresľuje sa korektne vo väčšine najpoužívanejších e-mailových klientov? Na toto testovanie používame nástroj Email on Acid.
  • Presvedčíme sa, že šablóna neobsahuje zakázaný obsah, ako sú skracovače typu Bitly, scripty atď.
  • Pozrieme na dizajn šablóny. Zhoduje sa s webom? 
  • Nie je šablóna celoobrázková? Majú grafiky doplnené alt popisy, prípadne prázdny alt=““, ak šablónu kódujete? Tento popis sa zobrazí v prípade, že sa obrázok nenačíta. Na lepšiu čitateľnosť ho môžete aj nastylovať.
  • Dajte si tiež pozor na zlý pomer plochy obrázkov a textov. Presné číslo nie je stanovené a každý klient s ním pracuje rozdielne. Stačí však, keď sa vyvarujete celoobrázkovým e-mailom.
  • Používate v šablóne odporúčanú šírku 600 až 700 px? Ak bude váš e-mail širší, tak sa v niektorých klientoch zobrazí až po scrollovaní.
  • CTA prvky (napríklad tlačidlá) nakódované v HTML? Ak nie a vkladáte ich ako obrázok s odkazom, je možné že sa niekde vôbec nezobrazia.
  • Aká je veľkosť odosielanej správy? Aj na tom záleží, pretože nad zhruba 102 kB sa v Gmaili časť správy oreže. Veľkosť zistíte vo vašom nástroji alebo si šablónu stiahnite na disk. Prípadne si ju otestujte zaslaním testu na Gmail.
  • Máte nastavené odkazy tam, kde to dáva zmysel? Všeobecne sú to miesta ako nadpis, obrázok a CTA.
  • Dajte si pozor na zlý kontrast v texte. Písmo by malo byť čitateľné.
  • Odlíšte sa a použite animovaný obrázok. Napríklad na zľavové akcie sa hodí odpočítavanie do ich skončenia. Na to si môžete vyskúšať Sendtric. Animáciu si zasa môžete vytvoriť v EZGIF.
  • Aká je doručiteľnosť? Máte nastavené DKIM, SPF, DMARC? Aká je kvalita databázy? Otestujte si ju napríklad v nástroji Neverbounce.

Tip: Dajte si pozor na GIF. Napríklad Outlook v niektorých verziách zobrazí len prvú snímku z GIFu. Prípadne môžete použiť podmienky a v Outlooku zobraziť obrázok a v inom klientovi GIF.

Vlastná tvorba e-mailingovej šablóny

Podľa výsledkov auditu pristúpime k úprave šablóny v editore alebo si šablónu nakódujeme na základe vytvoreného návrhu. Na to používame tieto nástroje:

Existujú aj editory na tvorbu šablón. Pekné si vytvoríte zdarma napríklad v nástrojoch:

Tip: Prekáža vám, že Outlook automaticky pridáva odkaz na adresy, dátum a telefónne čísla? Upravte si šablóny podľa návodu.

Práca v obľúbenom Mailchimpe

Jeden z najpopulárnejších e-mailingových nástrojov Mailchimp má svoj kódovací jazyk. Vďaka nemu si môžete šablónu sami vytvoriť a pomocou premenných ju dokonca urobiť editovateľnou.

Dokumentáciu k Mailchimp’s Template Language nájdete tu. S Mailchimpom máme niekoľkoročné skúsenosti, takže vám prípadne s čímkoľvek radi poradíme. Nájdete nás tiež medzi expertmi na Mailchimp.

Šablónu máme. Na čo si dať pozor pri rozosielaní?

Prichádza čas rozosielania. Najskôr skontrolujte meno odosielateľa. Príjemcovia najskôr pozerajú na odosielateľa a až potom na predmet. Neskrývajte svoju identitu, príjemca by mal byť jasný. Zabudnite na adresy typu no-reply a neodpovedať. Odosielacia adresa musí byť živá a ideálne tiež špeciálne určená pre newsletter (napríklad newsletter@ nebo novinky@). Dobré je tiež to, keď je na o rad vyššej doméne, teda novinky@newsletter.proficio.sk. Hlavne ale odlíšte komunikáciu na transakčné e-maily a newsletter – nepoužívajte jednu adresu na všetko.

  • Využite celý priestor, ktorým môžete zaujať zákazníka. Nezabúdajte vyplniť preheader text, ktorý sa zobrazuje za predmetom.
  • Obmedzte používanie špeciálnych znakov v predmete, pretože niektorí klienti to penalizujú. Slniečka, lietadlá a kolieska môžete umiestniť práve do preheaderu.
  • NEPÍŠTE PREDMET VEĽKÝMI PÍSMENAMI! Jedno slovo je v poriadku, celý predmet však určite nie.
  • Nepoužívajte nevhodné slová.

Tak ukážte sa, či nájdete chybu v tomto predmete: Just 1 € From Vienna Airport to Maribor Via Graz. Napíšte nám do komentárov ;)

Tip: Nechcete, aby bol obrázok v newslettri ako odkaz? Pozor na Gmail, ktorý po prekliku zobrazí obrázok v okne a zobrazuje odkaz obrázku na stiahnutie. Ak tomu chcete predísť, nastavte na obrázok prázdny odkaz. Viac informácií nájdete tu.

Kedy posielať?

To záleží na okolnostiach. Podľa dát z e-shopu dokážete zistiť, kedy ľudia najčastejšie nakupujú. To môže byť odrazový mostík. V iných prípadoch testujte, testujte a testujte. Z našej praxe najlepšie vychádzajú utorok a štvrtok dopoludnia. Meniť môžete aj odosielateľa alebo napríklad rozloženie newslettra. Preverujte však vždy len jednu zmenu, aby ste test mohli vyhodnotiť. Zaujímate sa o e-mailing? Potrebujete poradiť s nastavením vášho mailingového nástroja? Nemáte čas na mailnig a hľadáte niekoho na správu? Napíšte nám!


Luboš Segeťa

Od roku 2013 mě pohltil e-mail marketing. Snažím se v něm zužitkovat znalosti z tvorby webů a online marketingu. Hledám způsoby, jak co nejefektivněji budovat vztah mezi klientem a potenciálním zákazníkem.