Expert | Assistants vocaux & Lecteurs d’écrans : 8 étapes pour construire un email adapté

Publié par Fanny Duflot dans Conception & Design Email 19 novembre 2019 Temps de lecture : 5 min

Intelligences artificielles développées par les géants américains d’Internet, les assistants vocaux et les lecteurs d’écrans sont arrivés sur le marché pour conquérir aujourd’hui de plus en plus de foyers.

« Que ce soit depuis un smartphone, un ordinateur, une tablette, une enceinte connectée ou une TV connectée, 46% des internautes français ont déjà utilisé un assistant vocal*. »

Alexa d’Amazon, Siri d’Apple ou encore Google Assistant, sont des applications logicielles basées sur la reconnaissance vocale du langage et la restitution d’informations par synthèse vocale. En somme, l’assistant vocal permet à l’utilisateur d’obtenir des réponses à des requêtes énoncées oralement et de commander certaines fonctions du terminal sur lequel il est installé notamment la lecture d’email. Mais cette évolution doit-elle pour autant vous faire revoir la construction de votre email ?

Une réelle innovation encore en quête d’ajustement !

Ils répondent aux instructions vocales, ils délivrent une expérience d’exception… Les assistants vocaux séduisent. Mais pourquoi en acquérir ? Car avant d’adapter votre email, encore faut-il comprendre quels sont les avantages et les limites de cette nouvelle pratique.

Des avantages…

  • Un réel assistant personnel (1 personne sur 3 se dit excitée par un futur où les assistants vocaux pourront anticiper leurs besoins, agir par eux-mêmes ou faire des suggestions*).
  • Plus d’efficacité, moins d’effort (le cerveau est 2x moins sollicité par la voix).
  • Un excellent moyen pour répondre à l’accessibilité et aux évolutions de la société (80% des utilisateurs d’assistants vocaux sont satisfaits*).
  • Un nouveau moyen de favoriser l’interaction humaine (pour 43% des utilisateurs de smartphone, la reconnaissance vocale va les libérer de la dépendance au mobile et leur permettre d’interagir davantage avec le monde qui les entoure*).

Et des limites !

  • Des fonctions limitées (lire, répondre, supprimer, archiver, passer au message suivant).
  • Spam ou messages légitimes ? Il n’y a pas de différenciation.
  • Les destinataires ne peuvent pas faire d’opération complexe (s’abonner, se désabonner, suivre des liens de réseaux sociaux…).
  • Aucune remontée statistique (l’assistant vocal ne charge pas le pixel de tracking et ne peut donc pas comptabiliser l’ouverture).
  • Des débats autour de la confidentialité et donc de la confiance.

Convaincu ? Il est désormais temps de passer à la technique !

8 étapes pour envoyer un email vocal

1. Optez pour un nom fiable et un objet engageant

Offrez la meilleure expérience possible à vos destinataires, permettez-leur de vous faire confiance ! Ici, plus votre email est personnalisé, plus vous avez de chance de faire bonne impression et de répondre de façon pertinente et intelligible au besoin du lecteur.

2. Déclarez un attribut de langue sur la balise HTML

Pour que la prononciation de votre email soit correcte lorsqu’il sera lu à voix haute, renseignez la langue principale de la page avec l’attribut lang sur la balise <html>. Un code de langue sur deux lettres (ou trois parfois) doit être utilisé. Par exemple, le code suivant fixe la langue par défaut à français : <html lang=”fr”>.

3. Résumez le contenu du message dans le preheader

La plupart du temps, le preheader est utilisé pour les mentions « Voir cet email dans mon navigateur » ou « Si ce message ne s’affiche pas correctement, cliquez-ici ».

Une pratique consiste cependant à concentrer le contenu du message email dans ce dernier car il s’agit parfois du seul extrait lu par un lecteur d’écran ou un assistant personnel. Cela permet d’accéder rapidement aux informations prioritaires dans la limite du nombre des caractères autorisés.

Par exemple :

