Verstaan ​​​​die uitdagings (en frustrasies) van HTML-e-posontwerp | Martech Zone
Verstaan ​​​​die uitdagings (en frustrasies) van HTML-e-posontwerp
Woensdag, Maart 23, 2022 Monday, May 16, 2022 Douglas Karr
Maar e-posredakteurs is jammerlik agter. Hier is hoekom …
Die ontwerp van HTML-e-posse is baie meer kompleks as vir 'n webwerf
As u onderneming 'n pragtige HTML-e-pos wil hê, is die proses om 'n aantal redes eksponensieel meer kompleks as om 'n webblad uit te bou:
Geen standaarde nie – Daar is GEEN streng nakoming van enige web nie standaarde deur e-poskliënte wat HTML-e-pos vertoon. Trouens, feitlik elke e-poskliënt en elke weergawe van elke e-poskliënt anders optree. Sommige sal CSS, eksterne lettertipes en moderne HTML eer. Ander eer sommige inlyn-stilering, sal slegs 'n versameling lettertipes vertoon, en ignoreer alles behalwe tabelgedrewe strukture. Dit is eintlik nogal belaglik op hierdie stadium dat niemand aan hierdie kwessie werk nie. As gevolg hiervan, het die ontwerp van sjablone wat konsekwent oor kliënte en toestelle vertoon word, groot besigheid geword en kan dit redelik duur wees.
E-pos kliënt sekuriteit – Net hierdie week het Apple Mail opgedateer om by verstek alle beelde in HTML-e-posse te blokkeer wat nie in die e-pos ingebed is nie. Jy gee óf toestemming om vir hulle 'n e-pos op 'n slag te laai, óf jy moet die instellings aktiveer om hierdie instelling te deaktiveer. Saam met sekuriteitsinstellings vir e-poskliënt, is daar ook korporatiewe instellings.
IT-sekuriteit – Jou IT-span kan streng reëls gebruik oor watter voorwerpe werklik in 'n e-pos gelewer kan word. As jou prente byvoorbeeld van 'n spesifieke domein kom wat nie in 'n korporatiewe firewall gewitlys is nie, sal prente eenvoudig nie in jou e-pos verskyn nie. Soms moes ons e-posse ontwikkel en al die beelde op die korporasie se bediener huisves sodat hul eie werknemers die beelde kon sien.
E-pos diensverskaffers – Om sake te vererger, die e-posbouers wat diensverskaffers e-pos (ESPs) eintlik probleme bekendstel eerder as om dit te beperk. Terwyl hulle bevorder hul redakteur is Wat jy sien is wat jy kry (WYSIWYG), is die teenoorgestelde dikwels waar met e-posontwerp. Jy sal die e-pos op hul platform voorbeskou, dan sien die e-posontvanger allerhande ontwerpprobleme. Maatskappye kies dikwels onbekend vir 'n kenmerkryke redakteur in plaas van 'n geslote redakteur wat dink dat die een meer kenmerke as die ander het. Die teenoorgestelde is waar ... as jy e-posse wil hê wat konsekwent oor alle e-poskliënte vertoon word, hoe eenvoudiger hoe beter, want minder kan verkeerd gaan.
E-pos kliënt lewering – Daar is honderde e-poskliënte, wat elkeen HTML verskillend weergee op rekenaar-, toepassings-, selfoon- en webposkliënte. Terwyl jou handige teksredigeerder op jou e-posdiensverskaffer dalk 'n instelling het om 'n opskrif in jou e-pos te plaas... kan die opvulling, kantlyne, lynhoogte en lettergrootte verskil op elke enkele e-poskliënt. As gevolg hiervan, moet jy die HTML dompel en elke element anders kodeer (sien die voorbeeld hieronder) - en skryf dikwels uitsonderings in wat e-poskliëntspesifiek is - om 'n e-pos te kry om konsekwent weer te gee. Daar is geen eenvoudige bloktipes nie, jy moet tabelgedrewe uitlegte doen wat dertig jaar gelede gelykstaande is aan die bou vir die web. Dit is hoekom enige nuwe uitleg beide ontwikkeling en kruis-e-pos kliënt- en toesteltoetsing vereis. Wat jy in jou inkassie sien, kan heeltemal anders wees as wat ek in my inkassie sien. Dit is hoekom die lewering van gereedskap soos E-pos op Acid or lakmoes is 'n moet om te verseker dat jou nuwe ontwerpe oor alle e-poskliënte werk. Hier is 'n kort lys van gewilde e-poskliënte en hul weergawe-enjins:
Apple Mail, Outlook vir Mac, Android Mail en iOS Mail gebruik WebKit.
Outlook 2000, 2002 en 2003 gebruik internet Explorer.
Outlook 2007, 2010 en 2013 gebruik Microsoft Word (Ja, Woord!).
Webpos-kliënte gebruik hul blaaier se onderskeie enjin (byvoorbeeld, Safari gebruik WebKit en Chrome gebruik Blink).
'n Voorbeeld van HTML vir Web vs. E-pos
As jy 'n voorbeeld wil hê wat die kompleksiteit van ontwerp in e-pos versus die web illustreer, hier is 'n perfekte voorbeeld uit Mailbakery se artikel 19 groot verskille tussen e-pos en web-HTML:
Ons moet 'n reeks tabelle bou wat al die inlynstilering bevat wat nodig is om die knoppie behoorlik te plaas en te verseker dat dit goed lyk oor e-poskliënte. Daar gaan ook 'n meegaande stylmerker bo-aan hierdie e-pos wees om die klasse in te sluit.
Ons kan 'n eksterne stylblad met klasse gebruik om die omhulsel, belyning, kleur en grootte van 'n ankermerker wat as 'n knoppie verskyn, te definieer.
Hoe om e-posontwerpprobleme te vermy
E-posontwerpkwessies kan vermy word deur 'n ordentlike proses te volg:
Sjabloonontwerp – Bou 'n sjabloon uit met verskillende uitlegte en inhoudblokke wat elke styl insluit wat jy ooit in jou e-posontwerpe sou wou produseer. Wanneer ons 'n kliënt implementeer, druk ons ​​hulle altyd na ontwerp 'n e-pos vir die toekoms – nie net die volgende e-posveldtog wat uitgestuur word nie. Op hierdie manier kan ons die nodige oplossings volledig ontwerp, ontwikkel, toets en implementeer voor hulle stuur ooit daardie eerste e-pos uit.
Sjabloontoetsing – Om die e-poskliënte te verstaan ​​wat u intekenare gebruik en om te verseker dat u HTML-e-pos volledig op mobiele en rekenaars getoets word, is van kritieke belang voordat enige sjabloon ontplooi word. Ons kan 'n e-pos letterlik uit 'n Photoshop-uitleg ontwerp ... maar om dit in tabelgedrewe, kruis-e-poskliënt te sny en in skywe te sny, is noodsaaklik om e-posontwerpe te ontplooi wat optimaal en konsekwent is.
Interne toetsing – Sodra jou sjabloon ontwerp en getoets is, moet dit na 'n interne saadlys binne die organisasie gestuur word om te hersien en goed te keur. Miskien wil jy selfs met 'n baie beperkte subset van individue begin om eers te verseker dat daar nie firewall- of sekuriteitskwessies is wat verband hou met die intern lewering van die e-pos nie. As dit besig is om 'n instansie op 'n nuwe e-posdiensverskaffer uit te bou, kan jy selfs 'n paar filter- of blokkeringskwessies vind wat verband hou met selfs om jou e-pos in die inkassie te kry.
Sjabloon weergawe – Moenie jou uitlegte of ontwerpe verander sonder om aan 'n nuwe weergawe van jou sjabloon te werk wat ontwerp, behoorlik getoets en ontplooi kan word nie. Baie besighede hou van eenmalige ontwerpe vir elke veldtog ... maar dit vereis dat elke e-pos vir elke veldtog ontwerp, ontwikkel en ontplooi word. Dit voeg baie tyd by tot die interne e-posbemarkingsproses. En jy loop die risiko om nie te verstaan ​​watter elemente in jou e-pos goed presteer bo watter elemente nie. Konsekwentheid is nie net 'n manier om die proses makliker te maak nie, dit is ook belangrik vir die gedrag van jou intekenare.
E-posdiensverskaffer-uitsonderings – Feitlik elke e-posdiensverskaffer het 'n manier om die kwessies wat hul e-posbouer bekendstel, om te werk. Ons kan dikwels rou CSS by 'n rekening voeg - of selfs 'n inhoudblok hê wat in elke e-pos ingesluit moet word - sodat die maatskappy die ingeboude e-posredigeerder kan gebruik en nie die ontwerp van jou e-pos laat breek nie. Natuurlik kan dit 'n mate van opleiding en prosesbeheer verg om daardie stappe te implementeer om te verseker dat daaraan voldoen word. Of – jy wil dalk letterlik net jou e-posontwerp ontwikkel in 'n oplossing wat bewys is om oor kliënte en toestelle te werk, en plak dit dan terug in jou e-posdiensverskaffer.
Omdat e-posdiensplatforms swak werk gedoen het met die uitbou en instandhouding van kruiskliënt- en kruistoestelbouers wat konsekwent gelewer is, het 'n aantal wonderlike platforms op die mark gekom. Een wat ons baie gebruik het, is Streep.
Stripo is nie net 'n e-posbouer nie, hulle het ook 'n biblioteek met meer as 900 sjablone wat maklik ingevoer kan word. Sodra jy die e-pos ontwerp het, kan jy die e-pos stuur na 60+ ESP's, en e-pos kliënte, insluitend MailChimp, HubSpot, Campaign Monitor, AWeber, eSputnik, Outlook en Gmail. Die beste van alles Strippo-sjablone kom met die e-posweergawe-toetse ingesluit sodat jy kan verseker dat hulle getoets is en konsekwent oor meer as 40 e-poskliënte werk.
Teken in op die Strepo-redakteur-demo
Openbaarmaking: Ek skakel na my bemarkingsadviesfirma wat kruiskliënt-e-posse ontwerp en ontplooi vir toonaangewende handelsmerke in feitlik enige e-posdiensverskaffer. Ek is ook 'n geaffilieerde van Streep en ek gebruik my skakel in hierdie artikel.
Tags: knipe-pos bouere-pos kliëntee-pos ontwerpE-pos Marketinglewering van e-pose-pos diensverskaffer redakteure-pos diensverskafferse-pos sjabloon ontwerpe-pos sjabloon toetse-pos sjabloon weergawee-pos templatese-pos toetse-pos teksredigeerderhtml e-posInternet ExplorerposbakkerybemarkingswolkMicrosoft Wordstripowebkissiewebmailwysiwyg