La question est de moi, la réponse est de … je crois qu’il vaut mieux taire son nom ! La question était sincère et la réponse tout autant. En général quand on me demande mon avis sur un nouveau projet web top moumouth qui vient de sortir, ah ! c’est plus fort que moi il faut que je fasse un audit ! Qualité du code (HTML/CSS/JS), petit test de performance et mon petit test préféré : une consultation du site en mode texte. L’idée peut paraître saugrenue ou même carrément … lol ? Et pourtant ça n’a que des avantages.
« En mode texte ?! T’abuses Fab » …
Je ne sais pas mais ce doit être le vocabulaire qui dérange, je pense que si je remplaçais ces termes par « je test le site comme un robot Google » mes interlocuteurs seraient plus attentif. D’ailleurs pour vous inciter à continuer à lire ce billet vous allez entendre parler de stratégie digitale, de référencement naturel, de bonnes pratiques SEO, de partage de contenu mais aussi de performance, de mobile, d’expérience utilisateur… et j’en oublie !
Tout ça juste en partant d’un simple test d’un site en mode texte ? Tu m’intéresses là.
Travailler sur un projet web est belle aventure … tout du moins pendant la phase dite « phase Bisounours« . C’est la partie où se mêlent les grandes idées, les conceptions graphiques hyper créatives, la toute dernière techno web qu’il FAUT utiliser pour prétendre à un petit « award » à mettre en pied de page … Cette phase prend fin quand le client s’en mêle (quelle idée aussi !) et qu’il demande des résultats (en réalité cette phase est beaucoup plus courte, mais allons à l’essentiel).
A un moment, tôt ou tard, vous devez rendre des comptes sur l’efficacité du projet. Rendre compte à votre client parce que vous lui avez vendu un site qui boosterait son chiffre d’affaire, mais aussi rendre des comptes à vous-même et à l’équipe en charge du projet. C’est essentiel. Il y a les engagements contractuels que vous pourriez avoir pris avec votre client. Et pour peu que vous aimiez votre métier, il n’est pas concevable de pouvoir conserver une dynamique d’entreprise quand vous savez que personne n’a d’intérêt pour votre travail !
Il y a donc forcément un moment dans le processus de réalisation du projet où vous devez vérifier comment les moteurs de recherche vont « voir » le site.
Tester son site en mode texte : le référencement
Les moteurs de recherche, pour référencer les sites, envoient des petits robots pas très très malins il faut le dire. Ils ne savent pas lire le JavaScript, n’interprètent pas les styles CSS et comble de tout, ne font même pas la différence entre un texte en image et un texte « texte ». Finalement, ils lisent un peu une page web comme nous pourrions le faire si nous consultions les sites web en mode texte : pas d’images, pas de JavaScript, pas de CSS (mise en page).
Les préconisations de Google sont d’ailleurs claires :
Pour vérifier le fonctionnement de votre site, utilisez un navigateur texte tel que Lynx. La plupart des robots d’indexation de moteur de recherche visualisent en effet votre site de la même manière que Lynx. Si certaines fonctionnalités (JavaScript, cookies, ID de session, cadres, balises DHTML ou contenus Flash) vous empêchent d’afficher la totalité de votre site dans un navigateur texte, il est possible que les robots rencontrent des difficultés similaires lors de leur exploration.
Pour ma part, je vous conseille de faire comme moi, c’est plus simple : testez le site via Html2Text, un service en ligne fourni par le W3C. Le rendu est sensiblement similaire à une vue sous Lynx et c’est vraiment plus simple !
Petit test :
Nous pouvons voir sur la capture ci-contre, la page « qui suis-je » de mon site. On y voit l’essentiel, la page tel que la voit les robots d’indexation des moteurs de recherche !
J’ai ajouté 2 petites annotations pour mettre en avant des liens de la page. Certaines portions de textes étant des liens, on peut voir les liens complets directement dans la page … et c’est ainsi que les robots parcourent l’ensemble du site.
C’est à ce stade que l’on se rend compte de l’importance qu’il y a à renseigner les attributs « alt » et/ou « title » des liens et des images. Essayez de retrouver en mode texte une image sans ces attributs. Peine perdue, elle n’apparaitra même pas dans la page ! Tout cela plus les soucis potentiels de contenus générés en JavaScript, Iframe, Flash et j’en passe, vous rendez-vous compte des informations perdus pour le moteurs de recherche ?!
Concernant mon exemple ci-dessus, mon site étant très light c’est presque agréable à lire en mode texte, testez quelques sites célèbres et je ne peux que vous souhaiter bon courage pour l’analyse ! En effet la « philosophie » du « Mobile first » (le « pensez mobile en premier ») n’étant pas une généralité (loin s’en faut !) les pages web sont bien trop lourdes, indigestes et finalement illisibles dans la majorité des cas.
L’expérience utilisateur et le « Mobile first »
Comme nous l’avons vu précédemment, la plupart des sites sont quasiment indéchiffrables en mode textes. Ce qui soulève un point particulier. Si une page web doit être très dense en informations (formulaires, menus, diaporamas, pubs, carrousels, textes,…), il est indispensable d’avoir un design et une ergonomie parfaitement pensée pour satisfaire la majorité des utilisateurs du site et éviter de les perdre en quelques secondes.
Si la page est illisible en mode textes, soyez persuadé qu’il y a forcément des problèmes d’ergonomie dans son mode « complet ».
Il est vrai que généralement un site web est pensé, imaginé par un groupe de quelques personnes pour potentiellement quelques milliards. En essayant de toucher « la masse » vous ou plus souvent, votre client, aurez toujours tendance à trop en mettre. « Ces 10 blocs doivent absolument être en page d’accueil ». La zone utile, communément admise, de 1024px de large offre beaucoup d’espace. L’expérience utilisateur peut rapidement devenir un vrai cauchemar.
La philosophie du « Mobile First », comme vous l’aurez deviné, consiste à démarrer un projet web en le pensant d’abord pour un écran d’appareil mobile (smartphone, tablette). A mon sens, le meilleur argument que présente ce concept est que nous avons besoin de penser chaque bloc de contenu d’une page, de la façon dont il doit fonctionner et réagir. En effet en partant sur un minimum de 320px de large, chaque pixels compte et nous oblige à des trésors d’inventivités pour offrir une bonne expérience utilisateur. Nous devons penser « simple« , « riche« , « ergonomique« .
Je vous invite à lire le livre de Luke WROBLEWSKI, « Mobile first ». Les études de cas sont très intéressantes et c’est une excellente initiation à cette « philosophie ». Mais au-delà même de cette notion « Mobile first », ce que vous découvrirez dans ce livre c’est tout simplement que vous devez absolument penser aux mobiles dès maintenant, les chiffres présentés sauront vous convaincre !
Pensez « Mobile first » et la consultation de votre site en mode texte n’en sera que plus cohérente. La lecture en mode texte et sur mobile est un peu similaire : linéaire, du haut vers le bas.
Elevons-nous
Je vous ai parlé de deux notions essentielles sur le web, le référencement et l’expérience utilisateur(ou ergonomie avancée). Nous avons vu qu’un simple test d’un site web en mode texte suffit pour mettre le doigt sur un certain nombre de problèmes potentiels, en systématisant ce type de test, vous acquerrez de quoi développer des argumentaires solides pour cadrer vos clients.
En outre, dans la stratégie digitale que vous proposez à vos clients/prospects une part importante de celle-ci s’appuie sur des principes techniques, en effet comment argumenter sur le référencement (naturelle et/ou payant) sans parler de sémantique HTML, des microformats/micro data, de sites adaptatifs, de performance, de cdn, etc… Voilà d’excellentes raisons pour vous inciter à regarder au-delà du rendu visuel de vos projets.
Conclusion
J’avoue, le titre de ce billet est quelque peu … racoleur, trollesque, et je l’avoue mon objectif était de parler … d’accessibilité ! Oui, en suivant ces quelques recommandations, vous rendrez votre projet web plus accessible. Bien évidement il y a encore du travail pour avoir un site conforme aux différents référentiels d’accessibilités mais allons-y doucement et fixons nous des objectifs … accessibles !
J’ai bon espoir que ce billet attirera ceux qui n’y attachent pas d’importance et leur fera voir que d’une certaine façon l’accessibilité n’est qu’une question de bon sens.
Quand à moi, sachez que je ne suis pas expert en accessibilité, et je sais pourquoi : aucune ligne « optimisation accessibilité » dans les devis. Alors quand les lignes « webmarketing » et/ou « référencement » sont tout en haut, j’y vois tout de même une référence à l’accessibilité et de bonnes raisons de mettre en pratique les règles de bases de l’accessibilité.
J’espère pouvoir continuer la discussion dans les commentaires ci-dessous 
