Problèmes courants d’affichage des e-mails avec Outlook

Créé par Sarah Ferry, Modifié le  Mer, 19 Avr., 2023 à 7:54 H par  Sarah Ferry

Bien que nos modèles soient conçus pour s'afficher correctement dans tous les clients d'e-mail, certains problèmes courants d'affichage des campagnes peuvent survenir lorsqu'un abonné consulte un e-mail HTML dans Outlook, en particulier dans les versions 2007, 2010 ou 2013. Cela s'explique par le fait que ces trois versions d'Outlook utilisent Microsoft Word pour rendre les e-mails qui offrent un aide HTML et CSS limité.

Cet article traite des problèmes d'affichage courants rencontrés par les utilisateurs d'Outlook et de nos recommandations pour résoudre ces problèmes.

Les marges ne s'affichent pas

Toutes les versions d’Outlook (à l’exception de Outlook.com) et de Gmail ne prennent pas en charge les marges. Nous vous recommandons plutôt d'utiliser le bloc de contenu d'espacement :

Spacer_widget_in_the_éditeur d'e-mail.png

Vous pouvez également essayer le marge intérieure pour créer de l'espace autour de vos blocs de contenu.

Le marge intérieure est pris en charge dans toutes les versions d’Outlook et d’autres fournisseurs de services d'e-mail populaires. Vous pouvez ajouter du marge intérieure à un bloc de contenu en sélectionnant le conteneur ou la structure dans l'éditeur d'e-mail et en ajustant le marge intérieure dans le menu de droite. Cependant, le marge intérieure peut donner l'impression que votre contenu est étroit lorsqu'il est consulté sur un appareil mobile.

In_the_éditeur d'e-mail_click_into_the_container_or_structure_and_adjust_the_marge intérieure_with_the_options_in_the_menu_on_the_right.png

La hauteur des lignes n'est pas prise en charge de manière cohérente

Outlook 2007, 2010, 2013 et Office 365 ne prennent pas systématiquement en charge la hauteur de ligne. Certaines versions d'Outlook prennent en charge la valeur en pourcentage de la hauteur de ligne (par exemple, 140 %), tandis que d'autres prennent en charge un nombre entier (par exemple, 4). Nous vous recommandons de fournir les deux valeurs si vous créez un e-mail à partir de zéro et que vous écrivez votre propre CSS. Si vous utilisez l'éditeur d'e-mail par glisser-déposer, ce paramètre est automatiquement défini pour vous.

Les images apparaissent déformées

Outlook ne réduira pas les images d'une largeur de 1000 pixels ou plus. Au lieu de cela, l'image sera affichée à sa taille réelle, ce qui aura pour effet d'élargir et de déformer la largeur de votre modèle. Nous vous recommandons d'utiliser des images dont la largeur est comprise entre 400 et 650 pixels.

Notez que dans le concepteur, les images sont automatiquement réduites à 1300 pixels de large. Cela représente au maximum le double de la largeur de l'e-mail, qui est de 650 pixels.

En savoir plus sur l'ajout d'images à vos campagnes

Les GIFs apparaissent comme des images plates

Les GIF animés sont pris en charge dans le client de bureau Outlook 365, les applications mobiles Outlook et Outlook.com.

Outlook 2007, 2010 et 2013 n'affiche pas les animations. Au lieu de cela, ils n’afficheront que la première image. Si votre GIF comporte une offre, un titre ou un appel à l'action, assurez-vous qu'il est inclus dans ce cadre. Pour obtenir des instructions sur l’ajout d’un GIF à votre e-mail, cliquez ici .

Boutons dupliqués

Les services d'e-mail comme Gmail, Apple Mail et Yahoo rendent le style des boutons à l'aide de CSS et HTML standard. Comme Outlook ne le fait pas, nous avons fourni un correctif afin qu’Outlook affiche correctement le rayon de bordure, le marge intérieure et les bordures autour du bouton.

Toutefois, lorsqu'un e-mail est transféré par un abonné qui clique sur le bouton de transfert de son fournisseur de services d'e-mail, ou si le e-mail est réacheminé par un serveur Windows ou Exchange, cette correction sera lue comme un élément HTML valide, ce qui entraînera un bouton en double.

