L’utilisation des paragraphes dans l’intégration de l’emailing

e-mailing

Les paragraphes (<p>) peuvent vous semblez être des balises HTML les plus simples, mais vous seriez surpris de voir qu’il va nous compliquer la vie sur certains webmail .

On notera particulièrement Outlook.com et Yahoo!mail car Outlook.com applique un line-height de 131% sur chaque paragraphe et aussi une marge de 1.35em.

Yahoo! Mail par contre supprimera toutes les marges de toutes les cotés qui va donner une mise en forme qui va tasser l’ensemble.

Jetez un œil ci-dessous la façon dont Outlook.com et Yahoo! Mail va afficher vos paragraphes.

outlook_paragraphs yahoo_paragraphs

Solution

Heureusement pour nous, la solution est simple.
Pour corriger le bug, on va réinitialiser l’espacement sur chaque paragraphe et puis ajouter des styles directement sur chaque bloc suivant nos besoins.

Autres techniques

Une autre technique largement utilisé pour mettre en place l’espacement entre les paragraphe sera l’utilisation des sauts de ligne ( de type <br> ) après chaque paragraphe de texte.

Ces balises normalement devront donner un bon résultat sur tous les clients webmail malgré le fait que gérer la taille exacte peut être un peu délicat, mais sur ce point là, à vous de voir.

Répondre