Comment la typographie influence le comportement utilisateur en UI/UX

Relevant de la perception, la typographie fait partie d’une mécanique visuelle et cognitive bien huilée, celle de la complémentarité essentielle entre l’interface (User Interface ou UI) et l’expérience utilisateur (User Experience ou UX).

En communication numérique, chaque mot est une image, parce qu’il transmet, bien avant son sens, une émotion spécifique. Le dessin des caractères et l’agencement du texte sur une page influencent nettement le comportement du lecteur.

Aujourd’hui, une partie non négligeable des informations consommées en ligne est lue. Vitesse de lecture, perception d’une marque, état émotionnel de l’utilisateur sont autant de variables attribuables au pouvoir d’influence de la typographie.

Perceptions et formes typographiques

Une police typographique offre à chaque caractère un dessin unique. Cette individualité participe à la création d’une identité propre, mais également à l’assimilation inconsciente de tout un environnement visuel, bientôt perçu par le cerveau comme une image de marque.

L’intégration puis la mémorisation de cette image commencent avant la lecture du mot. Elles dépendent de la forme et de la couleur des caractères, mais surtout de l’effet qu’ils produisent chez l’utilisateur, qui n’est encore ni lecteur ni consommateur.

Les polices avec empattements (Serif)

Les polices avec empattement, la plus connue étant Times New Roman, symbolisent la tradition. Perçues comme des figures d’autorité, ces polices, largement employées par la presse écrite, valident, à elles seules, la qualité et la fiabilité de l’information lue.

Leur utilisation est privilégiée pour des contenus longs, lesquels plongent l’utilisateur dans une lecture immersive. Dans un contenu plus court, elles demeurent de véritables gages de prestige et de sérieux.

Les polices sans empattements (Sans-Serif)

Roboto, Helvetica et toutes autres polices sans empattements donnent lieu à une perception quelque peu différente. Plus sobres, elles évoquent la modernité et transmettent l’efficacité d’un contenu textuel qui va droit au but, sans chercher à dissimuler l’information sous des fioritures.

Grâce à la finesse de leurs traits et à leur espacement, elles sont devenues le standard typographique des interfaces ergonomiques. Très lisibles même sur de petits écrans à faible résolution, ces polices sont tout à fait appropriées aux versions mobiles et aux applications.

Le fond et la forme

Le choix d’une typographie ne relève pas d’une considération esthétique personnelle. Il doit se faire en fonction de la marque à promouvoir et de l’utilisateur cible. Véritable arme de séduction massive, la typographie véhicule des sentiments et des émotions dès le premier regard.

À l’instar des enseignes commerciales, la police utilisée sur l’application mobile d’un groupe financier ne sera pas la même que celle d’un magasin d’articles de sport.

Faire correspondre une identité visuelle à un public cible et à une intention de communication est une chose. La faire correspondre au produit proposé est primordial pour créer un rapport adéquat et harmonieux entre marque et produit et transformer l’utilisateur en consommateur.

Influence comportementale et typographie

Le choix typographique est une amorce cognitive. Connaître et reconnaître les différents aspects qui influencent positivement le comportement de l’utilisateur est essentiel à ce processus d’amorçage.

La lisibilité

La lisibilité d’un titre ou de toute une page web fait référence à la facilité avec laquelle les caractères sont identifiés.

La distinction de caractères graphiquement proches (« b » et « d », « p » et « q », etc.) dépend du dessin de la lettre (hauteur, volume, empattements), mais également des espaces entre les caractères et au-delà du caractère (crénage, interlignage, etc.).

Autrement dit, la lisibilité en typographie, parfois appelée scriptibilité, ne dépend pas des facultés de l’utilisateur, mais bien de la police choisie et de la mise en page (espacement, longueur et hauteur de ligne, contraste, etc.) du texte.

Cette notion de lisibilité ne fait pas référence à la compréhensibilité du contenu ou à la difficulté du vocabulaire, car elle intervient bien avant l’acte de lecture lui-même.

Une faible lisibilité induira chez l’utilisateur un désintérêt visuel ou une fatigue cognitive extrêmement rapide. Adapter la typographie à l’utilisateur participe au processus d’amorce, mais également au temps de rétention du lecteur sur une page.

L’architecture visuelle

La lecture d’une page web est peu linéaire, mais davantage diagonale ou verticale. L’utilisateur fait défiler la page tout en la parcourant des yeux. Ces derniers s’arrêtent sur des éléments mis en relief par la typographie.

Deux modèles de lecture sont généralement associés à la lecture d’une page web : le « scan en F » ou le « scan en Z ». Les pages riches en texte sont généralement balayées, et non lues, selon un motif alternant le linéaire et le vertical (F), alors que les pages pauvres en texte sont parcourues suivant un tracé linéaire et oblique (Z).

Les titres et les différentes faces (romain, italique, gras) ancrent certains mots-clés dans l’esprit et permettent d’extraire du texte une partie de son information essentielle, sans même l’avoir lu.

La taille, la forme, la couleur et le contraste sont autant d’obstacles à ce processus, car ils offrent une résistance au balayage du regard. Ces artifices typographiques ne doivent donc pas être utilisés à la légère, leur abus brise le scan de l’utilisateur, tout comme les boîtes de publicité trop nombreuses et trop longues ou la succession sans fin d’hyperliens.

De façon générale, l’expérience utilisateur (UE) est dictée par sa capacité à percevoir l’information proposée. Cette information est présentée par le biais d’une interface (UI) dans laquelle la typographie joue un rôle essentiel : de l’agencement des blocs de texte au plus petit détail du caractère, elle séduit les yeux autant qu’elle conditionne les esprits.