1485 sujets

Web Mobile et responsive web design

Papier à lettre et 'Responsive Design'

Bonjour,

Je ne devrais surement pas mais j'essaye de créer un papier à lettre qui s'adapte sur mobile. Smiley eek

Le template que j'ai créé s'adapte parfaitement sur les petits écrans si j'utilise un service d'envoi de newsletter. Par contre quand j'utilise le même template en mode papier à lettre via Outlook 2003 et 2010, toute la CSS servant au style mobile est jetée. (<style> CSS inclue dans le <head>)

"Logique" me direz-vous ! Smiley rolleyes A ce jour, y a-t-il une solution pour envoyer un papier à lettre qui s'adapte à l'écran ?

Merci
Modifié par gandoulfee (16 Jan 2013 - 16:38)
Hello,

Va falloir préciser un peu ton sujet. Smiley smile

Je suis né au 20e siècle et dans ma tête un papier à lettre c'est d'abord du papier, le truc qu'on peut toucher avec des fibres dedans. Le papier c'est pas très responsive, à la rigueur ça se roule en boule (@media trash and (max-width:24cm) {/* grosse boule de papier */}). Smiley cligne

Le terme «papier à lettre», c'est le vocabulaire utilisé par Outlook pour des gabarits d'emails au format HTML-CSS? Tu utilises Outlook (2003 et 2010 donc) pour envoyer des newsletters ou des emails mis en forme?

Dans tous les cas, il y a deux aspects à prendre en compte:

1. La capacité des outils d'envoi d'email (Outlook par exemple, mais pour de l'envoi de newsletters on passera plutôt par une solution dédiée un peu plus professionnelle, telle que Mailchimp ou Campaign Monitor -- je cite ces deux-là pour situer un peu, c'est pas nécessairement une recommandation). Chaque outil va avoir ses capacités propres, les «meilleurs» permettant d'envoyer soit exactement ce que tu veux (mode expert) ou d'envoyer uniquement du code qui a des chances d'être compris dans les clients mail.
2. La capacité des clients mail (les logiciels qui réceptionnent, affichent mais aussi souvent moulinent et retraitent les emails reçus) à afficher du code «responsive», et si oui quel code avec quelles contraintes.

Pour être un peu logique il faut commencer par le deuxième aspect (qui du coup est le premier, enfin je me comprends): est-ce que ça marche en lecture (avant de se poser la question de l'envoi)? Et là, j'ai pas bossé spécifiquement le sujet mais j'ai bien peur que ça ne passe que dans trois-quatre clients mail qui embarquent un moteur de rendu Gecko ou Webkit non bridé — donc probablement pas dans Outlook (toutes versions confondues, sauf changement vraiment récent), et probablement pas dans les clients webmail qui pour la plupart vont virer une partie du code CSS contenu dans les messages (pour des raisons de sécurité le plus souvent).
Merci pour cette réponse Florent,

Je ne connaissais pas le nom de "papier à lettre" avant d'être sur ce projet. On fait avec.

Je viens de faire plusieurs tests et voici ma conclusion :

Sur Outlook (2003 et 2010) : L'utilisation de "papier à lettre" est très limité. Outlook réécrit le code envoyé et y injecte énormément de balise etc... Le CSS écrit entre les balises <styles> de mon template est pas du tout interprété. Bref sur outlook : NO WAY

En revanche sur ThunderBird c'est une autre histoire !
On utilise plus le terme "papier à lettre" mais on injecte du code html dans le mail en cours d'écriture. L'inconvénient est que les images doivent être placées sur un serveur et appelées en absolue. Par contre le gros avantage est que le code est peu altéré ! mes styles utilisés pour l'adaptabilité sont toujours présent et pour le moment ça fonctionne pas mal.

Il faut que je continue mes tests dans ce sens mais j'ai l'impression que ça peut être possible.
Bonjour,

Concernant les css / adaptation au mobile, le site de campaign monitor est la bible absolue en la matière ( tableau de compatibilité css et html avec les principaux clients mails, liste de bonnes pratiques, et même templates de base ) et ils mettent à disposition des guides complets, notamment un guide du responsive emailing.

Ça fait un peu publicité désolé, mais leur documentation est vraiment ultra-complète et m'a souvent sauvé la mise !

Par contre, en question subsidiaire : concernant l'envoi, pourquoi ne pas utiliser une solution dédiée ( mailchimp, edatis, etc...) ? À moins d'avoir mal compris le sujet ( "papier à lettres" est effectivement dissonant ), c'est la méthode la plus efficace pour envoyer du html vers des clients mails.

Bon courage en tout cas, ça n'est pas une mince affaire !
a écrit :
concernant l'envoi, pourquoi ne pas utiliser une solution dédiée ( mailchimp, edatis, etc...) ?


Le "papier à lettre" ainsi nommé par Outlook est différent d'une newsletter. C'est un "template" ou "modèle" de mail que tu peux envoyer comme un e-mail normal. L'utilisation n'est donc pas la même. C'est un besoin qu'a exprimé un client. C'était très flou pour moi au début également.

Merci pour la 'pub' du site de campaign monitor, je vais aller fouiner pour voir ce qui s'y trouve.
Sujet clos
Aller à