Intégrer et gérer les polices spéciales

Avec l’Email Builder, vous avez la possibilité de paramétrer des polices spéciales et des Google Fonts afin de personnaliser vos textes au plus proche de votre charte graphique.

Compatibilité

Vous trouverez ci-dessous le tableau des compatibilités des webmails et clients mails avec les polices spéciales. En l’absence de comptabilité, une police système de substitution type  (Arial, Time New Roman, Helvetica etc..) prend le relai afin que le contenu soit toujours restitué.

Cette police de substitution est personnalisable.

Héberger des polices spéciale

Retrouvez ci-dessous les différentes étapes nécessaires à l’hébergement de votre police spéciale.

1. Convertissez la police au format .WOFF

Le plus souvent, vous utilisez des fichiers de polices aux formats .TTF, .OTF ou .EOT. Toutefois, pour maximiser l’affichage au sein d’un email, il faut héberger la police sous un format Web Open Font Format (WOFF). Pour cela, vous pouvez convertir vos fichiers de polices à l’aide d’un convertisseur en ligne comme Online Font Converter.

2. Hébergez la police sur un serveur

Pour héberger votre police, déposez le fichier .WOFF sur l’un de vos serveurs, via un logiciel FTP par exemple.
Le dossier doit être accessible publiquement via le protocole HTTPS pour que les polices s’affichent correctement (exemple d’URL : https://www.monsite.ex/medias/ma-typo.woff).

3. Paramétrez l’accès aux polices

Afin que votre police puisse être affichée au sein des différents clients mails compatibles, voici les caractéristiques techniques complémentaires à respecter :

  • Le CORS (Cross Origin Ressources Sharing) doit être activé sur le serveur via l’ajout d’un entête HTTP. Le CORS est un mécanisme standardisé qui permet aux différents webmails et clients mails de télécharger la police et de la rendre visible lors de la consultation des emails dans une messagerie. Pour plus d’informations vous pouvez consulter https://enable-cors.org/server.html.
  • Le Content-Type est déclaré sur le serveur via l’ajout d’un entête HTTP et doit être égale à “font/woff”.

Ajouter une police spéciale ou utiliser Google Fonts

Ajouter une police spéciale

Pour ajouter une police spéciale, vous devez vérifier au préalable que celle-ci est correctement hébergée.

Une fois hébergée, rendez-vous dans l’onglet “Paramètres” du volet de conception depuis le Designer puis dans la catégorie “Polices spéciales”.


En cliquant sur le bouton “Ajouter une police”, deux onglets apparaissent : Police spéciale et Google Fonts.

Choisissez alors l’onglet Police spéciale. Vous devrez alors saisir les informations suivantes :

  • Le nom de votre police
  • Son URL d’hébergement

Pour les environnements non compatibles avec la police spéciale, c’est la police de substitution qui sera affichée avec la possibilité de définir :

  • Son épaisseur
  • Sa typographie parmi une liste déroulante


Vous devez valider la police de substitution pour confirmer le paramétrage de la police spéciale sans quoi celui-ci ne sera pas pris en compte.

Une fois la police spéciale paramétrée, celle-ci apparaît dans la liste des polices inutilisées.

Pour l’utiliser dans l’email, il faut sélectionner un élément Texte. Ensuite, cliquez dans l’onglet “Styles”  du volet de conception, puis dans la catégorie “Polices” pour faire apparaître la liste déroulante “Collection de famille d’écriture”. Il ne vous reste plus qu’à choisir la famille de Polices à utiliser.

Info

Une fois sélectionnée, la police change de liste et s’affiche alors parmi les polices utilisées, visibles dans l’onglet “Paramètres” et dans la rubrique “Polices spéciales”.

Utiliser Google Fonts

L’Email Builder vous met à disposition l'API de Google pour vous aider à faire un choix parmi ses 1500+ polices spéciales, et déjà hébergées par Google.

Dans l'onglet “Paramètres” du volet de conception depuis le Designer, cliquez sur “Polices spéciales”puis sur le bouton “Ajouter une police”? Choisissez l’onglet Google Fonts

Vous devrez alors définir les champs suivants :

  • La famille de polices
  • La variante
  • La police de substitution

Pensez-bien à cliquer sur le bouton “Valider” pour que le paramétrage de la police soit bien pris en compte.



Google Fonts et RGPD

Attention

Dans le respect des réglementations européennes sur la protection des données (RGPD), nous tenons à informer nos utilisateurs que l’utilisation de Google Fonts sur vos emails pourrait ne pas être la meilleure option. En effet, les pratiques de collecte de données de Google ne sont pas totalement transparentes ni entièrement sous notre contrôle. Pour cette raison, nous recommandons d'explorer des alternatives respectueuses de la vie privée qui assurent une meilleure conformité au RGPD.

Cela fait partie de notre engagement à soutenir des pratiques sécurisées et responsables en matière de données.

Polices spéciales et modules

Les polices spéciales utilisées dans un module vont également s’appliquer sur l’email au moment de l’import de celui-ci.

Ainsi, pour gagner du temps en conception, nous vous recommandons d’ajouter les polices spéciales dans les modules récurrents de vos emails (par exemple le module header et le module footer).
Ces polices spéciales seront alors visibles dans le Designer, dans l’onglet “Paramètres” de l’email.

Polices inutilisées

Avant d’exporter votre email, nous vous conseillons de supprimer les polices inutilisées.

En effet, même si elles ne sont pas appliquées sur des textes, elles sont déclarées dans le code HTML de l’email. Les appels des environnements webmails vont alors la télécharger bien qu’elle ne soit pas utile. Cela contribue à alourdir le code inutilement et peut être à l’origine d’impacts sur l’affichage.

Que faire si la police ne s’affiche pas ?

Après application de la police spéciale sur vos textes, si celle-ci ne s’affiche pas dans le Designer, il se peut que l’hébergement de celle-ci comporte des erreurs. L’Email Builder remonte au niveau du Contrôle Qualité les informations manquantes suivantes :

  • L’absence du CORS (Cross Origin Ressources Sharing)
  • La valeur du Content-type est incorrecte
  • le fichier WOFF n’est pas accessible en HTTPS

Dans les 3 cas cités, il est important de revenir sur l’hébergement de la police et de modifier les informations manquantes ou erronées.