UPS Silverpop

EmailMarketingGuidelines&BestPractices
www.silverpop.com1866SILPOP(7468767)2009SilverpopSystemsInc.Allrightsreserved.TheSilverpoplogoisaregisteredtrademarkofSilverpopSystems Inc.
INTRODUCTIONTOTHEEMAILCHANNEL............................................................................................................... 3 BASICDEFINITIONS ............................................................................................................................................ 4 CONSIDERATIONSFORTHEMARKETER................................................................................................................. 5 Design&LayoutGuidelines..................................................................................................................... 5 FshapeReadingPattern......................................................................................................................... 6 SubjectLine............................................................................................................................................ 6 ContactInformation ................................................................................................................................. 7 WordsandPhrasestoAvoid.................................................................................................................... 7 OptoutLinks........................................................................................................................................... 7 TestSendDayandTime ......................................................................................................................... 8 WhataboutOutlook2007? ...................................................................................................................... 8 CONSIDERATIONSFORTHEDESIGNER.................................................................................................................. 9 HowWillMyMessageLook? ................................................................................................................... 9 BeCarefulwithTypeTreatment............................................................................................................... 9 DesignerConsiderationsforImages ........................................................................................................ 9 MessageFileSize ................................................................................................................................. 10 TextVersionDifferentthantheHTMLVersion? ..................................................................................... 10 CONSIDERATIONSFORTHECODER .................................................................................................................... 11 BasicCodingSuggestions ..................................................................................................................... 11 DocumentTypeDefinitionandValidation............................................................................................... 11 Flash,JavaScriptandForms ................................................................................................................. 11 UseofCSS ........................................................................................................................................... 11 InlineCSSwithFontStyles.................................................................................................................... 12 StyleBorder .......................................................................................................................................... 12 CoderTreatmentofImages ................................................................................................................... 12 AdjustmentsforOutlook2007................................................................................................................ 13 TEXTMESSAGEDESIGN& LAYOUTGUIDELINES .................................................................................................. 13 WindowsLatin1Characters(SpecialCharacters).................................................................................. 14 ForcedBreaks....................................................................................................................................... 14 Formatting............................................................................................................................................. 14 Links..................................................................................................................................................... 14 CODER'SAPPENDIX........................................................................................................................................ 15 SILVERPOPEMAILQUICKLIST...................................................................................................................... 17
IntroductiontotheEmailChannel
Sincethemid1990smarketershavebeenusinganexcitingnewwaytoreachcustomersandprospectivecustomers:the emailchannel.Emailisuniqueinthemarketingmixinthatitischeaper,fasterandmoreadaptablethanvirtuallyanyother marketingchannel.Anditcanalsobeoneofthemosteffective. Suchapowerfultoolisn'twithoutrisk.Emailhasitsownuniquerules,problems,andcomplexities.Thisdocument providesbasicguidelinesthatyouneedinordertoadheretobestpracticesintheemailmarketingmessagesyousendto recipientsintheUnitedStates,withspecialattentiongiventolayout,codinganddeliverability.Itdoesnotprovide internationalconsiderationsanddetailedevaluationsrelatedtodelivery,althoughmostsuggestionssurroundingother bestpracticesstillapply. Thisguidecontainssixmainsections: ConsiderationsfortheMarketer ConsiderationsfortheDesigner ConsiderationsfortheCoder TheCodersAppendixdesignedspecificallyforprogrammersofHTMLemails TextMessageDesign&LayoutGuidelines SilverpopEmailQuickListaonepagereferenceguideforallthingsemail
BasicDefinitions
Likeanyindustry,emailmarketingusesitsownvernacularthatthosenewtothespacemaynotbewhollyfamiliarwith. Evenifyouhavebeenfollowingemailforyears,termsstillcanvarywidelyfrompersontoperson.Belowyoullfind severalwordsandphrasescommonlyusedinemailmarketing,andhowtheyaredefinedforuseinthisdocument. Browser: AWebbrowserisasoftwareapplicationthatenablesausertodisplayandinteractwithtext,images, videos,musicandotherinformationtypicallylocatedonaWebpageataWebsiteontheWorldWideWeboralocal areanetwork.WebbrowsersformatHTMLinformationfordisplay,sotheappearanceofaWebpagemaydiffer betweenbrowsers.SomeoftheWebbrowsersavailableforpersonalcomputersincludeInternetExplorer,Mozilla Firefox,Safari,andOperaindescendingorderofpopularityasoflate2007. CSS: CascadingStyleSheets(CSS)isastylesheetlanguageusedtodescribethepresentationofadocument writteninamarkuplanguage.ItsmostcommonlyusedtostyleWebpageswritteninHTMLandXHTML. Email: Shortforelectronicmail,emailisastoreandforwardmethodofcomposing,sending,storing,andreceiving messagesoverelectroniccommunicationsystems. Emailclient: Afrontendcomputerprogramusedtomanageemail.Itrefers totrueemailclients,suchasthoseused bycorporations(Exchange/OutlookorLotusNotes),aswellasWebbasedemailprogramscalledWebmail.Webmail includestheabilitytosendandreceiveemailfromanywhereusingasingleapplicationviaaWebbrowser.Well knownU.S.WebbasedemailclientsincludeAOLMail,Gmail,Hotmail,andYahoo!Mail. HTML: HyperTextMarkupLanguage,orHTML,isthepredominantmarkuplanguageforWebpages.Itprovidesa meanstodescribethestructureoftextbasedinformationinadocumentbydenotingcertaintextaslinks,headings, paragraphs,listsandsoforth. ISP: AnInternetServiceProvider,orISP,isabusinessororganizationthatprovidesconsumersorbusinesses accesstotheInternetandrelatedservices.WellknownU.S.ISPsincludeAOL,Comcast,Juno,NetZero,Verizon, Yahoo. Phishing: Phishingisanattempttocriminallyandfraudulentlyacquiresensitiveinformation,suchasusernames, passwordsandcreditcarddetails,bymasqueradingasatrustworthyentityinanelectroniccommunication,typically inanemail.Aphisherisapersonwhoinitiatesaphishingattack. W3C: TheWorldWideWebConsortium,orW3C,isthemaininternationalstandardsorganizationfortheWorldWide Web(abbreviatedWWWorW3). W3Cwascreatedtoensurecompatibilityandagreementamongindustrymembers intheadoptionofnewstandards.Priortoitscreation,incompatibleversionsofHTMLwereofferedbydifferent vendors,increasingthepotentialforinconsistencybetweenWebpages.Theconsortiumwascreatedtogetvendors toagreeonasetofcoreprinciplesandcomponents,whichwouldbesupportedbyeveryone.TheW3CWebsitecan befoundat:http://www.w3.org XHTML: ExtensibleHyperTextMarkupLanguage,orXHTML,isamarkuplanguagethathasthesamedepthof expressionasHTML.XHTMLisaproposedsuccessortoHTML.Assuch,manyconsiderXHTMLtobethecurrentor latestversionofHTML.However,XHTMLisaseparaterecommendationtheW3Ccontinuestorecommendtheuse ofXHTML1.1,andHTML4.01forWebpublishing. EmailSpam:Technically,spamisunsolicitedbulkemail(UBE)orunsolicitedcommercialemail(UCE).Spamming isthepracticeofsendingthesemessagesinlargequantitiestoanindiscriminatesetofrecipients.Mostmarketers considerspamtobeanymessagessentwithoutpermission,whereasthemajorityofconsumershaveamuch broader,lesstolerantdefinition.Theydefinespamasanymessageirrelevantenoughtowastetheirtime,regardless ofwhethertheyoptedintoreceiveit.
ConsiderationsfortheMarketer
Design&LayoutGuidelines
Approximately90percentofemailsubscriberswillbelookingatyouremailthroughtheirpreviewpane.Thepreviewpane isasmallportionoftheavailablescreenwheretherecipientcanviewthemessagewithoutactuallyopeningit.This viewablespaceisoftenreferredtoasabovethefold,andcanbehorizontalorvertical.Eitherway,thetop24inches (400500verticalpixels)ofyourmessagewillbeallthatis visible.Keycontentsuchasmessagenavigation,callstoaction andlogosshouldbevisibleinthiscriticalspace.
InboxandpreviewpaneinMicrosoftOutlook2003 Emailclientsaresensitivetothewidthofanemailmessage.Typicallyyoushouldntdesignemailstobemuchwiderthan 700750pixels(thoughmostclientsdisplaymorethan800pixels).Ahistoricalandmoreconservativeapproachwouldbe tolimitmessagewidthto600pixels.ThisisespeciallytrueifyouknowthatamajorityofrecipientsareusingOutlookor otherclientswithapreviewpane.Inthosecasesitispossibletheymayviewthemessagesolelyfromthepreviewpane.
Peoplerarelyreadanemailinitsentirety,soitisagoodpracticetousesummarizedinformationthatprovidesthereader withlinkstoadditionalinformation.Studiesshowthattheaveragereaderspendslessthanthreesecondsscanninga messageinsearchofsomethingthatgrabshisorherattention.Ifsomeonetakesanaction,suchasclickingalink,that personislikelytoinvesttwotothreeminutesormore.Whencraftingyourmessage,beginsubheads,paragraphsand bulletpointswithinformationcarryingwordsthatthereaderwillnoticewhenscanningtheleftside.Recipientswillread thefirsttwowordsofalinemoreoftenthananyotherpartofthelineonaverage.Understandinghowreadersviewemail willhelpyoudesignaneffectivemessage.
FshapeReadingPattern
Usersfirstreadmessagesinahorizontalmovement,usuallyacrosstheupperpartofthecontentarea.Thentheyread downthepageabitandreadacrossasecond,shorterhorizontalline.Finallyreadersscanthecontentsleftsideina verticalmovement.TogetherthispatternformsanFshapeseenineyetrackingheatmapsofuserbehavior.
HeatmapsfromusereyetrackingstudiesofthreewebpagesillustratingtheFshapepattern Source:JakobNielsen,http://www.useit.com/alertbox/reading_pattern.html KeepingtheFshapeinmindthefirsttwoparagraphsshouldcontainthemostimportantinformationinyourmessage,and theywillmostlikelyreadmoreofthefirstthanthesecond. AfinalnoteontheFshapeisthatimages,boxesandinterestingheadlinescanbreakthepatternandproveinterestingto readers.Themoreinterestingthemessagelooksthelongertheuserswilldedicatetofindingmoreinformationtheyfind important.Besuretotaketheageofyourreadersintoconsiderationwheneverpossibleyoungerviewerstendtoprefer imagestotext.
SubjectLine
Formarketingmessagesitiscertainlyfineforyoursubjectlinetoconveyasenseofurgency,butbewiseinwordchoice. Yoursubjectlineshouldbedirect,timelyandhaverelevantimpact.Toreducetheprobabilityofyoursubjectlinebeing truncatedintheinbox,limitsubjectlinestolessthan46characterscountingspaces. Thebestpracticeforsubjectlinesistotest,test,andretest.Sampletestseveralsubjectlinestoa10percentrandom selectioninyourlistandevaluatetheeffectivenessofeachsubjectlineintermsofopenandclickthroughrates.Afteryou havetestedanumberoftimesyouwillgainasenseforwhatworksforyoursubjectmatterandaudience.Keepinmind thatsubjectlineeffectivenessmaychangeovertime,soasabestpracticeyouwillwanttoreevaluateonaregularbasis.
AnothermethodfortestingsubjectlinesisanA/Btest.Createabaselinecreativeandtestitinanemailsoyouknowhow youraudiencereacts.Thencrafttwodifferentsubjectlinestotest,andsendasampleofyouraudience,usuallyaround10 percent,thesamecreativeusingthesubjectlineAandanothersamplethesubjectlineB.Yourcontrolgroupwillreceive thestandardsubjectline.Makesmallchanges,oneatatime,andtrackthechangesovertime.
ContactInformation
Alwaysincludeavalidphysicalpostaladdressineverycommercialemailyousend.Itnotonlyprovideslegitimacyforyour contentbutcouldberequiredbytheCANSPAMActof2003.Youshouldalsoprovideanemailaddress,callcenter contactinformationorboth.Remembertonotehoursofoperation.And,becauseemailcanbeasensitivesubject, reassureyourreadersbygivingthemabriefdescriptionofyouremailprivacypolicyandprovidingalinktoyourfull privacystatementincasetheywanttolearnmore.
WordsandPhrasestoAvoid
Inyearspast,itwasrelativelyeasytocreatealistofwordsandphrasesthatlegitimateemailmarketersneededtoavoid inordertodifferentiatetheiremailfromspam.However,astheemaillandscapegrowsincreasinglydiversewithmore companiesturningtoemailandspammersbecomingmoresophisticated,theoldstandardsarenolongeralwaysas applicableorrelevant. Usingtheword"free"usedtobeaonewaytickettothejunkfolder,butasmorefiltersmovetowardreputationbased delivery,thistrustedruleisontheretreat.Infact,recentresearchindicatesthatmanyoldphrasessuchas"free"and "clickhere"aresocommonthatspamfiltersmaynotapplyanyweighttothematall.Usingtheword"free"inasubject lineisprobablystillnotagreatidea,iffornootherreasonthanitsrampantoverusebymarketers,butdoingsomayno longeraffectyourpathtotheinbox. Generally,wordsandphrasesthatarefinancial,realestaterelatedorsexualinnaturewillincreaseaspamscoreandthe probabilitythatanISPwillfilteryourmessagebeforeitreachestheinbox.Thisposesaparticularchallengetolegitimate marketersinindustriesthatmaynaturallyendurelowerdeliveryrates.Butifyoucanavoidwordsorphrasescommonly usedbytheseindustries,youarewellonyourwaytoasafermessage. Thebottomlineistoapplycommonsensetoyourmessage.Ifitreadslikespamthenitwilllikelybeinterpretedasspam byISPsandrecipients.
OptoutLinks
Onepracticetoconsideristoplaceanoptoutlinkatthetopandagainatthebottomofyouremailsothatyourrecipient canoptouteasilyfromyourlist.UnderCANSPAMlaw,sendersofcommercialemailmustalwaysinformrecipientsof theirrighttooptoutandprovideafunctioningoptoutmechanismthatcanprocessoptoutrequestsforatleast30days afteranemailissent.Becausemanyemailclientsdisableimagesbydefault,besuretoprovideatextbasedoptoutlink thatwillstillfunctionifgraphicsaredisabled.Transactionalemail,asitsnameimplies,referstocommunicationsregarding current,agreedupontransactionsbetweenthesenderandrecipient.Transactionalmessagesareexemptfromsomeof themorearduousprovisionsofCANSPAM.Mostnotably,sendersarenotrequiredtoprovideanoptout.Thelaw narrowlydefineswhatconstitutesatransactionalmessage.* Eventhebestnewsletterormarketingmessagewillhaveindividualswhowanttounsubscribe.Donttakeitpersonally. Makeyouroptoutconspicuousandeasytofollow.Ifanindividualwantsoffyourlistyoushouldremovethem immediately.Dependingonyouruniquebusinesssituation,youmayalsodeemitappropriatetosendthemanemail confirmingtheirchangeinstatus.Whenyoureceiveanoptoutrequest,CANSPAMlawgivesyou10businessdaysto stopsendingemailtotherequestorsemailaddress.However,keepinmindthatevenifyouabidebytheletterofthelaw, continuingtosendemailinthedaysfollowinganoptoutalmostcertainlywillannoyyourformerrecipientsandmayeven leadtospamcomplaintstotheISP.Byfollowingbestpracticesyoucanleaveonelastfavorableimpressionthatmay evenbeabletoencourageformerrecipientstojoinyourcommunicationsatalaterdate. *Informationregardingregulatoryissuesisprovidedhereonlyfordiscussionpurposes.Youshouldconsultanattorney whoisfamiliarbothwiththeapplicableregulationsandyouruniquebusinesssituationbeforetakinganyaction.
TestSendDayandTime
Toascertainthebesttimeordayoftheweektosendyouremailmarketingmessage,testyourmessageatdifferenttimes ordifferentdaysoftheweek.Thiswillallowyoutomeasuretheidealmomenttosendyourfinalmailingtoyourtarget audience.Donotcountonoldrulesofthumborblanketgeneralizations.Theperformanceofanemailmessagewillvary greatlyfromindustrytoindustryandaudiencetoaudience.Theonlywaytotrulyknowthebesttimeanddaytosendyour messageistotestit. Toavoidintroducingtoomanyvariables,donttrytotestyouroptimalsenddayandtimewhilesimultaneouslytesting creativeandsubjectlines.Approachyourtestingscientifically,creatingabaseline,andthentestingonevariableatatime.
WhataboutOutlook2007?
ManymarketershaveexpressedconcernaboutMicrosoft'sreleaseoftheOutlook2007desktopemailreaderplatform. Microsoftholdsadominantshareofthedesktopemailreadermarket.Someestimatesputitupwardof6070percent, whichmeansthatforBtoBandBtoCmarketers,agoodportionofrecipientswillviewmessagesusinganOutlookproduct. ThesourceoftheworryisMicrosoft'sdecisiontoabandonInternetExplorerastherenderingengineinfavoroftheengine fromitspopularwordprocessor,Word2007.AlthoughseveralinherentlimitationsinWord2007canaffectemail messages,thenegativeimpactwillbeminimalformarketerswhofollowthebestpracticesfordesignandcodeoutlinedin thisdocument.Themajorityofadjustmentsisaroundthecodingofthemessageitselfandisoutlinedingreaterdetailin theConsiderationsfortheCodersectionofthisguide. ThechangewillonlyaffectrecipientswhouseOutlook2007.TheOutlook2007specificrecommendationsofferedinthis guidearenotnecessaryforOutlook2003,OutlookExpress6,andOutlookXPusers,butwillnotalterrenderinginthose productsifemployed. Alsonoteadoptionfromthepreviousversion,Outlook2003,wassluggishin2007andearly2008butisexpectedtogrow nearingthenextversionexpectedin2010.
ConsiderationsfortheDesigner
HowWillMyMessageLook?
Oneofthemorefrustratingaspectsofemailistryingtoanticipatehowthemessagewilllookwhenitreachesthe recipient.Withtelevisionorprintyoucanbeconfidentthatwhatyouhavedesignediswhatwillbedeliveredtothe recipient.Itissimplynotthecasewithemail. Renderingvariationsareafrictionpointbetweenthemarketer,designerandcoder,andthosevariationsarelargely beyondtheircontrol.Youcannotassumethatadesignviewedinthedesignsoftwareortestmessageviewedinaninbox isexactlywhateachrecipientwillsee.Instead,youmustacceptthatitismerelyrepresentativeofwhatrecipientswillsee. Renderinginconsistenciesarecomplicatedbecausetheyareinfluencedbymessagedesign,code,emailclientusedto viewthemessage,browserandbrowserversion,andusersettings.Thetwobiggestfactorsthatimpactrenderabilityare thecodeandthereceivingemailclient. Poorlycraftedcodethatemploystechnologiesnotsupportedinemailistheeasiesttocorrect.Thebestpractices suggestionsinthisdocumentwillprovideyouwiththegreatestchanceofhavingyourmessagerendercorrectlyoverthe widestvarietyofpossibilities.However,evenifyouadheretobestpracticeguidelines,yourmessagestillmaynotrender perfectlyacrosstheoverwhelmingmyriadofpossiblepermutationsinwhichthemessagecouldbeviewed. Differentemailclients,suchasOutlook,Hotmail,Lotus,Gmailetc.,rendercodedifferentlyand,differentWebbrowsers andversionsofthosebrowsersviewWebbasedemailandinterpretcodedifferentlyaswell.Infact,evenwithinasingle WebbasedISP,multipleemailserverswithsubtleconfigurationdifferencescanaffectyourmessage.Whatyoumust keepinmindisthatwhatdisplaysinoneemailclient/browsermaynotdisplayinanotherandalmostcertainlywon't displayidentically.
BeCarefulwithTypeTreatment
Traditionallytheuseofallcapsfortype,especiallyinthesubjectline,wouldincreaseyourspamfilteringscore. AdditionallytheuseofsomecolorsforHTMLfontscancauseproblemswithdeliverability.Brightredsandbluesaretwo suchcolors.Theserulesofthumbmaynotcarrythesameweightastheydidinthepasthowever,theuseofallcapsis generallyregardedas"yelling"intheelectronicworld,andmessagescomposedofbrightredtypewillnaturallylookalittle suspicious.Usecommonsenseandkeepinmindthatyouarecompetinginthesameinboxasrealspammers,sodont allowyourmessagetolookanythingliketheirs. Alsoavoidusinguniqueornonstandardfontsinanemailmessage.SimilartoWebpages,recipientswillonlybeableto seefontsthatareresidentontheirmachine.Otherwise,thecomputerwillselectadefaultfont,typicallyHelvetica.To ensureyourmessagelooksasintended,choosestandardsystemfontssuchasArialandVerdanainafontsizeno smallerthanavalueof2fortypicalbodycopy.
DesignerConsiderationsforImages
Imagesshouldbehostedandneverattachedtoanemailmessage.Hostingcanbedonebyyourcompanyorbyyour emailserviceprovider.SilverpopincludescontenthostingaspartofitsMarketersolution.Thisallowstheimagestobe downloadedfromaWebserverwhentherecipientopensthemessage.However,manyemailclientssuppressimagesby defaultandrequireuserstoactivelyenableimagesinyourmessage.Whatisthebestwaytohandleimages? First,viewmessageswithoutimagesandconstructyouremailsothatitfunctionsevenifimagesaresuppressed.Ifthe entiretopportionofyourmessageisanimageandtherecipientviewsitinapreviewpane,heorshewillseenothing. Designyourmessagetoincludesomeinformationcarryingwordssuchasyourcompanynameorbrandingatthetopso thereaderhasabetterideawhothemessageisfromandwhatitisabout.
Avoidusingbackgroundimages.Ifusingabackgroundimageisunavoidable,becarefultodesignthemessagesuchthat thecommunicativevalueisnotcompromisedwhentheimageissuppressed.AbackupplanistocodeaHTMLsolidcolor asthebackgroundofthetableorcell.Thatwaywhentheimageissuppressedthereissomecolorasabackdroptoyour message. LineartworkandtextheadingsshouldbesavedasGIFsandphotosorimageswithgradientscanbesavedasJPEGsat mediumqualityoptimizedforWebcontent. UseofanimatedGIFsisnotrecommendedbecausemostclientswillonlydisplaythefirstframeoftheanimation.That said,ifananimatedGIFisused,ensurethefirstframeofanimationcommunicatesthepurposeofusingtheimagesinceit islikelyallthattherecipientwillsee. Avoidusingimagesthatcontainimportantcopybecausethecopywon'tbeseenwhenimagesaresuppressed. Additionallythatpracticealsoraisestheratioofimagestotext,whichwillincreaseyourprofiletospamfilters.Agood generalguidelineistouseanimagetotextratioat30/70orbelowtoavoidunnecessaryattentionbythefilters.
MessageFileSize
Messagefilesizecanhaveadirectimpactonthesuccessofamailing.Messagesizesover120Kwilllikelygetyour messageblockedorfilteredbyavarietyofISPsandemailclients.Ifthemessageisdelivered,thereadermaybe suspiciousofitssize,thinkingtheremaybeavirushidinginside.Ideallyyouwillwantamessagesmallerthan75Kand around35Kisrecommended. However,thoselimitationscancreateaproblemwhenyouarecomposingamessagewithimagestomakeitmore interestingortobreakuptheFshapepattern.Thewayaroundtheproblemistoensurethatyourimagesareoptimized foruseontheWeb.Weboptimizedimageshavesmallerfilesizesandwillhelpkeeptheoverallfileweightofyour messagedowntoareasonablelevel.
TextVersionDifferentthantheHTMLVersion?
IfyourHTMLmessagehasalotofcopy,considerthatyourtextversioncouldbeaneditedversion.Thetextversionofa messageshouldbeplainandsimple.AheavyHTMLmessagewillstarttolooklikeabookififyoushifteverywordoverto thetextversion,andthatcouldproveoverwhelmingtomostrecipients.Shortenyourtextversionbymakingbulletedlists anddirectingyourreaderstolinkswheretheycanfindmoreinformation.
ConsiderationsfortheCoder
BasicCodingSuggestions
ThefirstthingtounderstandisthatHTMLcodingforWebpagesorWebsitesisnotthesameHTMLcodethatshouldbe usedforemail.Asaruleemailcodeisarelativelyunchangingtechnology.Websiteshaveadvancedtoincludenewer versionsandstylesofHTML.Marketershavebecomemoresophisticatedinhowtheyusetheinformationstoredintheir databases.And,thetoolsmarketersusetosendemailhaveincorporatedfeaturestomeettheirgrowingdemands. However,theHTMLcodeappropriateforuseinemailisverymuchthesameasitwasinthelate1990's. TheoldtoolsofthetradeforWebpagecreation,suchasfonttagsandtables,areastapleofemaildesignbecausethey complywiththerequirementsofmostanyemailclientorbrowser.Thequalityofyourcodehasadirectimpactonhow recipientsviewyourmessages,andindeedwhethertheyreachthematall.Belowisashortlistofitemstokeepinmind. Attheendofthisdocumentisanaddendumwithacompleteguidetohelpthecoder. ChoosestandardsystemfontssuchasArialandVerdanainafontsizenosmallerthanavalueof2fortypical bodycopy. AvoidDIVorSPANtags. Don'tuseEMBEDtags. UseinlineversusembeddedCSSifyouhavetouseCSSatall.ItisbesttolimittheCSStofonttreatments backedupbystandardHTMLintheeventthestyleisnothonored.CSSusedforspaceandpositioningshouldbe keptsimplelimitedtobasicpadding,left,right,andcenter. Limitnestedtablestonomorethanthreelevelsdeep.NestedtablesmaynotworkatallinLotusNotes.
DocumentTypeDefinitionandValidation
ThefirstandarguablymostimportantruleforHTMLemailistocodewiththeHTML4.01TransitionalDocumentType Definitionorlower(seehttp://www.w3c.orgfordetailsonthe4.01TransitionalDTD).DeclaretheDTDatthetopofthe code.Thispracticeisvaluableininformingthereceivingemailclientwhatcodeisbeingsentandisrequiredforcode validation. Codevalidationrequiresverylittletimeandeffortbutisacriticalstepnotonlyformessagerenderingbutmessage delivery.ManyemailclientsandISPsevaluatethequalityofthecodeofanincomingmessageasafirsttestofa marketersintegrity.Sloppy,errorladencodeisassociatedwithspammers,andasstatedearlierthegoalofevery reputablemarketershouldbetoavoidbeingperceivedinsuchanegativelight. Beforetestingorlaunchingyourmessage,besuretovalidatethecodeandcorrectanyissues.Thebestsourceforcode validationistheWorldWideWebConsortium(W3C).Youcanvisithttp://validator.w3.org/tovalidatecodebyURL,file uploadordirectinput.IrregularitiesstemmingfromproprietaryencodingsuchasthosefoundinSilverpop'sEngage productcanbeignored.
Flash,JavaScriptandForms
MostemailclientsdonotsupportFlashcontent.InmostcasesFlashcontentwillappearasanXorevenasrawcode. MostclientsalsodonotsupportJavaScript. Silverpopdoesnotrecommendusingformsinanemail.Spammersandphishershaveusedformstotrickrecipientsinto givinguppersonalinformationformaliciouspurposes.Consequently,formsareviewedasnegativelyasattachedimages byvirusfilters. ThinkofanemailasasteppingstonetoaWebpagewhereyoucanexercisemorecontrolovertheuserexperience. Refrainfromusingfancycodeinyouremailmessages,andwaituntiltheyarriveatyourWebsitefirst.
UseofCSS
ModernwebpagedevelopmenthasdrivencodersofHTMLemailtorelymoreandmoreonCSS.Aspreviously mentioned,useofCascadingStyleSheets(CSS)isnotrecommended.Inanemailmessageitiscommonforinformation
intheheadtagofthecodetobestrippedoutcompletely,soanembeddedstylesheetwillnotwork.Duetothenatureof email,referencetoanexternalstylesheetabsolutelywillnotworkwithmostemailclients. TheonlywaytouseCSS,ifitmustbeusedatall,isintheformofinlineCSS.Althoughyouwilllosesomeofthe advantagesthatleadyoutouseCSSinthefirstplace,usinginlineCSSisacceptableifyoulimityourstylestofontand basicformatting.
InlineCSSwithFontStyles
CascadingStyleSheets(CSS)istypicallyusedwithspecificfontreferences(i.e.11px)versustheoldintegerreference (i.e.size="2").Manyemailclientswillhonorafontstyle,butincasetheydonot,youshouldbackupthefontstylewitha standardHTMLintegersize.Forexample:<fontface="Verdana,Arial,Helvetica,sansserif"color="#000000"style="font size:11px"size="2">.Thiswillimpartsomecontroloffontsizewherethestyleisnothonored. Whenyouareworkingwithfonttags,especiallyifalsousinginlinestyles,youshouldgetintothehabitofputtingall paragraphelementsinthesameorder,i.e.,<fontface="x"color="x"style="x"size="x">incaseyouneedtomake documentwidechanges.ThistiptohelpeasethepainofnotusingembeddedCSS.
StyleBorder
Perhapsyourmessagecreativerequiresaborder.Onewaytoaddressthisproblemistoaddborderimagesintablecells. However,borderimagesraisetheHTMLtotextratio,andwillnotbeseenwhenimagesaresuppressed,andcan complicaterevisionsifbodycopygrowsorshrinks,necessitatingaresizingoftheimage.(SeetheOutlook2007section onthedangersonstretchingimages.)Thebestwaytohandleimagesistocodeatableborder.Acommonlyusedand webacceptableCSSwaytocodetheborderis: style="border:1pxsolid#000000" However,theshorthandstylewillcauseproblemswithseveralpopularemailclients.Youcancodetheexactsameborder morereliablywiththefollowingsyntax: style="borderstyle:solidbordercolor:#000000borderwidth:1px" SimilartotheHTML4.0days,emailrenderingismorereliablewhentagattributesarecalledoutindividually.Itmaytakea littlelongertowritebutthebenefitsofsendingmessagesthatrenderusefullyforrecipientsiswellworththeextraeffort.
CoderTreatmentofImages
IfyouarevalidatingyourcodeyouwillhavetoincludeALTtagsonallofyourimages.AccordingtotheDisabilitiesAct (section508)allimagesshouldincludeALTtagseveniftheyareusedasspacerGIFs.InthecaseofspacerGIFSand imagesthatdon'tlendthemselvestodescription,useanemptytag.Whendealingwithalogo,banner,oracalltoaction graphic,besuretoincludeabriefALTtag.Notonlyisitrequiredforvalidation,butmanyclientswilldisplaytheALTtag evenwhentheimageitselfisnotenabled.Thatmayprovidetheuserwithenoughinformationtotrustyourmessageand wanttoseemore. Alwaysuseheightandwidthattributesonimagestags.Specifyingtheheightandwidthwillinstructthecodetomaintain thepositiononthepage.Thatcanhelpyourmessageholditsformwithimagesandtextevenwhentheimagesare suppressed.Thewireframeeffectwillhelptheuserknowwhatthemessageisaboutandincreasethelikelihoodof enablingtheimagesandcontinuingtoreadyourmessage. IfyouknowthatagoodportionofyourlistisgoingtoacorporateclientusingOutlook,hereisatricktohelpyour messageslookbetter.InmostcasesOutlookwilldefaulttosuppressingimages.Theimagesarereplacedbythedisplay Rightclickheretodownloadpictures...Youcancontrolthewaythattextlooksbyaddingastylecolorattributetothe IMGtag.Ifyoudontwantthattexttoappearoneveryimage,youcansetthecolortomatchthecolorofthesolid backgroundbehindtheimage,usuallywhite.Oryoucouldhaveitappearasanothercolor.Againthistrickonlyworkson Outlookclients.
Asstatedinthedesignersection,avoidusingbackgroundimagesifpossible.Ifusingabackgroundimageisunavoidable, codeaHTMLsolidcolorasthebackgroundofthetableorcell.Thatwaywhentheimageissuppressedthereissome colorasabackdroptothemessage.
AdjustmentsforOutlook2007
Therecommendationsinthisdocumentarepartofemailcodingbestpracticesbecauseoftheirconsistencyandreliability. WhenyoufollowthesepracticesthemajorityofwhatisneededtoaccommodateOutlook2007isalreadydone. Nevertheless,youwillneedtomakelimitedadjustmentstohelpensurereliablerendering. Aswithallothermessages: AvoidingCSS(orusingbasicinlineCSS). AvoidDIVorSPANtags. DonotuseFlash,JavaScriptorforms. Hostallimages.Donotattachimages. Donotusebackgroundimages. Includealttagsforallimagesincludingthoseusedforformatting.Anemptytagisacceptable.Accordingtothe MicrosoftDevelopersNetworkthealttagisNOTsupported(http://msdn2.microsoft.com/en us/library/aa338201.aspx),howeverallavailabletestinghasshownthatisnotthecase.Sinceanalttagis requiredtovalidateyourHTMLcode,besuretoincludeit. SpecifictoOutlook2007: Specifythewidthandheightofallimagesandmakesurethecorrectdimensionsarepartofthefileproperties. StretchedimagessuchasbarsorbordersmaynotrendercorrectlyevenwhendefinedbytheHTMLcode. Marginsareignoredforimages.Consideraddingwhitespacetotheimage. Align="absmiddle"forimagesisignored. Valignforimagesisignored.Outlook2007doeshonorvspace,howevertheattributeisnotcompatibleinFirefox orOperaandisnotrecommended. Floatstyleisignored.Usealign="left"oralign="right"instead. Liststylesareignored,meaningnoimagesforbullets,squarebulletsorlistswithoutbullets. Outlook2007imposesaminimumheightof2pixelsonallcells,hencea1x1pixeltransparentGIFwitha backgroundcolorcommonlyusedforformattingorborderswillappearthickerthanexpected Forbestresultsusewidthattributesoncells.Outlookwillnotalwayssizecellsappropriatelyifnotdefined. Cellpaddingisnotreliable.Outlook2007mayplaceyourpaddingOUTSIDEthecellratherthaninsidethecell. Yourbestbetistoavoidsituationswheretightspacingisrequired.
TextMessageDesign&LayoutGuidelines
Fortheemailmarketerthesimpletextmessageisstillanecessaryevil.Itwon'tincludethecolorandformattingofthe HTMLversion,butsomestudiesreportuserswhopreferit,andtextemailssenttomobiledevicescanhavemorereliable rendering. SilverpopEngageaswellasmostotheremailproviderssendstextmessagesasamultipartMIMEmessage.Multipart MIMEreferstosendingbothanHTMLandTEXTpartofanemailmessageinasingleemail.Whenasubscribersemail clientreceivesamultipartmessage,itacceptstheHTMLversionifitcanrenderHTML,otherwiseitpresentstheplaintext version. Asmoreandmoreclientsareable,andevendefaulttodisplayingHTML,thetextmessagemaygobythewayside.This iseventruerasmoremobiledevicesbecomecomplianttostandardHTML.Todaytheresponsiblemarketershouldstill includethem.
WindowsLatin1Characters(SpecialCharacters)
WhereverpossibleuseatexteditorsuchasWindowsNotepadtocreateyourtextmessages.ProgramslikeMicrosoft Worduseacharactersetcalled"WindowsLatin1,"whichintroducesspecialcharactersthatappearasablockor questionmarkwhensentinatextonlyemailmessage.Alsoknownas"specialcharacters,"typicalexamplesincludecurly apostrophesorquotes,trademarks,servicemarks,copyrightandregisteredmarks. IfyoubuildyourmessageinMicrosoftWordyoucanturnoffthesecharactersthroughtheAutoFormatandAutoCorrect options.Notethatyoumustturnofftheseoptionsbeforeyoucomposeyourmessage.Additionallyifyoureceivea documentwiththecharactersenabled,theywillpersistandneedtobecorrectedbeforeyousendyourtextonlymessage. Regardlessofwhatprogramcreatedyourtextversion,agoodruleistopasteitintoabasictexteditor.Ifyour apostrophesorquotesappearslantedyoushouldreplacethemwithastraight(vertical)quotebyretypingthecharacter. Convertorto(R)and(C).Ifyouseeyourtrademarksorservicemarksassuperscriptyouwillneedtoretypethemas well.
ForcedBreaks
Donottrytoforcebreaksinyourtextversions.Theproblemwithforcedbreaksistoknowexactlyhowtomakethebreak. Thereareamanydifferentscreenresolutionsandyourusermayhavetheviewingwindowsettoavarietyofsizes makingyourchoicenobetterthanaguess.Limitbrakestosubheadingsandparagraphs,andalwaysputlinksontheir ownline.
Formatting
Makeiteasyfortherecipienttofindimportantinformationbyutilizingbulletsandvisualmarkers.Aseriesofhyphensor equalmarksarepopularchoicestoseparatesections.Toavoidthesameissueyouwouldhavewithforcedbrakes,limita rowofthesecharacterstoabout50characters. AswithHTMLmessages,bulletedcopyisagoodwaytomakemessagesshorterandeasiertoread.Useanastrick(*)or hyphen()tocallouteachbullet.Donotusethegreaterthan(>)tocalloutbullets.NeitherMicrosoftOutlookclientwill properlydisplayaseriesof>symbolsstackedononeanother.
Links
Alwaysputlinksontheirownline.Themainreasonforthisisifyourlinksappearsinapartoftheparagraphthatwrapsto thenextline.Ifyourlinkisbrokentotwolinesitwontworkanditwouldforcetherecipienttohavetocutandpastethe fracturedlinkbetweenyourmessageandtheirbrowsernavigationbar.Clearlythiswillnotbeagooduserexperience. Puttingthelinkonitsownlineattheendoftheparagraphisthebestpracticemethodbecauseitwillpermityouthe maximumamountofspaceforyourlinktoavoidwrapping,aswellasdrawattentiontothelinkseparatedfromthe paragraph. DonotuseabbreviatedURLsbeginningwithwwwinthetextversion.Ifyouareusinganemailserviceproviderand intendtotrackthelinksinyourmessage,youwilllosesomeofyourtrackingpotentialbecausemanybrowsersaccessing Webbasedemailclientswillautomaticallyturnanythingleadingwithwwwintoalink.Therecipientcanfollowthatlinkand bypassthetrackedlinkyouhaveplacedattheendoftheparagraph.
Coder'sAppendix
HTMLandDTD Alwaysvalidateyourcodeatw3c.organdaddressanyissuesbeforelinkorimageencoding. UsetheHTML4.0or4.01TransitionalDTDandincludethedeclaration. BodyandHead Includea"bgcolor"attributeinthemaintabletag.Thiswillavoidhavinganunexpectedbackgroundcolorwhen theuserhasspecifiedcustomwindowssettings.Notedonotputthisattributeinthebodytagbecausemany clientsstripallattributesfromthebodytag. Donotusethebodytagtosetanyessentialattributes.Manyemailclientswillstripthemoutcompletely.Codethe desiredattributesasstandardHTML. Besuretoincludea<title>tag. Structure Tables Specifyallalignmentsanddonotrelyonadefaultalignment.Someemailclients(Gmailinparticular)willcenter alignifnotspecified. Whenspecifyingactive,andvisitedlinkcolorplacetheminsidethe<a>tag. AvoidDIV,SPAN,orEMBEDtags. DonotuseGENERATORtags. AvoidspecifyingTDorTABLEheight. NeveruseHTMLcommentstohidestructureinanemail.Manyemailclientswillshowthecommentedout structureanyway.Ifyoudontwantitremoveit. SpecifythetoplevelTABLEwidth.
SpecifyTDwidthswhereverpossible. Limitnestedtablesto3levels,threemaximum. Donotincludeanyemptycells.Typicallyusedforspacing,anemptycellwithheightorwidthattributesisnot followingtruetablestructureandwillcauseproblemsinsomeemailclients.Anemptycellcancontainanon spacebreak(&nbsp)withformattingsuchasfontsizeoraninlinestylereference. ImagesandFonts Avoidusingbackgroundimages.IfabackgroundimageMUSTbeused,backthecellwithastandardsolidcolor backgroundthatwillcomplementthemessageiftheimageisnotrendered. DonotuseanimatedGIFs. Donotuseshorthandvaluesforcolorattributes(#FFFversus#FFFFFF). Alwaysspecifyanaltattributeforimages. Specifytheheightandwidthofimagessothatthecodereservesthespaceforyourimageswhentheyare suppressedbytheemailclient. Iffontstylesincludesizereferences(11px),backthemupwithastandardHTMLsize.Forexample.Thiswillgivesome controloffontsizewherethestyleisnothonored. Whenworkingwithfonttags,especiallyifyouarealsousinginlinestyles,itishelpfultogetintothehabitof puttingallparagraphelementsinthesameorder,i.e.<fontface="x"color="x"style="x"size="x">incaseyou needtomakedocumentwidechanges.ThisisatiptohelpeasethepainofnotusingembeddedCSS. Avoidallowingaspaceafteraclosing,andbeforeaclosingor</td>.Insomesituationsthelastline intheparagraphwillbebumpeddownfromtherestofthecopybecausetheheightoftheunmanagedspacewill behigherthanthefontsizeused.
CSS/StylesandOtherTechnologies OnlyuseinlineCSS. The"margin"styleattributeisunreliableacrossmanyclientsandisnotrecommended. InOutlookonly,addingastylecolorattributetoan<img>tagcanallowyoutocontrolthecolorofthetextthat appearspromptingtheusertodownloadsuppressedimages.Usingthesamecolorasthesolidbackgroundcolor, usuallywhite,canmakethetextappeartodisappear. DonotuseFlashcontent,JavaScript,orforms.
NonASCIIorSpecialCharacters Code&to&amp Codeto&copy Codeto&reg CodeTMto&trade Donotusesmartquotes(curlyquotes)orcurlyapostrophes.
Outlook2007 Specifythewidthandheightofallimagesandmakesurethecorrectdimensionsarepartofthefileproperties. StretchedimagessuchasbarsorbordersmaynotrendercorrectlyevenwhendefinedbytheHTMLcode. Marginsareignoredforimages.Consideraddingwhitespacetotheimageforthedesiredeffect. Align="absmiddle"forimagesisignored. Floatstyleisignored.Usealign="left"oralign="right"instead. Liststylesareignored,meaningnoimagesforbullets,squarebulletsorlistswithoutbullets. Outlook2007imposesaminimumheightof2pixelsonallcells,hencea1x1pixeltransparentGIFwitha backgroundcolorcommonlyusedforformattingorborderswillappearthickerthanexpected. Forbestresultsuseheightandwidthattributesoncells.Outlookwillnotalwayssizecellappropriatelyifnot defined. Cellpaddingisnotreliable.Outlook2007mayplaceyourpaddingOUTSIDEthecellratherthaninsidethecell. Yourbestbetistoavoidsituationwheretightspacingisrequired. Donotusethegreaterthan(>)symboltocalloutaseriesofbulletsintextversions.
LotusNotes HTMLcommentsmustopenandcloseonthesameline.Commentswithacarriagereturnwithintheopenand closingelementarenothonoredandthecommentwillberendered. Donotusenestedtables. ShorthandCSSpadding(x,x,x,x)isnothonoredinmanyclientsincludingLotusNotes. ThestyleelementandanystyleattributesarenotsupportedinLotusNotes.
TextVersion AlwaysputlinkURLsontheirownlineandnotwithintheparagraphtext. DonotuseshorthandURLreferencesleadingwithwww.Browserswillturntheseintolinksthatcanbefollowed bytherecipientandwontbetracked. Separatemajorsectionsofthetextwithvisualelementsontheirownlinesuchasaseriesof==========or tomakethedocumenteasiertoread.Around50characterswidearesufficient. Avoidforcedbreaks.Allowtexttowrapaccordingtouserresolutionandwindowsize. Afteralleditingiscomplete,turnofftextwrappingtohelpensurethateachparagraphisonitsownandfreeof breaks. Convertanysymbolstoatextequivalent:to(C)andto(R). Donotusethegreaterthan(>)tocalloutaseriesofbulletsduetoissueswithOutlookclients.
SilverpopEmailQuickList
Designmessagestousethetop24inches(400500verticalpixels)forthepreviewpane. Designemailstobenowiderthan700750pixels(thoughmostclientsdisplaymorethan800pixels).Amore conservativeapproachistolimitmessagewidthto600pixels. Limitthesubjectlineto46charactersincludingspaces. Getinthehabitoftestingsubjectlinesoften. Beginsubheads,paragraphsandbulletpointswithinformationcarryingwordsthatthereaderwillnoticewhen scanningtheleftside. Avoidwordsandphrasesthatwouldappearfinancial,realestaterelated,orsexualinnature. Avoidtheuseofallcapsinsubjectlinesorbodycopy. Viewmessageswithoutimagesandconstructyouremailtoworkwhentheyaresuppressed. Avoidusingimagesthatcontainimportantcopyforsituationswhereimagesaresuppressed. Avoidusingbackgroundimagesbecomfortablewithyourdesigniftheydonotappear. Includeavalidphysicaladdress,contactinformationandlinktoyourcompanysprivacypolicy. Includeanoptoutlinkforallcommercialmessages. Constructoverallmessagesizetobearound35Kto75K. Useatexteditortocreatetextversionsandbesuretoclearoutanyspecialcharacters. Puttextlinksontheirownline. CodewiththeHTML4.01TransitionalDocumentTypeandbesuretodeclareit. Validateyourcodebeforeyousend. Choosestandardsystemfontsinafontsizenosmallerthan2fortypicalbodycopy. AvoidDIVorSPANtagsdon'tuseEMBEDtags. DonotuseFlashcontent,JavaScriptorforms UseinlineversusembeddedCSSifyouhavetouseCSSatall.CSSusedforspaceandpositioningshouldbe keptsimplelimitedtobasicpadding,left,right,andcenter. Limitnestedtablestonomorethan3levelsdeep.However,nestedtableswon'tworkinLotusNotes. Imagesshouldbehostedandneverattached. IncludeALTtagsonallofyourimages. Useheightandwidthattributesonimagestags. Lookcloselyatyourperformanceandtestcreativeoften,onevariableatatime.

UPS Silverpop

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

UPS Silverpop

Încărcat de

Drepturi de autor:

Formate disponibile

EmailMarketingGuidelines&BestPractices

Asstatedinthedesignersection,avoidusingbackgroundimagesifpossible.Ifusingabackgroundimageisunavoidable, codeaHTMLsolidcolorasthebackgroundofthetableorcell.Thatwaywhentheimageissuppressedthereissome colorasabackdroptothemessage.

NonASCIIorSpecialCharacters Code&to&amp Codeto&copy Codeto&reg CodeTMto&trade Donotusesmartquotes(curlyquotes)orcurlyapostrophes.

S-ar putea să vă placă și