Če odprete sistem za upravljanje vsebine za izdelavo spletnih strani, je to precej preprost postopek. Sodobni spletni brskalniki podpirajo HTML, CSS in JavaScript za a strogo niz spletnih standardov. In v resnici so le peščica brskalnikov, za katere morajo skrbeti oblikovalci. Seveda obstajajo izjeme ... in nekaj preprostih rešitev ali funkcij, značilnih za te brskalnike.
Zaradi splošnih standardov je zelo enostavno razviti ustvarjalnike strani v sistemih za upravljanje vsebin. Brskalniki so skladni s HTML5, CSS in JavaScript… razvijalci pa lahko zgradijo neverjetno robustne rešitve za izdelavo spletnih strani, ki se odzivajo na naprave in so dosledne v brskalnikih. Pred dvema desetletjema je skoraj vsak spletni oblikovalec uporabljal namizno programsko opremo za razvoj spletnih strani. Zdaj je precej nenavadno, da spletni oblikovalec razvije spletno stran – pogosteje kot ne, razvijajo predloge in uporabljajo urejevalnike v sistemih vsebine, da zapolnijo vsebino. Uredniki spletnih strani so fantastični.
Toda e-poštni uredniki močno zaostajajo. Evo zakaj…
Oblikovanje e-poštnih sporočil HTML je veliko bolj zapleteno kot za spletno mesto
Če vaše podjetje želi oblikovano čudovito HTML e-pošto, je postopek eksponentno bolj zapleten kot izdelava spletne strani iz več razlogov:
- Brez standardov – NI strogega spoštovanja nobenega spleta standardi e-poštnih odjemalcev, ki prikazujejo e-pošto HTML. Pravzaprav virtualno vsak e-poštni odjemalec in vsaka različica vsakega e-poštnega odjemalca deluje drugače. Nekateri bodo spoštovali CSS, zunanje pisave in sodoben HTML. Drugi spoštujejo nekaj vgrajenega sloga, prikažejo samo zbirko pisav in prezrejo vse razen struktur, ki jih poganja tabele. V tem trenutku je pravzaprav precej smešno, da se nihče ne ukvarja s tem vprašanjem. Posledično je oblikovanje predlog, ki se dosledno upodabljajo med strankami in napravami, postalo velik posel in je lahko precej drago.
- Varnost e-poštnega odjemalca – Samo ta teden je Apple Mail posodobljen, da privzeto blokira vse slike v e-poštnih sporočilih HTML, ki niso vdelane v e-pošto. Dovolite jim, da naložite e-pošto naenkrat, ali pa morate omogočiti nastavitve, da onemogočite to nastavitev. Poleg varnostnih nastavitev e-poštnega odjemalca obstajajo tudi nastavitve podjetja.
- IT varnost – Vaša ekipa za IT lahko uvede stroge nabore pravil o tem, kateri predmeti se dejansko lahko upodabljajo v e-pošti. Če vaše slike na primer prihajajo iz določene domene, ki ni na seznamu dovoljenih v požarnem zidu podjetja, slike preprosto ne bodo prikazane v vaši e-pošti. Včasih smo morali razviti e-pošto in vse slike gostiti na strežniku korporacije, da so lahko njihovi zaposleni videli slike.
- Ponudniki e-poštnih storitev – Da bi bile zadeve še hujše, ustvarjalci e-pošte, ki ponudniki e-poštnih storitev (ESPs) dejansko uvajajo težave, ne pa jih omejujejo. Medtem ko promovirajo njihov urednik je Kar vidiš to dobiš (WYSIWYG), pri oblikovanju elektronske pošte pogosto velja ravno nasprotno. E-poštno sporočilo si boste ogledali na njihovi platformi, nato pa bo prejemnik e-pošte videl vse vrste težav pri oblikovanju. Podjetja se pogosto nevede odločijo za urejevalnik z bogatimi funkcijami namesto za zaprtega urejevalnika, ki misli, da ima eno več funkcij kot drugo. Res je ravno nasprotno ... če želite e-pošto, ki se dosledno prikazuje v vseh e-poštnih odjemalcih, čim bolj preprosta, tem bolje, ker lahko gre manj narobe.
- Upodabljanje e-poštnega odjemalca – Obstaja na stotine e-poštnih odjemalcev, od katerih vsak različno upodablja HTML v namiznih, aplikacijah, mobilnih in spletnih poštnih odjemalcih. Medtem ko ima vaš izvrsten urejevalnik besedil pri vašem ponudniku e-poštnih storitev morda nastavitev za vstavljanje naslova v vašo e-pošto ... oblazinjenje, robovi, višina vrstice in velikost pisave se lahko razlikujejo pri vsakem posameznem e-poštnem odjemalcu. Posledično morate zapisati HTML in kodirati vsak posamezen element drugače (glejte spodnji primer) – in pogosto pisati izjeme, ki so specifične za e-poštni odjemalec –, da zagotovite dosledno upodabljanje e-pošte. Ni preprostih tipov blokov, morate narediti postavitve, ki jih vodijo tabele, ki so enakovredne gradnji za splet pred tridesetimi leti. Zato vsaka nova postavitev zahteva razvoj in preizkušanje navzkrižnega e-poštnega odjemalca in naprav. To, kar vidite v mapi »Prejeto«, je lahko popolnoma drugačno od tistega, kar vidim v svoji mapi »Prejeto«. Zato orodja za upodabljanje, kot so E-pošta o kislini or Lakmus so nujni, da zagotovite, da vaši novi modeli delujejo v vseh e-poštnih odjemalcih. Tukaj je kratek seznam priljubljenih e-poštnih odjemalcev in njihovih strojev za upodabljanje:
- Uporaba Apple Mail, Outlook za Mac, Android Mail in iOS Mail WebKit.
- Uporabite Outlook 2000, 2002 in 2003 Internet Explorer.
- Uporabite Outlook 2007, 2010 in 2013 Microsoft Word (da, Word!).
- Odjemalci spletne pošte uporabljajo ustrezni motor svojega brskalnika (Safari na primer uporablja WebKit, Chrome pa Blink).
Primer HTML za spletno vs. E-naslov
Če želite primer, ki ponazarja zapletenost oblikovanja v e-pošti v primerjavi s spletom, je tukaj popoln primer iz članka Mailbakery 19 velikih razlik med e-pošto in spletnim HTML-jem:
E-pošta
Zgraditi moramo serijo tabel, ki vključujejo vse vgrajene sloge, potrebne za pravilno namestitev gumba in zagotovitev, da je videti dobro v e-poštnih odjemalcih. Na vrhu tega e-poštnega sporočila bo tudi spremljevalna oznaka za slog, ki bo vključevala razrede.
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left">
<table border="0" cellspacing="0" cellpadding="0" bgcolor="#43756e">
<tr>
<td class="text-button" style="padding: 5px 20px; color:#ffffff; font-family: 'Oswald', Arial, sans-serif; font-size:14px; line-height:20px; text-align:center; text-transform:uppercase;">
<a href="#" target="_blank" class="link-white" style="color:#ffffff; text-decoration:none"><span class="link-white" style="color:#ffffff; text-decoration:none">Find Out More</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
Web
Uporabimo lahko zunanjo tabelo slogov z razredi, da določimo velikost črk, poravnavo, barvo in velikost sidrne oznake, ki je prikazana kot gumb.
<div class="center">
<a href="#" class="button">Find Out More</a>
</div>
Kako se izogniti težavam pri oblikovanju e-pošte
Težavam z oblikovanjem e-pošte se je mogoče izogniti z upoštevanjem dostojnega postopka:
- Oblikovanje predloge – Sestavite predlogo z različnimi postavitvami in vsebinskimi bloki, ki zajemajo vsak slog, ki bi ga kdaj želeli ustvariti v svojih e-poštnih zasnovah. Ko izvajamo stranko, jo vedno potisnemo k njej oblikovati e-pošto za prihodnost – ne le naslednja poslana e-poštna kampanja. Tako lahko v celoti načrtujemo, razvijamo, testiramo in izvajamo potrebne rešitve pred pošljejo to prvo e-pošto.
- Testiranje predloge – Razumevanje e-poštnih odjemalcev, ki jih uporabljajo vaši naročniki, in zagotovitev, da je vaša e-pošta HTML v celoti preizkušena v mobilnih in namiznih napravah, je ključnega pomena, preden uvedete katero koli predlogo. E-poštno sporočilo lahko oblikujemo dobesedno iz postavitve v Photoshopu ... vendar je razrez in razrez v odjemalca za navzkrižno e-pošto, ki ga poganja tabela, bistvenega pomena za uvajanje optimalnih in doslednih e-poštnih zasnov.
- Interno testiranje – Ko je vaša predloga zasnovana in preizkušena, jo je treba poslati na interni semenski seznam v organizaciji, da ga pregleda in odobri. Morda boste celo želeli začeti z zelo omejeno podskupino posameznikov, da najprej zagotovite, da ni požarnega zidu ali varnostnih težav, povezanih z internim upodabljanjem e-pošte. Če to gradi primer na novem ponudniku e-poštnih storitev, boste morda celo našli nekaj težav s filtriranjem ali blokiranjem, ki so povezane celo s pošiljanjem vaše e-pošte v mapo »Prejeto«.
- Različice predloge – Ne spreminjajte svojih postavitev ali načrtov, ne da bi delali na novi različici svoje predloge, ki jo je mogoče oblikovati, pravilno preizkusiti in uvesti. Mnoga podjetja imajo radi enkratne zasnove za vsako kampanjo ... vendar je za to potrebno vsako e-pošto oblikovati, razviti in uvesti za vsako kampanjo. To doda veliko časa notranjemu procesu e-poštnega trženja. In tvegate, da ne boste razumeli, kateri elementi v vaši e-pošti delujejo dobro v primerjavi s tistimi elementi, ki niso. Doslednost ni le način za lažji postopek, pomembna je tudi za vedenje vaših naročnikov.
- Izjeme ponudnika e-poštnih storitev – Skoraj vsak ponudnik e-poštnih storitev ima sredstva za reševanje težav, ki jih uvede njihov ustvarjalec e-pošte. Pogosto lahko v račun dodamo neobdelani CSS – ali celo imamo blok vsebine, ki mora biti vključen v vsako e-pošto –, da podjetje uporabi vgrajen urejevalnik e-pošte in ne dovoli, da bi pokvaril zasnovo vaše e-pošte. Seveda bo to morda zahtevalo nekaj usposabljanja in nadzora nad procesom za uvedbo teh korakov, da se zagotovi, da so upoštevani. Ali pa – morda boste dobesedno želeli samo razviti svojo zasnovo e-pošte v rešitvi, ki dokazano deluje v odjemalcih in napravah, nato pa jo prilepite nazaj v svojega ponudnika e-poštnih storitev.
Platforme za oblikovanje e-pošte
Ker so platforme za e-poštne storitve slabo opravile gradnjo in vzdrževanje dosledno upodobljenih graditeljev med odjemalci in napravami, so na trg prišle številne odlične platforme. Ena, ki smo jo veliko uporabljali, je Stripo.
Stripo ni samo ustvarjalec e-pošte, ima tudi knjižnico z več kot 900 predlogami, ki jih je mogoče enostavno uvoziti. Ko oblikujete e-pošto, lahko pošljete e-pošto več kot 60 ESP-jem in e-poštnim odjemalcem, vključno z MailChimp, HubSpot, Campaign Monitor, AWeber, eSputnik, Outlook in Gmail. Najboljše od vseh predlog Stripo imajo vključene teste upodabljanja e-pošte, tako da lahko zagotovite, da so bile preizkušene in delujejo dosledno v več kot 40 e-poštnih odjemalcih.
Prijavite se v demonstracijo urejevalnika Stripo
Razkritje: Povezujem se z mojim tržno svetovalno podjetje ki oblikuje in uvaja e-poštna sporočila med odjemalci za vodilne blagovne znamke v tako rekoč vseh ponudnikih e-poštnih storitev. Sem tudi podružnica Stripo in uporabljam svojo povezavo v tem članku.