10 designlärdomar från HTML-e-postmallar som faktiskt säljer

Tidigare har vi och flera andra bloggar redogjort för någon användbar teknisk information för hur du kodar och strukturerar dina HTML-e-postmeddelanden ur utvecklarens synvinkel. Men mycket mindre diskussion har gjorts om hur man faktiskt ska genomföra designkomponenten i nyhetsbrev.

Idag tar vi en titt på några av de mest sålda e-postmallarna från Themeforest och ser om vi kan dechifiera vad deras designers gjorde rätt så att du kan härma dessa grundläggande principer i dina egna mönster.

# 1 Håll det smalt

E-postklienter varierar betydligt, inte bara med det sätt som de tolkar kod utan bara med det sätt som de visar meddelanden. Tänk på skillnaden mellan att visa ett meddelande i Apple Mail på en 20-tums skärm i motsats till Gmail på en 13-tums bildskärm.

Uppenbarligen blir bredden på din design en viktig fråga. Medan du kan översvämma bakgrunden med en färg genom ett 100% breddstabell, rekommenderar de flesta standarder att du använder en innehållsbredd på någonstans mellan 500-620 pixlar.

I den extremt populära AirMail-mallen nedan sträcker sig designen till 550 pixlar bred, men den faktiska innehållsbredden kommer in på bara 480 pixlar.

Den smala designen ser bra ut och fungerar perfekt över de flesta enheter och klienter.

# 2 Alternativ är allt

En viktig nyckel för att skapa mallar som säljer är att komma ihåg att en en storlek passar alla tillvägagångssätt inte fungerar. Kunder som köper en designmall vill inte bara ha en stark design, de vill ha värde. De ser värdet i alternativen du gör tillgängliga.

Om din mall har en layout och ett eller två färgscheman ger du inte riktigt ett stort utbud. Detta låser köparen ett ganska begränsat antal alternativ, vilket inte gör köpet ett klokt beslut på lång sikt.

Om din mall tillåter dem att välja mellan flera olika layouter och färgalternativ kan potentiella kunder uppskatta möjligheten att välja mellan så många olika nyhetsvariabler för e-post varje vecka, så att de kan byta upp saker och se vad som fungerar bäst för deras unik kundbas.

Som ett exempel på stark variation, överväga BlauMail-mallen som visas nedan. Först väljer du från ett antal olika alternativ för färg och mall (avrundade eller fyrkantiga hörn).

Därefter väljer du från en av tre unika layouter.

Detta tar dig till mallen med de alternativ du valt. För att ta hänsyn till alla variabler kommer BlauMail med 60 HTML-filer!

# 3 Skapa tydligt definierade sektioner

Företag använder HTML-e-post som en punkt för kontinuerlig kontakt med sina kunder och, oavsett om det är det bästa att göra från en strategisk synpunkt, tycker de om att lägga ganska lite innehåll i dem.

Företagen vill låta sina kunder veta om försäljning, kampanjer och uppdateringar på en mängd olika områden och måste kunna göra det i ett okladdigt utrymme. Så överväga att bryta upp det i ett antal olika sektioner istället för att skapa ett email med bara ett stort innehållsområde.

Den fräscha e-postmallen nedan tar den här idén till en extrem och separerar fysiskt de olika sektionerna på olika bakgrunder och skapar ett modulärt utseende.

Denna mall har 750 inköp hittills, och placerar den högst upp på listan på ThemeForest. Så om du ska ta lektioner från någon mall, borde det nog vara den här!

# 4 enkla säljer

Medan vissa malldesigners går ut med kreativa teman, djärva färger och fantastisk grafik kan andra sälja dubbelt så många mallar med starka layouter och enkel men attraktiv grafik.

Den mångsidiga e-postmallen nedan skulle säkert inte vinna några utmärkta designutmärkelser och ändå är det extremt populärt eftersom det är exakt vad många företag vill ha.

Designern hakar i potentiella kunder genast genom att sätta "mångsidigt? i titeln och ger gott om extras som rekommenderas i Tips # 2 ovan. Samtidigt hålls designen minimal, vilket gör mallen något som otaliga yrkesverksamma kan använda.

# 5 Skjut för en nisch

Som vi såg ovan, skapar en grundläggande layout och en generisk design en lång väg på grund av den stora publiken som den tilltalar. Att använda denna teknik kan dock göra det svårt för dig att sticka ut bland konkurrensen.

