Download - Comment designer un emailing responsive ?

Module 3 : Comment designer un email responsive ?

#EmailingSummErCamp

Emailing Summer Camp 2014 - Comment designer un email responsive ? - p.2/22

1 - Le design : un double objectif à atteindre

2 - Les règles à respecter en construisant son design

3 - Quid de l’originalité ?

4 - Designer pour mieux coder

Sommaire

lE dESign : un doublE objECtif à attEindrE


Le design : un double objectif à atteindre

1er objectif marketing : Convertir !


2ème objectif technique : Un message qui s’affiche correctement en boîtes de réception

Pour cela vous devez :

• Construire un design permettant d’optimiser son code

• Penser responsive

• Tester, tester, tester

lES règlES à rESpECtEr En ConStruiSant Son dESign


Les règles à respecter en construisant son design

Dès que l’on construit un design pour un emailing, il faut penser :

• Codage

• Passage des filtres anti-SPAM

• Affichage en boîte de réception

Idéalement, ce sera la même personne qui designera et codera l’emailing



Pour plus de facilité, raisonnez en blocs :

Header

Footer

Message principal

Call to action

Message Image


Spécifications techniques :

• 600 pixels de large

• Pas de hauteur limite mais éviter trop de scroll

• Pas d’image de fond

• Pas de couleur de fond foncée avec une police claire

• Texte en 13 pixels minimum

• 2 colonnes maximum

• Pas de texte en rouge ou vert vif

Afin de passer plus facilement les filtres anti-SPAM, respectez un ratio de

50% de texte / 50% d’images



Attention : les clients email bloquent vos images !




Un emailing 100% image n’est donc pas recommandé !


Placez toujours votre message texte dans les 310 premiers pixels de haut de l’emailing


Quid dE l’originalité ?


Soyez original... mais pas trop !

• Webfonts : ne sont pas interprétées par tous les clients email

• Gif animés : ne sont pas interprétés par tous les clients email

• Animations flash à proscire : mise en SPAM

• Pas de vidéos se jouant dans l’email : mise en SPAM

Préférez les liens renvoyant sur votre

site internet

Quid de l’originalité ?


Soyez originaux dans votre présentation / vos call to action

Exemples de call to action :

• “Je fonce”

• “Je m’inscris”

• “J’y vais”

• “Je craque”

Quid de l’originalité ?

Attention aux mots SPAM !!Mettez vos call to action type “Cliquez ici” au

format image

dESignEr pour miEux CodEr


Si votre design est bien construit, il atteindra 3 objectifs :

• Permettra un codage optimisé

• Aidera à passer les filtres anti-SPAM

• Convaincra vos prospects !

Designer pour mieux coder

proChain modulE :CommEnt CodEr un Email rESponSivE ?

mardi 29 juillEt 11h

@43dEgrES #EmailingSummErCamp

Merci !