top of page
  • Writer's pictureStéphanie Lemoine

Etes-vous lisibles ?


illustration Pixabay

Lors de nos précédents articles, nous avons soulevé la question de la visibilité pour la marque ou l'entreprise. Qu'on soit de petite ou grande taille, ou micro-entrepreneur, il y a un certain nombre de choses à savoir (et à savoir faire aussi) pour se démarquer, pour être plus visible et attirer les clients. Quand on nage complètement dans ce domaine de la communication visuelle et digitale, il ne faut pas hésiter une seule seconde à embaucher des spécialistes. Il n'y a pas de secret.


Aujourd'hui nous allons plutôt vous parler de lisibilité, et ce n'est pas la même chose. Dans le précédent article on parlait de la stratégie de base pour se faire connaître et sortir du lot. Ici nous allons parler de la façon dont on vous voit, dont on vous perçoit, et de la facilité ou non à comprendre votre message.


Etre clair

Cela semble une évidence, mais si vous n'êtes pas un pro de la communication, être clair demande un effort. Nous allons voir ensemble comment le devenir rapidement !


Pour commencer, quand on arrive sur votre page, que ce soit un site internet, votre fiche google business, ou votre page Facebook, pour ne citer que 3 exemples, on doit dès le header (la première partie de votre site, celle qui s'affiche en premier) comprendre qui vous êtes et ce que vous proposez.


Se présenter
  • Présentez-vous, ou présentez votre marque ou votre produit phare tout de suite en un mot ou une petite phrase. Une boutique de chaussures doit clairement notifier à cet endroit qu'elle est spécialisée dans la vente de chaussures. C'est une astuce pour le référencement naturel mais c'est surtout important pour les personnes qui arrivent chez vous ! Jouer aux devinettes, certaines très grandes marques peuvent s'y risquer, parce qu'elles peuvent se payer ce luxe, elles sont tellement reconnaissables par leur logo ou leur identité visuelle globale, qu'elles n'ont presque plus besoin de parler ! Pour les autres entreprises, c'est à bannir !


exemple de boutique en ligne - Le mot chaussure n'est pas écrit mais il est illustré en photo, le message est clair et réussi.
Choisir des typographies simples
  • Utilisez des typographies web safe bien lisibles de type Arial ( Calibri, Candara, Century Gothic, Consolas, Dejavu Sans, Franklin Gothic, Gill Sans, Helvetica, Lucida Sans, MS Sans Serif, Neue Helvetica, Optima, Segoe UI, Tahoma, Trebuchet MS et Verdana...)

  • Il existe une police d'écriture adaptée aux malvoyants, Luciole, conçue par des experts et des universitaires. Elle est gratuite. Vous pourrez vous la procurer très facilement sur ce site, la télécharger et l'installer sur votre ordinateur. Encore un peu méconnue, elle vaut vraiment la peine qu'on s'y intéresse. C'est un Arial amélioré qui facilite vraiment la lecture. Un vrai atout !


Respecter la loi des 3 tailles

  • Une grande pour les titres (en gras idéalement),

  • une moyenne pour les sous-titres,

  • et une plus petite sans graisse pour les paragraphes, afin de faciliter la lecture sur écran.

N'hésitez pas à faire lire à votre entourage, à des personnes âgées ou malvoyantes pour avoir leur impression.

Si elles ne trouvent pas de confort visuel pendant la lecture, elles quitteront la page au bout de quelques secondes et vous perdrez des prospects.

L'enjeu de notre époque est l'inclusion des personnes en difficulté et en situation de handicap. Ce n'est pas du luxe de leur faciliter un peu la vie dans notre monde presque totalement digitalisé. On parle d'illectronisme (illettrisme électronique ayant des origines diverses) qui toucherait la moitié de la population française... Pense-t-on à elles en créant notre site internet ?


Ne pas surcharger la page visuellement
  • Clair signifie aussi de ne pas mettre tous les mots importants en relief. Evitez de surligner ou sous-ligner à tout bout de champs, ou de mettre du gras ou de la couleur partout. Le mieux est l'ennemi du bien, soyez toujours très sobre. Demandez-vous toujours si vous pouvez épurer encore plus que ça ne l'est.

  • On évite aussi les bannières de publicité qui clignotent, les pop-ups, les emoticons 😁😍😎 à chaque fin de phrase ou au milieu, les ponctuations surnuméraires !!!!!!!!!! , le mélange de couleurs (la règle de 3 et de la sobriété, on ne le répètera jamais assez).

  • Enfin il faut faire attention à l'utilisation des Majuscules. IMAGINEZ LIRE TOUT UN TEXTE COMME CELA, C'EST FATIGANT, ON A LE SENTIMENT DE SE FAIRE CRIER DESSUS ET ON NE SAIT PLUS DISTINGUER SI C'EST UN TITRE LONG OU UN PARAGRAPHE MAIS EN TOUT CAS C'EST EXTREMEMENT PENIBLE, N'EST-CE-PAS ?

Etre sobre


Que ce soit dans le choix de la typo ou des couleurs, nous vous invitons vraiment à épurer au maximum et à créer des zones bien définies. Un espace pour l'image, des boîtes pour les textes, un espace pour les publicités si vous devez absolument en mettre.

Et parce qu'un exemple vaut toujours mieux que mille mots, voici en image de quoi illustrer nos propos.

Dîtes-nous ce que vous en pensez :



  • A gauche le site institutionnel de la ville de Lyon, sérieux, épuré, sobre, clair. Dans le header on sait de suite qu'on parle bien de la ville de Lyon, entre le mot et l'image de fond, point de doute. Le menu est bien structuré, mis en valeur en rouge. Le rouge revient discrètement un peu partout, par petites touches. On distingue bien le bloc image du bloc texte. Les titres sont de grande taille et en gras, et le paragraphe plus petit et sans graisse. Le choix de typographie est très simple, dans une typo web safe.

  • A droite, faut-il commenter ? Bon, on a dépassé la règle de 3 concernant le nombre de couleurs et de polices d'écriture. Le header permet de comprendre que nous parlons ici de vélos, mais l'on se perd très vite ensuite. Le menu est perdu au milieu des pubs, il y'en a un à gauche à la verticale et un autre à l'horizontale. C'est beaucoup trop. Toutes les informations sont mélangées, donnant une sensation de vrac. L'œil ne sait plus où se poser, et les couleurs fluos l'agressent. Les publicités s'affichent de partout sans ordre et sans logique. Le logo a probablement été dessiné à la main mais il donne une impression d'amateurisme qui ne donne pas confiance. Il semblerait que ce soit une boutique et on se demande si le bouche à oreilles n'aura pas été plus efficace que leur site ! Nous leur souhaitons !


Le choix des couleurs

  • Dernier point concernant la couleur. On peut avoir des couleurs sympa, fraîches, vitaminées, fluos éventuellement si cela sert notre communication de façon efficace et si cela dit qui l'on est. Mais le tout est de ne pas en abuser. Il faut les limiter, jouer avec les transparences, ne pas forcément les mettre côte à côte, les utiliser dans de discrets rappels dans une flèche directionnelle, un surlignage etc.

  • Il y a de bons outils pour marier au mieux ses couleurs, comme Adobe Color avec sa roue chromatique et toutes les options comme l'outil de contraste, permettant de mesure si vos couleurs sont assez contrastées pour être bien vues/lues par les personnes malvoyantes. On revient encore à cette histoire d'accessibilité et d'inclusion mais c'est très important.

  • Les couleurs du site dépendent généralement de celles du logo. Donc avant de penser au site, il faut bien penser son logo de façon à ce qu'il soit facilement déclinable y compris sur un site web !


la roue chromatique sur Adobe Color.

Petit récap :

- Etre clair et être sobre.

- Se présenter dès le début de façon rapide et efficace : que proposez-vous ?

- Limiter à trois le nombre de couleurs et de typographies différentes.

- Respecter la règle des trois tailles différentes pour les titres, sous-titres et paragraphes.

- Structurer ses informations et établir des zones bien séparées pour chaque élément.


Si cet article vous a plu, soyez généreux : partagez-le à votre entourage !

Et n'hésitez pas à nous contacter ici ou via le formulaire de la page d'accueil (qui permet de recevoir un pré-devis) si vous avez besoin de nos services pour votre communication visuelle et digitale !

13 views

Comments


bottom of page