Om en allsidig strategi inte fungerar för dig, försök att rikta en betydande nisch av konsumenter som letar efter något specifikt. Som exempel är TechOffers-temat nedan tilltalande till flera olika nischer samtidigt.

Självklart finns det den tekniska komponenten, men mallen kommer också att vara attraktiv för nästan vilken som helst kund som letar efter ett e-handels tema. Slutligen har temat en semesterkomponent med det röda bandet och nyårets budskap.

Denna designer står plötsligt ut i mängden till tre unika kunder som letar efter en viss typ av mall. Strategiskt sett är detta ett utmärkt drag som betalar i försäljningen.

# 6 Gör det enkelt att märka

Kom ihåg att köpa en mall är ofta en kompromiss för många företag eftersom produkten inte byggs från grunden för att visa upp sitt varumärke.

Du kan hjälpa till med att övervinna denna hinder för inköp genom att ge potentiella köpare många platser i hela designen för att infoga deras företagsnamn, logotyp, slogan, ett personligt foto / profil etc. Den här enkla tekniken hjälper kunderna att se till att de verkligen kan göra mall sina egna behöver inte ge upp personalisering för överkomliga priser.

E-postmallen Rich Typography-e-post har lagt in ett stort logotyper i sidfoten förutom olika kontaktuppgifter och en annan logotyp i rubriken.

# 7 Curl The Corners

Så mycket som jag hatar att erbjuda råd som följer designklichéer, verkar denna populära trend vara effektiv med kunderna.Att curla upp hörnen på innehållsområdet hjälper till att skapa en papperstillverkning, som givetvis knyter till begreppet nyhetsbrev.

Notera i Elegansmallen nedan att den här tekniken inte bara används på innehållsområdets kanter utan även på bilderna i nyhetsbrevet.

I grund och botten allt som du gör här ger djupet till en platt bild och gör den mer tredimensionell. Vilka unika trick du kan använda till samma ända blir ännu bättre.

# 8 Prova en enkel, repeterande bakgrund

Allt utom ett av de exempel vi har tittat på hittills delar ett gemensamt designdrag: fast bakgrund. Enkel, solidfärg bakgrund är definitivt en design trend med HTML-e-post. Trodde att det är klokt att ladda gånger för att skära ner på bilder, verkar ingen av dessa mallar blyga om att använda bilder i något annat sammanhang.

Som den moderna företagsmallen nedan och TechOffers-mallen ovan visar, kan en enkel bakgrund verkligen hjälpa till att få e-posten till liv och få det att känna sig mer som en färdig design.

# 9 Glöm inte Social Media Integration

Många företagare kan inte börja beskriva vad Twitter är, men de är på den. Overzealous marknadsförare har övertygat företagen om att sociala medier är en guldgruva som kommer att ge enorma Internet berömmelse.

På en praktisk nivå innebär det att nästan alla som säljer en mall kommer att ha ett intresse för sociala medier och att du därför inte ska vara blyg om att arbeta på olika populära webbplatser i din design.

Företagskommunikationsmallen nedan innehåller några ganska stora sociala medierikoner i avsnittet Om längst ner på sidan.

# 10 Använd webbskärmbilder i din design

En sista trend som jag märkte i flera mest sålda mallar var tendensen att använda webbsajtbilder som ett primärt element i designen. Eftersom många företag använder e-nyhetsbrev främst som ett sätt att driva trafik till sin webbplats, är det meningsfullt att de vill ha bilder av deras webbplats i e-postmeddelandet.

Genom att integrera samplingswebbplatser i designen hjälper du potentiella köpare att se din mall uppfyller sina mål perfekt. I all ärlighet kan de använda en mall med ett bildområde för att uppnå samma mål, men det hjälper till att se idén innan du försöker det.

Kolla in Innovative - Product Tour-mallen och hur den kreativt innehåller en grundläggande Safari-webbläsarkrom med en exempelsida.

Slutsatser

Som alltid uppmuntrar jag dig att använda dessa inspirationsprover inte som något att ripoff utan bara som exempel på framgångsrik design som du kan lära av och använda för att gnista dina egna ursprungliga designidéer.

Lämna en kommentar nedan och låt oss veta vad du tycker om mallarna ovan. Också vara säker på att dela några knep eller tips som du har visat vara särskilt användbara när du skapar e-postmallar för kunder.