Le Site de la Semaine – « Label Escale »

Vous souhaitez faire escale dans un lieu de vie, de rencontres et de partage culturel ? Ouvrez les portes du café coworking Label Escale ! Pour une heure ou plus, on y profite d’un espace de travail et d’échanges, avec boissons chaudes, eaux détox et snacks en libre-service. Un lieu dont la promesse tient en un mot : accueillir.

Merci à Label Escale d’avoir confié aux matelots de Graph’in ! la création de son site internet. Un lieu ouvert à tous mérite un site ouvert à tous. C’est le fil de cet article : l’accessibilité numérique, ou l’art de concevoir un site que chacun peut utiliser, quels que soient sa vue, son audition, sa mobilité, son âge ou l’écran qu’il a entre les mains.

L’accessibilité, c’est quoi au juste ?

Un site accessible est un site que tout le monde peut consulter et utiliser, y compris les personnes en situation de handicap. Une personne aveugle navigue avec un lecteur d’écran, qui lit la page à voix haute. Une personne malvoyante agrandit le texte ou augmente les contrastes. Une personne qui ne peut pas utiliser de souris se déplace au clavier, ou avec une commande vocale. Une personne sourde a besoin de sous-titres pour suivre une vidéo.

Mais l’accessibilité ne concerne pas seulement le handicap permanent. Elle sert aussi celui qui consulte le site en plein soleil, sur un téléphone à la luminosité trop faible ; celle qui s’est cassé le poignet et tape d’une main ; le visiteur âgé qui a du mal à lire les petits caractères ; celui qui regarde une vidéo dans le tram, sans le son. Un site accessible est, au bout du compte, un site plus confortable pour tout le monde.

Des règles qui existent déjà

Inutile de réinventer la roue. Les règles internationales d’accessibilité des contenus web, appelées WCAG, décrivent précisément ce qu’un site doit respecter, avec plusieurs niveaux d’exigence. En France, le référentiel général d’amélioration de l’accessibilité (RGAA) s’appuie sur ces règles. Les sites publics sont tenus de les suivre depuis longtemps ; depuis juin 2025, une directive européenne étend des obligations d’accessibilité à certains services en ligne, comme le commerce électronique, avec des exemptions pour les très petites entreprises. Pour savoir précisément si votre activité est concernée, mieux vaut vous renseigner auprès des sources officielles. Mais même sans obligation, les bonnes pratiques valent la peine d’être suivies : elles ne coûtent presque rien quand on les prévoit dès le départ.

Des textes lisibles par tous

La taille et la police

Un texte trop petit est la première barrière. Une taille de base confortable, une police lisible (sans fioritures pour les textes courants), un interligne aéré et des paragraphes courts facilitent la lecture de tous, et en particulier des personnes dyslexiques ou malvoyantes. Le texte doit aussi pouvoir être agrandi par le navigateur sans que la page se déforme ou que des morceaux disparaissent hors de l’écran.

Les contrastes

Un texte gris clair sur fond blanc fait très élégant sur une maquette. Sur un écran de téléphone, en extérieur, il devient invisible. Les règles WCAG fixent un rapport de contraste minimal entre le texte et son fond : 4,5 pour 1 pour un texte courant au niveau de conformité le plus souvent visé, 3 pour 1 pour les grands titres. Des outils gratuits mesurent ce rapport en un clic.

Ce point se travaille avec la charte graphique. Une couleur de marque très claire peut habiller un fond, un pictogramme, un filet décoratif ; elle ne doit pas servir à écrire un paragraphe. Quand Graph’in ! conçoit une identité visuelle destinée au web, il vérifie dès le départ quelles combinaisons de couleurs sont lisibles, pour que la marque et l’accessibilité naviguent dans le même sens.

Ne jamais compter sur la couleur seule

Un lien signalé uniquement par une couleur différente du texte échappe aux personnes daltoniennes. Un champ de formulaire en erreur entouré de rouge, sans message écrit, ne dit rien à quelqu’un qui ne perçoit pas le rouge. On double donc toujours l’information : un soulignement pour les liens, un message explicite pour les erreurs, un pictogramme à côté d’un code couleur.

Des images qui parlent aux lecteurs d’écran

Un lecteur d’écran ne voit pas les images. Il lit leur texte alternatif, ce petit texte caché que l’on renseigne dans l’attribut « alt ». S’il est vide, la personne aveugle ne sait pas ce qu’elle manque ; s’il contient « IMG_4587.jpg », elle n’est guère plus avancée.

Le bon texte alternatif dit ce que l’image apporte au propos, pas forcément ce qu’elle montre dans les moindres détails. Pour la photo d’un espace de travail lumineux, on écrira par exemple « Un espace de coworking calme et lumineux pour travailler quelques heures » plutôt que « Photo d’une table en bois avec trois chaises et une plante ». Les images purement décoratives, elles, reçoivent un texte alternatif vide, pour que le lecteur d’écran les ignore au lieu de les annoncer une à une.

Même logique pour les textes écrits dans les images : une affiche d’événement mise en ligne sous forme d’image reste muette pour un lecteur d’écran. Les informations importantes (date, heure, lieu, tarif) doivent aussi figurer en texte dans la page.

Une navigation qui fonctionne au clavier

Essayez : posez votre souris, et parcourez votre site uniquement avec la touche Tabulation (pour avancer) et la touche Entrée (pour cliquer). Pouvez-vous ouvrir le menu, atteindre chaque lien, remplir le formulaire de contact, fermer une fenêtre qui s’ouvre ? Voyez-vous toujours où vous vous trouvez sur la page ?

