Rechercher
Generic filters

Le Blog Chapsvision

Emailing et responsive design : les bonnes pratiques

Le responsive design désigne la faculté d’un site web ou d’un emailing à s’adapter au terminal de lecture mobile, qu’il s’agisse d’une tablette, d’un smartphone… Découvrez ci-dessous les conseils de notre Studio Graphique pour optimiser l’affichage de vos campagnes email sur l’ensemble des supports mobile grâce au responsive design.

En ce qui concerne l’email, le comportement des utilisateurs a grandement évolué ces dernières années avec l’émergence des smartphones et tablettes.

Si auparavant il s’écoulait plusieurs jours avant que l’intégralité des cibles ne lise la campagne email envoyée, il ne faut aujourd’hui que quelques heures pour que la quasi-totalité des destinataires réagissent à une communication email (sous réserve d’une délivrabilité efficace). Les supports mobiles proposant presque autant de résolutions d’affichage différents que de terminaux existants, il est primordial d’optimiser le rendu de sa campagne email dès sa conception, en pensant responsive design.

Anticiper

Pour optimiser l’affichage de sa campagne sur tous les écrans, il est nécessaire d’anticiper la lecture du message à la fois sur un axe horizontal (écran d’ordinateur) et vertical (écran de smartphone). Pour cela, il existe des moyens techniques tels que les codes (CSS, media queries…) qui permettront de détecter sur quel support la personne se trouve et d’adapter ainsi automatiquement l’affichage de l’email au support utilisé.

La règle d’or : penser simple et efficace. Dès le départ, tous les éléments doivent pouvoir s’afficher aussi bien en mode horizontal ou vertical, c’est-à-dire l’un à côté de l’autre sur un ordinateur et passer l’un en-dessous de l’autre sur un mobile. Cette construction est valable à la fois pour votre contenu éditorial et les parties visuelles de votre email. Découvrez plus de conseils sur cette partie dans notre article « Best practices graphiques pour des emails design et impactants » .

Des compétences techniques

Une multitude de supports de lecture différents est utilisée aujourd’hui : PC, tablette, smartphone, TV connectée… Il faut bien comprendre que chacun d’entre eux a des spécificités d’interprétation différentes du code. En effet, chaque support possédant son propre moteur d’interprétation, le code ne sera pas toujours lu et compris de la même manière.

Dans une volonté d’obtenir un affichage correct sur l’ensemble des supports, il est nécessaire de bien prendre en compte ces contraintes techniques et donc de simplifier le contenu afin d’éviter les erreurs d’interprétation. Par exemple, pour une adresse Gmail, l’application officielle Gmail de Google et l’application Email d’Android n’afficheront pas de manière identique le même email.

Il est donc très important de trouver le bon compromis entre esthétisme et techniques de codage, ce qui nécessite certaines compétences. C’est par exemple l’une des expertises de NP6, qui aide ses clients à utiliser le responsive design pour optimiser l’affichage de leurs campagnes email sur l’ensemble des supports et les conseille sur la création graphique de ces derniers.

Enfin, il est également important de suivre de près l’évolution des règles des fournisseurs de messagerie comme Yahoo, Orange, Google, Microsoft… car ces dernier modifient leurs outils de manière permanente, et font donc évoluer sans cesse les interprétations des codes.

Penser votre interaction dans son ensemble

Définissez clairement pour vos campagnes emails des objectifs adaptés au mobile. Plus votre objectif sera précis, plus la mesure chiffrée sera aisée. Par exemple : améliorer le taux de conversion ou mettre en cohérence tous les supports de communication (site web, email…) de votre marque.

Enfin, pour prévenir tout phénomène d’attrition, n’oubliez pas de concevoir des pages d’atterrissage (ou landing pages) optimisées pour le support mobile. Face à des mobinautes dont l’attention s’essouffle rapidement, l’expérience utilisateur doit être la plus fluide et cohérente possible.