Wann Dir en Inhaltsmanagementsystem opmaacht fir Websäiten ze bauen, ass et e relativ einfache Prozess. Modern Webbrowser ënnerstëtzen HTML, CSS, a JavaScript fir eng strikt Set vu Webnormen. An, si si wierklech nëmmen eng Handvoll Browser, iwwer déi Designer sech Suerge maache mussen. Et ginn Ausnahmen, natierlech ... an e puer einfach Léisungen oder Funktiounen spezifesch fir dës Browser.
Wéinst den allgemenge Standarden ass et wierklech einfach Säit Builder an Inhaltsmanagementsystemer z'entwéckelen. Browser entspriechen HTML5, CSS, a JavaScript ... an Entwéckler kënnen onheemlech robust Léisunge bauen fir Websäiten ze bauen déi reaktiounsfäeger op Apparater a konsequent iwwer Browser sinn. Virun zwee Joerzéngte benotzt quasi all Webdesigner Desktop Software fir Websäiten z'entwéckelen. Elo ass et zimmlech ongewéinlech fir e Webdesigner eng Websäit z'entwéckelen - méi dacks wéi net, si entwéckelen Templates a benotzen Redaktoren an Inhaltssystemer fir den Inhalt auszefëllen. Websäit Redaktoren sinn fantastesch.
Awer E-Mail Redaktoren sinn wuel hannendrun. Hei ass firwat ...
HTML E-Mailen designen ass vill méi komplex wéi fir eng Websäit
Wann Är Firma e schéinen HTML E-Mail entworf wëllt, ass de Prozess exponentiell méi komplex wéi eng Websäit aus enger Rei vu Grënn auszebauen:
- Keng Normen - Et gëtt KENG strikt Anhale fir all Web Standarden vun E-Mail Clienten déi HTML E-Mail weisen. Tatsächlech, quasi all E-Mail Client an all Versioun vun all E-Mail Client handelt anescht. E puer wäerten CSS, extern Schrëften a modernen HTML respektéieren. Anerer Éieren e puer Inline Styling, wäert nëmmen eng Sammlung vu Schrëften weisen, an ignoréieren alles ausser Dësch-Undriff Strukturen. Et ass eigentlech zimlech lächerlech op dësem Punkt datt keen un dësem Thema schafft. Als Resultat ass Templates designen déi iwwer Clienten an Apparater konsequent renderen ass grouss Geschäft ginn a kënnen zimlech deier sinn.
- Email Client Sécherheet - Just dës Woch huet Apple Mail aktualiséiert fir all Biller an HTML E-Mailen als Standard ze blockéieren déi net an der E-Mail agebonne sinn. Dir gitt entweder d'Erlaabnis fir hinnen eng E-Mail gläichzäiteg ze lueden, oder Dir musst d'Astellunge aktivéieren fir dës Astellung auszeschalten. Zesumme mat E-Mail Client Sécherheetsastellungen ginn et och Firmenastellungen.
- IT Sécherheet - Är IT-Team kann strikt Reegelen ofsetzen iwwer wéi eng Objekter tatsächlech an enger E-Mail geliwwert kënne ginn. Wann Är Biller, zum Beispill, aus engem spezifesche Domain kommen, deen net an enger Firmen-Firewall op Whitelist ass, ginn d'Biller einfach net an Ärer E-Mail op. Heiansdo hu mir E-Maile missen entwéckelen an all d'Biller um Server vun der Corporation hosten, sou datt hir eege Mataarbechter d'Biller konnten gesinn.
- Email Service Ubidder - Fir d'Saache méi schlëmm ze maachen, d'E-Mail Builder déi E-Mail Service Ubidder (wiers) tatsächlech Problemer aféieren anstatt se ze limitéieren. Iwwerdeems si förderen hir Redakter ass Wat Dir gesitt ass wat Dir kritt (WYSIWYG), de Géigendeel ass dacks wouer mat E-Mail Design. Dir wäert d'E-Mail op hirer Plattform virschau, da gesäit den E-Mail Empfänger all Zort vun Designprobleemer. Firmen entscheeden dacks onbekannt fir e Feature-räiche Editor anstatt e gespaarten Editor ze denken datt deen een méi Feature huet wéi deen aneren. De Géigendeel ass wouer ... wann Dir E-Maile wëllt, déi konsequent iwwer all E-Mail Clienten ubidden, wat méi einfach, wat besser, well manner ka falsch goen.
- E-Mail Client Rendering - Et ginn Honnerte vun E-Mail Clienten, jidderee liwwert HTML anescht iwwer Desktop, Apps, Handy a Webmail Clienten. Wärend Ären zécken Texteditor op Ärem E-Mail Service Provider e Kader huet fir eng Rubrik an Ärer E-Mail ze setzen ... Als Resultat musst Dir den HTML erofsetzen an all eenzel Element anescht codéieren (kuckt d'Beispill hei ënnen) - an dacks an Ausnahmen schreiwen déi E-Mail Client spezifesch sinn - fir eng E-Mail konsequent ze maachen. Et gi keng einfach Blocktypen, Dir musst Dësch-Undriff Layouten maachen, déi d'Äquivalent vum Bau fir de Web virun drësseg Joer sinn. Dofir erfuerdert all neie Layout souwuel Entwécklung wéi Cross-E-Mail Client an Apparat Testen. Wat Dir an Ärer Inbox gesitt kann ganz anescht sinn wat ech a menger Inbox gesinn. Dofir Rendering Tools wéi Email Op Acid or Litmus sinn e Must fir sécherzestellen datt Är nei Designs iwwer all E-Mail Clienten funktionnéieren. Hei ass eng kuerz Lëscht vu populäre E-Mail Clienten an hir Renderingmotoren:
- Apple Mail, Outlook fir Mac, Android Mail an iOS Mail benotzen WebKit.
- Outlook 2000, 2002 an 2003 benotzen Internet Explorer.
- Outlook 2007, 2010 an 2013 benotzen Microsoft Word (jo, Wuert!).
- Webmail Clienten benotzen de jeweilege Motor vum Browser (zum Beispill Safari benotzt WebKit a Chrome benotzt Blink).
E Beispill vun HTML fir Web vs. E-Mail
Wann Dir e Beispill wëllt dat d'Komplexitéit vum Design an E-Mail versus de Web illustréiert, hei ass e perfekt Beispill aus dem Mailbakery Artikel 19 Grouss Differenzen tëscht E-Mail a Web HTML:
Mir mussen eng Serie vun Dëscher bauen déi all Inline Styling integréieren déi néideg ass fir de Knäppchen richteg ze placéieren an ze garantéieren datt et gutt iwwer E-Mail Clienten ausgesäit. Et gëtt och e begleetend Stil Tag uewen op dëser E-Mail fir d'Klassen ze integréieren.
<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
Mir kënnen en externen Stylesheet mat Klassen benotzen fir de Fall, d'Ausrichtung, d'Faarf an d'Gréisst vun engem Ankertag ze definéieren deen als Knäppchen erschéngt.
<div class="center">
<a href="#" class="button">Find Out More</a>
</div>
Wéi E-Mail Design Themen ze vermeiden
E-Mail Designprobleemer kënne vermeit ginn andeems Dir en anstännege Prozess verfollegt:
- Schabloun Design - Baut eng Schabloun mat verschiddene Layouten an Inhaltsblocken aus, déi all Stil ëmfaassen, deen Dir jeemools an Ären E-Mail-Designer wëllt produzéieren. Wa mir e Client implementéieren, drécke mir se ëmmer op Design eng E-Mail fir d'Zukunft - net nëmmen déi nächst E-Mail Kampagne déi verschéckt gëtt. Op dës Manéier kënne mir déi néideg Léisungen komplett designen, entwéckelen, testen an ëmsetzen virum si schécken jeemools déi éischt E-Mail.
- Schabloun Testen - D'E-Mail Clienten ze verstoen déi Är Abonnente benotzen an ze garantéieren datt Är HTML E-Mail komplett iwwer Handy an Desktop getest gëtt ass kritesch ier Dir eng Schabloun ofsetzt. Mir kënnen eng E-Mail wuertwiertlech aus engem Photoshop Layout designen ... awer et an en Dësch-gedriwwene Cross-E-Mail Client ze schneiden an ze schneiden ass essentiell fir E-Mail-Designen z'installéieren déi optimal a konsequent sinn.
- Intern Testen - Wann Är Schabloun entworf a getest ass, sollt et op eng intern Som Lëscht bannent der Organisatioun geschéckt ginn fir ze iwwerpréiwen an z'accordéieren. Dir wëllt vläicht souguer mat engem ganz limitéierten Ënnerdeel vun Individuen unzefänken fir als éischt sécherzestellen datt et keng Firewall- oder Sécherheetsprobleemer mat der interner E-Mail assoziéiert sinn. Wann dëst eng Instanz op engem neien E-Mail-Déngschtleeschter opbaut, kënnt Dir souguer e puer Filter- oder Blockéierungsprobleemer fannen, déi mat Ärem E-Mail an d'Inbox verbonne sinn.
- Schabloun Versioun - Verännert Är Layouten oder Designen net ouni un enger neier Versioun vun Ärer Schabloun ze schaffen, déi ka designt, richteg getest an ofgesat ginn. Vill Entreprisen hu gär eemolege Designe fir all Kampagne ... awer dat erfuerdert datt all E-Mail fir all Kampagne entworf, entwéckelt an ofgesat gëtt. Dëst füügt eng Tonn Zäit un den E-Mail Marketing Prozess intern. An Dir riskéiert net ze verstoen wat Elementer an Ärer E-Mail gutt performen iwwer wéi Elementer net sinn. Konsistenz ass net nëmmen e Wee fir de Prozess méi einfach ze maachen, et ass och wichteg fir d'Behuele vun Ären Abonnenten.
- E-Mail Service Provider Ausnahmen - Bal all E-Mail Service Provider huet e Mëttel fir d'Themen ëmzegoen déi hiren E-Mail Builder agefouert huet. Mir kënnen dacks rau CSS op e Kont addéieren - oder souguer en Inhaltsblock hunn, deen an all E-Mail abegraff muss sinn - fir datt d'Firma den agebaute E-Mail Editor benotzt an net den Design vun Ärer E-Mail briechen. Natierlech kann dat e puer Training a Prozesskontrolle erfuerderen fir dës Schrëtt z'installéieren fir sécherzestellen datt se agehale ginn. Oder - Dir wëllt wuertwiertlech just Ären E-Mail-Design entwéckelen an enger Léisung déi bewisen ass fir iwwer Clienten an Apparater ze schaffen, da paste se zréck an Ären E-Mail Service Provider.
E-Mail Design Plattformen
Well E-Mail-Serviceplattformen eng schlecht Aarbecht gemaach hunn beim Ausbau an Erhalen vu Cross-Client a Cross-Device konsequent rendered Builder, sinn eng Zuel vu super Plattformen op de Maart komm. Een dee mir extensiv benotzt hunn ass Sträif.
Stripo ass net nëmmen en E-Mail Builder, si hunn och eng Bibliothéik vun iwwer 900 Templates déi einfach importéiert kënne ginn. Wann Dir d'E-Mail designt, kënnt Dir d'E-Mail un 60+ ESPs, an E-Mail Clienten, inklusiv MailChimp, HubSpot, Campagne Monitor, AWeber, eSputnik, Outlook a Gmail. Bescht vun allen Stripo Templates kommen mat den E-Mail Rendering Tester abegraff sou datt Dir sécher kënnt datt se getest goufen a konsequent iwwer iwwer 40 E-Mail Clienten funktionnéieren.
Login op de Stripo Editor Demo
Offenbarung: Ech verlinke mat mengem Marketing Berodungsfirma deen Cross-Client E-Maile fir führend Marken an quasi all E-Mail Service Provider designt an ofsetzt. Ech sinn och e Partner vun Sträif an ech benotzen mäi Link an dësem Artikel.