Si la réponse est non, une partie de vos visiteurs ne peut tout simplement pas utiliser votre site. Les corrections sont souvent simples : un contour visible autour de l’élément actif, un ordre de navigation logique, un lien « Aller au contenu » en début de page pour éviter de traverser tout le menu à chaque fois, des menus déroulants qui s’ouvrent aussi au clavier.

Des titres bien hiérarchisés

Les personnes qui utilisent un lecteur d’écran naviguent souvent de titre en titre, comme on survole un sommaire. Une page bien structurée a un seul titre principal, puis des sous-titres hiérarchisés dans l’ordre (titres de section, puis sous-sections). Un titre choisi pour sa taille plutôt que pour son rang brouille ce sommaire. Bonne nouvelle : cette structure aide aussi les moteurs de recherche à comprendre la page.

Des liens qui disent où ils mènent

Une page truffée de « Cliquez ici » et de « En savoir plus » devient incompréhensible quand un lecteur d’écran liste ses liens hors contexte. « Découvrir les espaces de travail » ou « Voir les horaires d’ouverture » disent clairement où mène chaque lien.

Les informations pratiques d’un lieu d’accueil

Pour un lieu comme un café coworking, le site sert d’abord à préparer la visite. Les informations pratiques méritent donc une attention particulière, et elles font partie de l’accessibilité au sens large :

• l’adresse, avec un lien vers un plan et les transports en commun à proximité ;
• les horaires, écrits en toutes lettres et non dans une image ;
• le fonctionnement du lieu (comment on réserve, comment on paie, ce qui est inclus) ;
• les conditions d’accès physique : le lieu est-il de plain-pied, y a-t-il une marche, un ascenseur, des toilettes adaptées ?

Ce dernier point est souvent oublié. Pourtant, une personne en fauteuil roulant ou un parent avec une poussette a besoin de le savoir avant de se déplacer. Le dire simplement, même quand l’accès n’est pas parfait, est une forme de respect. Ces mêmes informations ont leur place sur la fiche Google de l’établissement, qui propose d’ailleurs des attributs d’accessibilité ; nous détaillions le rôle de cette fiche dans le Site de la Semaine Lab’oh !.

Vidéos, documents et formulaires

Une vidéo de présentation du lieu fait toujours son effet. Pour qu’elle profite à tous, elle reçoit des sous-titres (utiles aussi à tous ceux qui regardent sans le son, c’est-à-dire une bonne partie des utilisateurs de téléphone) et ne se lance pas automatiquement avec le son. Les documents à télécharger (programme d’événements, tarifs) sont plus accessibles en page web qu’en PDF scanné. Les formulaires, enfin, ont des étiquettes visibles pour chaque champ et des messages d’erreur écrits en clair.

Accessible ne veut pas dire austère

On entend parfois que l’accessibilité bride la créativité. C’est l’inverse. Les contraintes de contraste, de taille et de structure obligent à faire des choix plus nets, et les sites accessibles sont souvent plus élégants que les autres, parce que plus lisibles. Le site d’un lieu chaleureux peut rester chaleureux : photos d’ambiance, couleurs gourmandes, ton accueillant. Il suffit de vérifier que ces choix n’excluent personne.

Les sites conçus par l’équipage sont pensés d’abord pour le téléphone (sujet traité dans le Site de la Semaine La P’tite Diablotine), et beaucoup de bonnes pratiques d’accessibilité vont dans le même sens : des boutons assez grands pour être touchés sans viser, des textes qui s’adaptent à l’écran, des pages légères.

Par où commencer ?

Pas besoin de tout refaire d’un coup. Quelques vérifications simples donnent déjà une bonne idée de l’état d’un site : parcourir ses pages au clavier, tester les contrastes de ses textes principaux, vérifier que chaque image a un texte alternatif utile, lire les titres de la page dans l’ordre comme un sommaire. Les corrections les plus urgentes apparaissent vite. Les autres se planifient au fil des mises à jour.

Les outils automatiques, et leurs limites

Des extensions de navigateur et des services en ligne analysent une page et signalent les erreurs les plus fréquentes : images sans texte alternatif, contrastes insuffisants, champs de formulaire sans étiquette, titres dans le désordre. Ils font gagner du temps, mais ne voient pas tout. Un outil vérifie qu’un texte alternatif existe ; il ne sait pas dire s’il a du sens. Il repère un bouton ; il ne sait pas si l’on comprend où il mène.

Rien ne remplace donc un regard humain, et idéalement celui des personnes concernées. Demander à un utilisateur de lecteur d’écran de parcourir le site pendant une demi-heure apprend souvent plus qu’un rapport automatique de vingt pages. Certaines associations proposent ce type de test. À défaut, l’équipage fait lui-même ces vérifications avant chaque mise en ligne, et forme les équipes de ses clients aux bons réflexes, pour que les nouvelles pages restent accessibles bien après la livraison du site.

Un site où chacun trouve sa place

Commerce, lieu d’accueil, association, entreprise de services : un site accessible ouvre vos portes à davantage de visiteurs et améliore le confort de tous. Graph’in ! conçoit des sites internet WordPress pour les entreprises et les lieux de Nantes, d’Ancenis et de la Loire-Atlantique, et à distance partout en France. Découvrez nos réalisations, puis faites escale chez nous : la passerelle est large, tout le monde peut monter.

Levez l’encre !

Vos questions, nos réponses