Malheureusement, il n'existe pas de solution pour éviter que cela ne se produise. Pour contourner ce problème, vous pouvez créer une image d'un bouton et la télécharger dans votre e-mail comme n'importe quelle autre image. Vous pouvez ensuite ajouter votre lien afin que les contacts qui cliquent sur cette image soient redirigés vers votre URL préférée.

éditeur d'e-mail : Boutons dans Outlook

dans l'éditeur d'e-mail (lancement en 2022), Une option de formatage supplémentaire, le bouton "aide d'Outlook", vous permet d'améliorer l'affichage des boutons dans Outlook, en insérant un élément de code VML spécial. Le bouton "aide of Outlook" sera activé par défaut.

Le bouton

éditeur d'e-mail et HTML : L'image de fond ne s'affiche pas

Les images d'arrière-plan qui ne s'affichent pas sont un problème commun à de nombreux fournisseurs d'e-mail. Nous vous recommandons de fournir une couleur de repli au cas où votre e-mail serait affiché sur une version d'Outlook qui ne prend pas en charge les images de fond.

Ceci s'applique si vous créez un e-mail avec votre HTML et l'éditeur d'e-mail (lancé en 2022). Notez que lorsque vous utilisez l'éditeur d'e-mail (lancé en 2022), vous pouvez ajouter une image d'arrière-plan dans l'onglet "Global paramètres" "General paramètres" en plus d'une couleur d'arrière-plan de repli :

Pour configurer une couleur de fond dans le éditeur d'e-mail, allez à l'onglet paramètres généraux, puis paramètres généraux et choisissez une couleur de fond

l'éditeur classique ne prend pas en charge les images d'arrière-plan.

éditeur classique : Alignement du texte

Outlook ne prend pas en charge l'alignement du texte "Justifier".

Malheureusement, il n'existe pas de solution pour forcer Outlook à prendre en charge l'alignement du texte justifié.

Notez que l'éditeur d'e-mail (lancé en 2022) ne dispose pas de l'option de justification et ne pose donc pas de problème lorsqu'il est envoyé à Outlook

éditeur classique : Texte brisé dans les boutons

Les boutons avec du texte cassé ou du texte qui se brise dans une deuxième ligne sont dus à un problème de rendu Outlook. Pour éviter ce problème, vous pouvez augmenter le marge intérieure de votre bouton pour qu’il soit supérieur à la taille de la police. Si le problème persiste, nous vous recommandons de créer une image de votre bouton et de l'utiliser à la place (voir "Boutons dupliqués" ci-dessus).

éditeur classique : Les boutons affichent une police incorrecte

Outlook peut afficher le type de police incorrect et revenir à Times New Roman. Ceci est dû à un espace ajouté au début et/ou à la fin du texte du bouton. Pour éviter ce problème, nous vous recommandons de supprimer cet espacement. Si cela ne fonctionne pas, vous pouvez créer un nouveau bouton ou créer une image d’un bouton à utiliser dans votre campagne à la place.

éditeur classique : Les liens ne sont pas cliquables

En ce qui concerne l'alignement des images, seules certaines versions d'Outlook rendent les images de la même manière. Si vous avez une image dans un bloc de texte avec des liens dans la même ligne que votre image, ces liens ne seront pas cliquables dans Outlook 2007 et 2013.

Notez que vous ne pouvez pas ajouter d'images aux zones de texte dans l'éditeur d'e-mail (lancé en 2022) et donc noter un problème lors de l'envoi vers Outlook.

Par exemple, le texte hyperlié ci-dessous ne sera pas cliquable pour les abonnés qui utilisent l'une ou l'autre version d'Outlook 


exemple_lien.png

Pour éviter cela, avec l'éditeur classique, nous vous recommandons de supprimer l'image de votre bloc de texte et d'utiliser un bloc d'image à la place.

                    

Cet article a-t-il été utile ?

C'est super !

Merci pour votre commentaire

Désolé ! Nous n'avons pas pu vous être utile

Merci pour votre commentaire

Dites-nous comment nous pouvons améliorer cet article !

Sélectionner au moins l'une des raisons

Commentaires envoyés

Nous apprécions vos efforts et nous allons corriger l'article