Les titres et les sous-titres
Les titres et sous-titres ont pour objectif de structurer l’information sur une page web ou sur un écran d’application.
Les titres
Un titre (aussi appelé header) correspond au texte qui figure en haut d’un écran ou d’une page.
Il a pour fonction :
- De décrire l’objet principal de cet écran ou page
- D’informer l’utilisateur sur l’action à réaliser ou l’information dont il doit prendre connaissance
- De communiquer la valeur délivrée suite à l’action réalisée
Le tout, avec quelques mots seulement !
Les sous-titres
Un sous-titre (ou une description) complète le titre en apportant plus d’éléments de contexte sur l’action à réaliser ou l’information à prendre en compte. Il peut également guider l’action plus précisément, ou la décrire, en fonction du contexte.
Le but étant toujours d’aider l’utilisatrice à comprendre (l’enjeu, l’impact, comment ça fonctionne…) et à prendre une décision.
Un sous-titre ne doit pas répéter le titre, mais bien donner un complément d’information. D’ailleurs, s’il n’est pas nécessaire d’ajouter quoi ce que soit, il n’est pas nécessaire d’avoir un sous-titre. Dans ce cas-là, less is more*.
Exemples
- Articulation d’un titre et d’un sous-titre dans un empty state (état vide) sur l’espace Documents de Doctolib
Ici, le titre de l’empty state explicite de façon actionnable ce que l’utilisateur ou l’utilisatrice peut faire dans cet espace. Le sous-titre, quant à lui, donne un deuxième niveau de précision pour guider l’utilisation en expliquant quelles sous-actions sont réalisables. Il rassure également sur la sécurité liée à ces actions sensibles et à la protection des données.
☝️ Pour aller encore plus loin et ne laisser aucun doute, il pourrait être utile d’ajouter quelques exemples de document médicaux dans le texte.
- Articulation de titres et sous-titres - Google Slides
Ici, le titre fait un état des lieux et donne la solution à l’utilisatrice. Il ne laisse aucun doute sur le fait que l’accès à la page soit conditionné à une autorisation, et le sous-titre rappelle les possibilités pour obtenir l’autorisation d’accéder au fichier.
La formule < quoi + comment > fonctionne à merveille, et le texte du bouton call-to-action permet aussi de débloquer la situation sans l’aide du sous-titre.
☝️Un rappel du nom du fichier à l’aide d’une variable aurait pu être un plus… mais pour des raisons de confidentialité, il peut être bien de ne pas le mentionner. ⚖️
*Le mieux est l’ennemi du bien.