<div id = ”preview_text” style = ”display: none; taille de la police: 1px; couleur: #ffffff; hauteur de la ligne: 1px; hauteur maximale: 0px; largeur maximale: 0px; opacité: 0; débordement: masqué ; ”>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. </ div>

Rassurez-vous, cette démarche n’impacte pas votre délivrabilité !

4. Ajoutez l’attribut <role=”presentation”> sur les tableaux présents

Vous ne voulez pas que les lignes et les colonnes présentes dans votre email soient lues à voix haute ? Comme on vous comprend ! Cela rendrait d’ailleurs votre message assez incompréhensible…

Les spécialistes de l’email marketing ont l’habitude d’utiliser des tables pour structurer leurs courriers électroniques mais ce sont ces dernières qui posent problème pour la lecture. En attribuant à votre tableau le code  <table role=”presentation”> lorem ipsum<table>, vous indiquez au lecteur d’écran qu’il s’agit d’une table de présentation (pour la mise en page) et non pas une table de données.

En revanche, si votre HTML contient un tableau pour afficher des données, il ne sera pas nécessaire d’ajouter cet attribut.

5. Utilisez des balises sémantiques

<h1>, <h2>, <h3>, <h4>, <h5>, <p>… Les balises sémantiques facilitent la lecture car elles permettent au lecteur d’écran de différencier les niveaux de titre et paragraphe.

Bien qu’elles aident à la hiérarchisation du contenu des emails, elles sont souvent évitées ou du moins, déconseillées. En effet, certains clients de messagerie appliquent leurs propres styles. Ces derniers entrent alors en conflit avec les balises sémantiques. Résultat, le rendu est négligé et donc imparfait.

6. Pensez à la ponctuation

Dans le cas d’Alexa, assistant vocal d’Amazon, les signes de ponctuation (tels que !, %, #, *, etc.) sont ignorés. Les points et les virgules sont les seules exceptions. N’hésitez pas à en faire usage pour une expérience auditive optimisée (exemple : <h1> <span>Titre, de votre document. </ span> </ h1> <br> début du paragraphe. <br>).

7. Définissez un attribut ALT à chaque image

On vous le répète sans arrêt, mais sans attribut alt, l’expérience utilisateur devient vite désagréable. Car si votre image n’en dispose pas, le lecteur d’écran va lire le nom du fichier. Cet attribut est utilisé pour :

  • Les images informatives: pour définir avec précision le visuel tel que Exemple d’un mockup
  • Les images actives: pour décrire l’action du visuel comme Cliquez sur l’image pour accéder au site internet
  • Les images décoratives: pour rendre l’email uniquement plus esthétique (dans ce cas-ci, il faut laisser la balise vide, soit alt=””, pour indiquer au lecteur d’écran de passer cette image)

8. Évitez l’attribut title aux liens

Parce qu’il complexifie la lecture et fait doublon avec l’attribut alt, l’attribut title aux liens est déconseillé par la majorité des outils d’accessibilité. Il ne sera soit pas lu, soit perçu comme une possible erreur.

Préférez renseigner un contenu explicite dans le texte des liens ou le lien lui-même ! Par exemple, remplacez <a href=”…” title=”Téléchargez (PDF – 42 Ko)”>Notre catalogue de jouets</a> par <a href=”…”>Téléchargez notre catalogue de jouets (PDF – 42 Ko)</a>.

 

 

L’avis de l’experte

En matière d’assistants vocaux et lecteurs d’écran, l’email marketing rencontre encore des limites. Mais ces nouveaux usages sont en passe de devenir un incontournable au sein des foyers. Les emails sont aujourd’hui vus et entendus. De fait, il est indispensable pour tout marketeur de commencer à soigner le code HTML de ses messages. C’est un avantage évident et un impact non négligeable pour les stratégies marketing des marques.

 

J’externalise les réalisations techniques de mes campagnes emails

* Sources : Hadopi / CSA ; Genesys ; Microsoft

 

Sur le même sujet...