Kui avate veebilehtede loomiseks sisuhaldussüsteemi, on see üsna lihtne protsess. Kaasaegsed veebibrauserid toetavad HTML-i, CSS-i ja JavaScripti range veebistandardite komplekt. Ja need on tegelikult vaid käputäis brausereid, mille pärast disainerid peavad muretsema. Muidugi on erandeid… ja mõned lihtsad lahendused või nendele brauseritele omased funktsioonid.
Üldiste standardite tõttu on sisuhaldussüsteemides lehtede koostajaid väga lihtne välja töötada. Brauserid vastavad HTML5-le, CSS-ile ja JavaScriptile… ning arendajad saavad luua uskumatult jõulisi lahendusi, et luua veebilehti, mis reageerivad seadmetele ja on kõikides brauserites järjepidevad. Kaks aastakümmet tagasi kasutasid peaaegu kõik veebidisainerid veebilehtede arendamiseks töölauatarkvara. Nüüd on üsna haruldane, et veebidisainer arendab veebilehte – enamasti töötavad nad välja malle ja kasutavad sisu täitmiseks sisusüsteemides toimetajaid. Veebisaidi toimetajad on fantastilised.
Kuid meilitoimetajad on hädasti maha jäänud. Siin on põhjus, miks…
HTML-meilide kujundamine on palju keerulisem kui veebisaidi jaoks
Kui teie ettevõte soovib ilusat HTML-meili, on protsess mitmel põhjusel eksponentsiaalselt keerulisem kui veebilehe loomine.
- Standardeid pole – Üheski veebis EI järgita ranget järgimist standardite HTML-meili kuvavate meiliklientide poolt. Tegelikult virtuaalselt iga meiliklient ja iga meiliklienti iga versioon toimib erinevalt. Mõned austavad CSS-i, väliseid fonte ja kaasaegset HTML-i. Teised austavad mõnda tekstisisest stiili, kuvavad ainult fondide kogu ja ignoreerivad kõike peale tabelipõhiste struktuuride. Praegu on tegelikult üsna naeruväärne, et keegi selle teemaga ei tegele. Seetõttu on klientides ja seadmetes järjepidevalt renderdatavate mallide kujundamine muutunud suureks äriks ja võib olla üsna kulukas.
- Meilikliendi turvalisus – Just sel nädalal värskendati Apple Maili, et blokeerida vaikimisi kõik pildid HTML-meilides, mis pole meilidesse manustatud. Annate neile loa korraga e-kirjade laadimiseks või peate selle seade keelamiseks seaded lubama. Lisaks meilikliendi turvaseadetele on olemas ka ettevõtte seaded.
- IT turvalisus – Teie IT-meeskond võib kasutusele võtta ranged reeglid selle kohta, milliseid objekte saab meilis tegelikult renderdada. Kui teie pildid pärinevad näiteks kindlast domeenist, mis ei ole ettevõtte tulemüüris lubatud loendis, siis pilte lihtsalt ei kuvata teie meilis. Mõnikord oleme pidanud arendama e-kirju ja majutama kõiki pilte ettevõtte serveris, et nende enda töötajad saaksid pilte näha.
- E-posti teenuse pakkujad – Asja teeb hullemaks see, et e-posti koostajad, kes meiliteenuse pakkujad (ESPs) pigem tekitada probleeme kui neid piirata. Kuigi nad reklaamivad oma toimetajat See, mida näete, on see, mida saate (WYSIWYG), on meilikujundusega sageli vastupidine. Näete meili eelvaadet nende platvormil ja siis näeb meili saaja igasuguseid kujundusprobleeme. Ettevõtted valivad sageli teadmata funktsioonirikka redaktori lukustatud redaktori asemel, arvates, et ühel on rohkem funktsioone kui teisel. Tõsi on vastupidi… kui soovite, et meilid renderdaksid järjepidevalt kõigis meiliklientides, siis mida lihtsam, seda parem, sest vähem võib valesti minna.
- E-posti kliendi renderdamine – Meil on sadu e-posti kliente, millest igaüks renderdab HTML-i töölaua-, rakendus-, mobiili- ja veebimeili klientides erinevalt. Kuigi teie e-posti teenusepakkuja nutikas tekstiredaktoris võib olla säte lisada teie meilile päis, võivad täidised, veerised, rea kõrgus ja fondi suurus iga e-posti kliendi puhul erineda. Selle tulemusena peate HTML-i tummaks muutma ja iga üksiku elemendi erinevalt kodeerima (vt allpool olevat näidet) – ja sageli kirjutama sisse erandid, mis on meilikliendipõhised –, et meili järjepidevalt renderdataks. Pole olemas lihtsaid plokitüüpe, peate tegema tabelipõhiseid paigutusi, mis on samaväärsed kolmkümmend aastat tagasi veebi ehitamisega. Seetõttu nõuab iga uus paigutus nii arendust kui ka e-posti kliendi ja seadme testimist. See, mida näete oma postkastis, võib olla täiesti erinev sellest, mida ma oma postkastis näen. Seetõttu meeldivad renderdamistööriistad Meil happe kohta or Lakmus on kohustuslikud, et teie uued kujundused töötaksid kõigis meiliklientides. Siin on lühike loend populaarsetest meiliklientidest ja nende renderdusmootoritest:
- Apple Maili, Outlook for Maci, Android Maili ja iOS Maili kasutamine WebKit.
- Outlook 2000, 2002 ja 2003 kasutamine Internet Explorer.
- Outlook 2007, 2010 ja 2013 kasutamine Microsoft Word (jah, Word!).
- Veebimeili kliendid kasutavad oma brauseri vastavat mootorit (näiteks Safari kasutab WebKiti ja Chrome kasutab Blinki).
HTML-i näide veebi vs. Meil
Kui soovite näidet, mis illustreerib meilis ja veebis kujundamise keerukust, on siin suurepärane näide Mailbakery artiklist 19 suurt erinevust meili ja veebi HTML-i vahel:
E-posti aadress
Peame looma rea tabeleid, mis sisaldavad kõiki nupu õigeks paigutamiseks vajalikke sisemisi stiile ja tagavad selle hea väljanägemise e-posti klientides. Selle e-kirja ülaosas on ka klasside lisamiseks lisatud stiilisilt.
<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>
võrk
Saame kasutada klassidega välist laaditabelit, et määrata nupuna kuvatava ankrusildi tähtkuju, joondus, värv ja suurus.
<div class="center">
<a href="#" class="button">Find Out More</a>
</div>
Kuidas vältida meilikujunduse probleeme
Meilikujunduse probleeme saab vältida, järgides korralikku protsessi:
- Malli kujundus – Looge erinevate paigutuste ja sisuplokkidega mall, mis hõlmab kõiki stiile, mida soovite oma meilikujunduses kunagi luua. Kui me klienti juurutame, surume talle alati peale kujundage tuleviku jaoks e-kiri – mitte ainult järgmine meilikampaania, mis välja saadetakse. Nii saame täielikult kavandada, arendada, testida ja rakendada vajalikke lahendusi enne nad saadavad kunagi selle esimese meili.
- Malli testimine – Enne mis tahes malli juurutamist on oluline mõista, milliseid meilikliente teie tellijad kasutavad, ja tagada, et teie HTML-meili testitakse täielikult nii mobiiltelefonis kui ka lauaarvutis. Me saame kujundada e-kirja sõna otseses mõttes Photoshopi paigutuse järgi, kuid optimaalsete ja järjepidevate meilikujunduste juurutamiseks on oluline selle tükeldamine tabelipõhiseks e-posti kliendiks.
- Sisetestimine – Kui teie mall on kujundatud ja testitud, tuleks see ülevaatamiseks ja kinnitamiseks saata organisatsioonisisesesse algloendisse. Võite isegi alustada väga piiratud alamhulgaga isikutest, et esmalt veenduda, et meilisisese renderdamisega ei kaasne tulemüüri või turvaprobleeme. Kui see loob uue meiliteenuse pakkuja eksemplari, võite isegi leida mõningaid filtreerimis- või blokeerimisprobleeme, mis on seotud isegi teie meili postkasti jõudmisega.
- Malli versioonide määramine – Ärge muutke oma paigutusi ega kujundusi ilma malli uue versiooni kallal, mida saab kujundada, korralikult testida ja juurutada. Paljud ettevõtted armastavad iga kampaania jaoks ühekordseid kujundusi, kuid see nõuab, et iga e-kiri oleks iga kampaania jaoks kavandatud, arendatud ja kasutusele võetud. See lisab sisemisele e-turunduse protsessile palju aega. Ja teil on oht, et te ei mõista, millised elemendid teie meilis toimivad paremini, kui millised mitte. Järjepidevus ei ole ainult viis protsessi lihtsamaks muutmiseks, vaid see on oluline ka teie tellijate käitumise jaoks.
- Meiliteenuse pakkuja erandid – Peaaegu igal e-posti teenusepakkujal on vahendid nende meili koostaja esitatud probleemide lahendamiseks. Saame sageli lisada kontole töötlemata CSS-i – või isegi omada sisuploki, mis peab olema igas meilis – selleks, et ettevõte saaks kasutada sisseehitatud meiliredaktorit ja mitte lasta sellel teie meili kujundust rikkuda. Muidugi võib see vajada koolitust ja protsesside juhtimist, et neid toiminguid rakendada, et tagada nende järgimine. Või – võite sõna otseses mõttes lihtsalt välja töötada oma e-posti kujunduse lahendusena, mis on tõestanud, et see töötab kõigis klientides ja seadmetes, ning seejärel kleepige see tagasi oma meiliteenuse pakkujasse.
Meilikujundusplatvormid
Kuna meiliteenuste platvormid on klientide- ja seadmeteüleselt järjepidevalt renderdatud ehitajate väljatöötamisel ja hooldamisel halvasti teinud, on turule tulnud mitmeid suurepäraseid platvorme. Üks, mida oleme laialdaselt kasutanud, on Stripo.
Stripo ei ole ainult meili koostaja, vaid neil on ka enam kui 900 malliga teek, mida saab hõlpsasti importida. Kui olete meili kujundanud, saate meili saata rohkem kui 60 ESP-le ja meiliklientidele, sealhulgas MailChimp, HubSpot, Campaign Monitor, AWeber, eSputnik, Outlook ja Gmail. Mis kõige parem, Stripo mallidega on kaasas e-kirjade renderdustestid, et saaksite veenduda, et neid on testitud ja need töötavad järjepidevalt enam kui 40 meilikliendis.
Logige sisse Stripo toimetaja demosse
Avalikustamine: lingin oma turunduskonsultatsioonifirma kes kujundab ja juurutab klientidevahelisi e-kirju juhtivatele kaubamärkidele praktiliselt igas meiliteenuse pakkujas. Olen ka sidusettevõte Stripo ja ma kasutan oma linki selles artiklis.