Kuptimi i Sfidave (dhe Frustrimeve) të Dizajnit të Email-it HTML

Nëse hapni një sistem të menaxhimit të përmbajtjes për të ndërtuar faqe në internet, është një proces mjaft i thjeshtë. Shfletuesit modernë të internetit mbështesin HTML, CSS dhe JavaScript në a i rreptë grup standardesh web. Dhe, ata janë në të vërtetë vetëm një pjesë e vogël e shfletuesve për të cilët projektuesit duhet të shqetësohen. Ka përjashtime, sigurisht… dhe disa zgjidhje të thjeshta ose funksione specifike për ata shfletues.

Për shkak të standardeve të përgjithshme, është vërtet e lehtë të zhvillohen ndërtues faqesh në sistemet e menaxhimit të përmbajtjes. Shfletuesit përputhen me HTML5, CSS dhe JavaScript… dhe zhvilluesit mund të ndërtojnë zgjidhje tepër të fuqishme për të ndërtuar faqe ueb që janë të përgjegjshme ndaj pajisjeve dhe të qëndrueshme në të gjithë shfletuesit. Dy dekada më parë, pothuajse çdo projektues ueb-i përdorte softuer desktop për të zhvilluar faqet e internetit. Tani, është shumë e pazakontë që një projektues ueb-i të zhvillojë një faqe interneti – më shpesh sesa jo, ata po zhvillojnë shabllone dhe po përdorin redaktues në sistemet e përmbajtjes për të plotësuar përmbajtjen. Redaktorët e faqeve të internetit janë fantastikë.

Por redaktorët e postës elektronike janë mjerisht prapa. Ja pse…

Dizajnimi i emaileve HTML është shumë më kompleks sesa për një faqe interneti

Nëse kompania juaj dëshiron një email të bukur HTML të dizajnuar, procesi është në mënyrë eksponenciale më i ndërlikuar sesa ndërtimi i një faqe interneti për një sërë arsyesh:

