Comprendre les polices dans les e-mails

Objectif de cet article

Découvrez les possibilités et les limites de l’utilisation des polices de caractères en ligne et apprenez à envoyer des e-mails qui correspondent à votre marque.

Comment les polices fonctionnent

Les polices sont des représentations de texte, et peuvent être utilisées dans des médias imprimés ou en ligne. Vous connaissez peut-être certaines des polices les plus courantes, comme Arial ou Times New Roman, mais il existe des milliers d’autres polices que vous pouvez utiliser pour communiquer et représenter votre marque.

Avec les médias en ligne (comme les sites web ou les e-mails), vos options de polices de caractères sont presque illimitées. Cependant, lorsque vous partagez votre création avec quelqu’un d’autre, il se peut qu’elle ne soit pas exactement identique, car tous les appareils n’ont pas accès aux mêmes polices.

Il existe 2 principales façons dont un appareil peut accéder à une police et l’utiliser : les polices système (c’est-à-dire les polices stockées sur l’appareil que vous utilisez) et les polices web (c’est-à-dire les polices chargées depuis un serveur externe)

À propos des polices système

Les ordinateurs et les téléphones sont préchargés avec une variété de polices. Il existe des polices couramment installées (la plupart des appareils incluent Georgia et Verdana, par exemple), mais les appareils peuvent varier considérablement quant à ce qu’ils incluent par défaut. Les polices utilisées par la plupart des appareils sont appelées polices « web-safe ».

À propos des polices web

Contrairement aux polices web sécurisées, les polices web sont chargées depuis un serveur externe en même temps que le contenu que vous consultez. Les polices personnalisées sont généralement des polices Web. Si vous utilisez une police web, vous devrez également définir une police web sécurisée de remplacement, au cas où un appareil particulier ne parviendrait pas à charger votre police web.

À propos des polices par défaut

Lorsque vous consultez quoi que ce soit en ligne, qu’il s’agisse d’une page web ou d’un e-mail, du CSS (code utilisé pour mettre en forme le contenu en ligne) fonctionne en arrière-plan et indique à votre appareil quelle police afficher. Si votre appareil ne peut pas accéder à la police, il vérifiera dans le CSS s’il existe une « police de secours » (une police, ou des polices, sélectionnée(s) par la personne qui a créé le site web ou le message e-mail, à utiliser si la police préférée n’était pas disponible). Les polices de secours doivent être des polices compatibles web que la plupart des appareils peuvent utiliser. Elles vous donnent davantage de contrôle sur l’apparence de votre message lorsque quelqu’un l’affiche sur un appareil qui ne prend pas en charge les polices personnalisées/web.

S’il n’y a aucune police de secours disponible, ou si la police de secours n’est pas prise en charge par l’appareil utilisé, l’appareil utilisera alors une police par défaut, comme Arial ou Times New Roman. Les polices par défaut varient considérablement d’un appareil et d’une application à l’autre.

Fonctionnement des polices dans les e-mails

Certains clients de messagerie prennent en charge les polices web, mais d’autres non. Lorsqu’une personne ouvre votre e-mail dans une boîte de réception ou sur un appareil qui ne prend pas en charge les polices web, elle verra une police par défaut utilisée à la place. Vous pouvez contrôler quelles polices système sont utilisées comme polices de secours en définissant une police de remplacement.

Si quelqu’un ouvre votre e-mail sur un appareil qui prend en charge les polices web, il chargera la police depuis l’URL fournie dans le CSS de votre e-mail. Si l’appareil peut accéder à la police, il l’affichera ; sinon, il passera aux polices de remplacement.

La prise en charge des polices web dépend de l’application e-mail, de sa version, et du type de compte e-mail. Voici des exemples de clients compatibles avec les polices web :

• Apple Mail
• iOS Mail (le client de messagerie par défaut sous iOS)
• Certaines applications d’e-mail Android (la prise en charge varie selon l’application ; Android 2.3 ne prend pas en charge la méthode @import utilisée par les polices Google et Adobe)
• Samsung E-mail sur Android, sauf lorsque vous utilisez une adresse e-mail Microsoft, comme Outlook.com ou Hotmail
• Outlook pour Mac 2011 et 2016 ; Outlook pour Mac 16.80 ne prend pas en charge les polices web

Gmail, y compris l’application Gmail sur Android, ne prend généralement pas en charge les polices web. Le webmail de bureau de Gmail peut afficher Roboto et Google Sans, car Gmail les inclut dans ses propres styles. Cela ne signifie pas que Gmail peut charger d’autres polices personnalisées depuis votre e-mail. Définissez une police de secours et testez votre e-mail dans les applications Gmail que vos destinataires utilisent.

Pour obtenir des détails par application e-mail et version, consultez le tableau de prise en charge des polices web de Can I email.

Optimisation des polices dans vos e-mails

La meilleure façon de vous assurer que votre e-mail s’affiche de manière cohérente sur tous les appareils est d’utiliser une police web sûre. Les polices par défaut de Klaviyo sont généralement des polices web sûres. Trouvez les polices fournies par Klaviyo dans :

• Contenu > Médias et marque > Marque: sélectionnez Polices. Si vous voyez Style à la place, sélectionnez-le pour trouver la section Polices.
• Le panneau Modifier les styles dans l’éditeur de modèles d’e-mails
• La barre d’outils de mise en forme du texte lorsque vous modifiez du texte dans un bloc de texte, ou les commandes de police dans d’autres blocs contenant du texte
• Le panneau Modifier les styles dans l’éditeur de formulaire d’inscription

Conseils pour utiliser des polices personnalisées

Si vous préférez utiliser une police personnalisée, utilisez les conseils ci-dessous pour vous assurer que vos e-mails ont une apparence soignée sur tous les appareils.

Utiliser des polices par défaut

Sélectionnez une police de remplacement web-safe qui correspond le plus possible à votre police personnalisée. Vous pouvez sélectionner une police de remplacement parmi les polices par défaut de Klaviyo lors de la configuration de la police personnalisée.

Utilisez du texte dans les images

Bien qu’un e-mail entièrement composé d’images puisse nuire à votre délivrabilité, vous pouvez utiliser stratégiquement une combinaison de texte dans les images et de texte dans des blocs de texte afin de créer un e-mail qui s’aligne sur votre marque. Choisissez une police personnalisée et adaptée à votre marque pour vos en-têtes et vos appels à l’action (CTA), et associez-la à une police compatible avec le web pour votre corps de texte. Conservez aussi les informations essentielles et le CTA principal dans des blocs de texte ou de bouton, afin que les destinataires puissent les utiliser même si les images ne se chargent pas.

Utilisez des images contenant votre police de marque pour certains textes, et veillez à ajouter un texte alternatif lorsque vous ajoutez les images à votre e-mail. Ensuite, appliquez la police compatible avec le web au reste du texte de votre e-mail. Cela vous permet d’utiliser votre police de marque tout en conservant le reste de votre e-mail lisible lorsque les images ne se chargent pas.

Testez minutieusement

Quelle que soit la méthode choisie, testez minutieusement vos e-mails, en particulier lorsque vous utilisez un nouveau design. Envoyez-vous l’e-mail sur plusieurs appareils afin de vous assurer que sa présentation vous convient sur chacun d’eux. Vous pouvez également utiliser des programmes de test d’e-mails comme Litmus ou Email on Acid pour tester sur une gamme plus large d’appareils.

Ressources supplémentaires