Aller au contenu principal

Support du CSS dans les emails Un des gros soucis de rendu d'un email HTML envoyé à différents services de webmail (Hotmail, Gmail, Yahoo Mail, etc.) ou vers des softs de messagerie électronique (Apple Mail, Outlook, Eudora, etc.) consiste en le support partiel, voire l'absence totalement de support, du CSS, qu'il soit décrit dans une feuille de style externe ou bien intégré directement dans la balise HEAD du document. Le guide to CSS support in Email, de Campaign Monitor (déjà mentionné ici), retrace toutes les balises acceptées ou refusées par tous les grands services ou logiciels d'emails.

Pour pallier à ce problème, la seule solution consiste à mettre tous les attributs de mise en forme directement dans la balise concernée (méthode du CSS inline) . Par exemple, un paragraphe à styler en gras et en vert, au lieu d'être habituellement parée d'un attribut class suffisant :

(p class=grasvert)Le phrasé de ma grand mère est une tuerie.(/p)

Devient ceci :

(p style=color:green;font-weight:bold)Le phrasé de ma grand mère est une tuerie.(/p)

Je vous laisse imaginer le côté "pratique" d'un e-mailing complet à styler tout à la main, et surtout à maintenir (surtout quand le client demande d'inverser les couleurs au denrier moment). Du pur bonheur, et un retour aux années Dreamweaver...

Jusque là, nous en étions arrivés au point de créer un script PHP qui moulinait la page HTML avec son CSS "classique" en feuille externe, mais pour cela fallait-il encore avoir la connaissance et l'infrastructure pour le faire.

Et voici que sort premailer, qui vous le fait en deux temps et en mode Web. Pratique !