• Nuk ka standarde – NUK ka respektim të rreptë ndaj asnjë rrjeti standardet nga klientët e-mail që shfaqin emailin HTML. Në fakt, virtualisht çdo klient email dhe çdo version të çdo klienti email vepron ndryshe. Disa do të nderojnë CSS, fontet e jashtme dhe HTML-në moderne. Të tjerët respektojnë disa stilime të brendshme, do të shfaqin vetëm një koleksion shkronjash dhe do të injorojnë gjithçka përveç strukturave të drejtuara nga tabela. Në të vërtetë është mjaft qesharake në këtë pikë që askush nuk po punon për këtë çështje. Si rezultat, dizajnimi i shablloneve që paraqiten në mënyrë të vazhdueshme në të gjithë klientët dhe pajisjet është bërë biznes i madh dhe mund të jetë mjaft i shtrenjtë.
• Siguria e klientit të postës elektronike – Vetëm këtë javë, Apple Mail u përditësua për të bllokuar si parazgjedhje të gjitha imazhet në emailet HTML që nuk janë të ngulitura në email. Ju ose u jepni leje t'i ngarkoni një email në të njëjtën kohë ose duhet të aktivizoni cilësimet për të çaktivizuar këtë cilësim. Së bashku me cilësimet e sigurisë së klientit të postës elektronike, ka edhe cilësime të korporatës.
• Siguria e IT – Ekipi juaj i IT-së mund të vendosë rregulla strikte se cilat objekte mund të jepen në të vërtetë në një email. Nëse imazhet tuaja, për shembull, vijnë nga një domen specifik që nuk është në listën e bardhë në një mur zjarri të korporatës, imazhet thjesht nuk do të shfaqen në emailin tuaj. Ndonjëherë, na është dashur të zhvillojmë email dhe të presim të gjitha imazhet në serverin e korporatës në mënyrë që punonjësit e tyre të mund t'i shohin imazhet.
• Ofruesit e Shërbimeve me Email – Për t'i bërë gjërat edhe më keq, ndërtuesit e postës elektronike që ofruesit e shërbimeve të postës elektronike (ESPs) në fakt prezanton probleme në vend që t'i kufizojë ato. Ndërsa ata promovojnë redaktori i tyre është Ajo që ju shikoni është ajo që ju merrni (WYSIWYG), e kundërta shpesh është e vërtetë me dizajnin e postës elektronike. Ju do të shikoni paraprakisht emailin në platformën e tyre, më pas marrësi i emailit sheh të gjitha llojet e problemeve të projektimit. Kompanitë shpesh zgjedhin në mënyrë të panjohur një redaktues të pasur me veçori në vend të një redaktuesi të mbyllur duke menduar se njëri ka më shumë veçori se tjetri. E kundërta është e vërtetë… nëse dëshironi që emailet të shfaqen vazhdimisht në të gjithë klientët e emailit, sa më e thjeshtë aq më mirë sepse më pak mund të shkojnë keq.
• Përkthimi i klientit me email – Ka qindra klientë të postës elektronike, secila prej të cilave e paraqet HTML ndryshe në klientët e desktopit, aplikacioneve, celularëve dhe postës së internetit. Ndërsa redaktori juaj i mrekullueshëm i tekstit në ofruesin tuaj të shërbimit të postës elektronike mund të ketë një cilësim për të vendosur një titull në emailin tuaj… mbushja, kufijtë, lartësia e rreshtit dhe madhësia e shkronjave mund të ndryshojnë në çdo klient të vetëm të postës elektronike. Si rezultat, ju duhet të nënvlerësoni HTML-në dhe të kodoni çdo element të veçantë (shih shembullin më poshtë) - dhe shpesh të shkruani në përjashtime që janë specifike për klientin e postës elektronike - për të marrë një email për t'u dhënë vazhdimisht. Nuk ka lloje të thjeshta blloqesh, ju duhet të bëni paraqitjet e drejtuara nga tabelat që janë ekuivalente me ndërtimin për ueb-in tridhjetë vjet më parë. Kjo është arsyeja pse çdo plan urbanistik i ri kërkon zhvillimin dhe testimin e klientit me email dhe pajisjes. Ajo që shihni në kutinë tuaj hyrëse mund të jetë krejtësisht e ndryshme nga ajo që shoh unë në kutinë time hyrëse. Kjo është arsyeja pse rendering mjetet si Email në Acid or Lakmus janë një domosdoshmëri për të siguruar që modelet tuaja të reja të funksionojnë në të gjithë klientët e postës elektronike. Këtu është një listë e shkurtër e klientëve të njohur të postës elektronike dhe motorëve të tyre të paraqitjes:
  • Përdorimi i Apple Mail, Outlook për Mac, Android Mail dhe iOS Mail WebKit.
  • Përdorimi i Outlook 2000, 2002 dhe 2003 Internet Explorer.
  • Përdorimi i Outlook 2007, 2010 dhe 2013 Microsoft Word (po, Fjala!).
  • Klientët e postës së internetit përdorin motorin përkatës të shfletuesit të tyre (për shembull, Safari përdor WebKit dhe Chrome përdor Blink).

Një shembull i HTML për Web Vs. Email

Nëse dëshironi një shembull që ilustron kompleksitetin e dizajnimit në email kundrejt internetit, këtu është një shembull i përsosur nga artikulli i Mailbakery 19 Dallime të Mëdha midis Email-it dhe Web HTML:

<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>

<div class="center">
   <a href="#" class="button">Find Out More</a>
</div>

Si të shmangni çështjet e dizajnit të postës elektronike

Problemet e dizajnit të postës elektronike mund të shmangen duke ndjekur një proces të mirë:

1. Dizajni i shabllonit – Ndërtoni një shabllon me paraqitje të ndryshme dhe blloqe përmbajtjeje që përfshijnë çdo stil që do të dëshironit të prodhonit ndonjëherë në modelet tuaja të postës elektronike. Kur zbatojmë një klient, ne gjithmonë e shtyjmë atë hartoni një email për të ardhmen – jo vetëm fushata e radhës me email që është dërguar. Në këtë mënyrë, ne mund të dizajnojmë, zhvillojmë, testojmë dhe zbatojmë plotësisht zgjidhjet e nevojshme para ata dërgojnë ndonjëherë atë email të parë.
2. Testimi i modelit – Të kuptuarit e klientëve të postës elektronike që abonentët tuaj po përdorin dhe të siguroheni që emaili juaj HTML është testuar plotësisht në celular dhe desktop është thelbësor përpara se të vendosni ndonjë shabllon. Ne mund të dizenjojmë një email fjalë për fjalë nga një paraqitje e photoshop-it… por prerja dhe prerja e tij në një klient të drejtuar nga tabela, ndër-email është thelbësor për vendosjen e modeleve të postës elektronike që janë optimale dhe të qëndrueshme.
3. Testimi i brendshëm – Pasi modeli juaj të jetë dizajnuar dhe testuar, ai duhet të dërgohet në një listë fillestare të brendshme brenda organizatës për ta rishikuar dhe miratuar. Ju madje mund të dëshironi të filloni me një nëngrup shumë të kufizuar individësh për t'u siguruar fillimisht se nuk ka probleme me murin e zjarrit ose sigurinë që lidhen me paraqitjen e emailit nga brenda. Nëse kjo po krijon një shembull në një ofrues të ri të shërbimit të postës elektronike, mund të gjeni edhe disa probleme filtrimi ose bllokimi që lidhen edhe me dërgimin e emailit tuaj në kutinë hyrëse.
4. Versionimi i shabllonit – Mos i ndryshoni paraqitjet ose dizajnet tuaja pa punuar në një version të ri të shabllonit tuaj që mund të dizajnohet, testohet dhe vendoset siç duhet. Shumë biznese i duan dizajnet e njëhershme për çdo fushatë… por kjo kërkon që çdo email të dizenjohet, zhvillohet dhe shpërndahet për secilën fushatë. Kjo i shton shumë kohë procesit të brendshëm të marketingut me email. Dhe, rrezikoni të mos kuptoni se cilët elementë në emailin tuaj po performojnë mirë se cilët elementë nuk janë. Konsistenca nuk është vetëm një mënyrë për ta bërë procesin më të lehtë, është gjithashtu e rëndësishme për sjelljen e abonentëve tuaj.
5. Përjashtimet e ofruesit të shërbimit të postës elektronike – Pothuajse çdo ofrues i shërbimit të postës elektronike ka një mjet për të punuar rreth çështjeve që prezanton ndërtuesi i tyre i postës elektronike. Ne shpesh mund të shtojmë CSS të papërpunuara në një llogari - ose edhe të kemi një bllok përmbajtjeje që duhet të përfshihet në çdo email - në mënyrë që kompania të përdorë redaktuesin e integruar të emailit dhe të mos e lërë atë të prishë dizajnin e emailit tuaj. Sigurisht, kjo mund të kërkojë njëfarë trajnimi dhe kontrolli të procesit për të vendosur këto hapa për t'u siguruar që ato janë në përputhje me to. Ose – fjalë për fjalë thjesht mund të dëshironi të zhvilloni dizajnin tuaj të postës elektronike në një zgjidhje që është vërtetuar se funksionon në të gjithë klientët dhe pajisjet, pastaj ngjisni atë përsëri në ofruesin tuaj të shërbimit të postës elektronike.

Platformat e projektimit të postës elektronike

Për shkak se platformat e shërbimit të postës elektronike kanë bërë një punë të dobët në ndërtimin dhe mirëmbajtjen e ndërtuesve të dhënë vazhdimisht ndërmjet klientëve dhe ndër-pajisjeve, një numër platformash të shkëlqyera kanë dalë në treg. Një që ne kemi përdorur gjerësisht është Stripo.

Stripo nuk është vetëm një ndërtues emaili, ata gjithashtu kanë një bibliotekë me mbi 900 shabllone që mund të importohen lehtësisht. Pasi të hartoni emailin, mund t'i dërgoni email mbi 60 ESP-ve dhe klientëve të email-it, duke përfshirë Mailchimp, HubSpot, Monitori i fushatës, AWeber, eSputnik, Outlook dhe Gmail. Më e mira nga të gjitha, shabllonet e Stripo vijnë me testet e paraqitjes së emailit të përfshirë, në mënyrë që të siguroheni që ato janë testuar dhe funksionojnë vazhdimisht në mbi 40 klientë të postës elektronike.

Identifikohu në Demon e redaktorit të Stripo

Zbulim: Unë jam i lidhur me tim firmë këshilluese për marketing i cili harton dhe vendos email-e ndër-klientësh për markat kryesore në pothuajse çdo ofrues të shërbimit të postës elektronike. Unë jam gjithashtu një degë e Stripo dhe unë jam duke përdorur lidhjen time në këtë artikull.