Développer dans les normes (dès le de début)
Écrit par Martin, le 8 juin 2008 à 0:32Développer un site web peut se résumer à écrire un livre. Ce n’est juste pas le même langage que celui que vous avez l’habitude de trouver dans un best-seller.
Et comme tout écrivain on doit respecter des règles, lui de grammaire, syntaxe et orthographe, moi de structure, syntaxe et de standards.
La syntaxe ça n’intéresse pas grand monde, en PHP on met un point-virgule à la fin de la ligne, c’est comme ça, on ne peut rien y faire. La structure est plus intéressante, mais elle est souvent la même pour de nombreux projets. Un livre aura des chapitres, un site web aura des class, des functions et des fichiers (chacun organise comme il veut). Mais la partie qui me préoccupe le plus et qui est la plus difficile, est le respect des standard.
Respecter les standard dans le web, c’est comme mettre une majuscule après un point. si je ne la met pas vous ne le voyez pas forcement (vous l’avez vu ?). Ce n’est pas très grave de ne pas respecter les standards, en général si le site s’affiche (à peu près) bien sur les ordinateurs de mes amis, c’est que c’est bon … Mais le problème c’est qu’on ne pense pas aux autres, à ceux qui ne peuvent pas parcourir le site comme nous, les autres ce sont :
- Les robots des moteurs de recherches
- Les mal-voyants et non-voyants
Le premier point me préoccupe, pour l’instant, plus que le deuxième, mais ils sont en réalité directement liés. Si je ne respect pas les standards, les robots ne pourront pas analyser et comprendre la structure du site. Donc mon site sera mal référencé, personne ne pourra nous trouver sur les moteurs de recherche (=Google, soit 90% des recherches en France). Avoir un aussi beau site que Prestille mais ne pas être trouvé, c’est vraiment dommage non ? Par exemple mettre un titre entre des balises <h1></h1> plutôt que <span style=”font-size:25px”></span> (ce qui fait la même chose) est interprété complètement différemment par un robot. Le premier sera interprété dans sa juste valeur (avec une forte importance car c’est un titre), le second sera considéré comme un paragraphe …
Le respect des standards n’est pas la chose la plus importante pour le référencement (le plus important reste le contenu et les mots clés dans ce contenu, ceci fera sûrement l’objet d’un billet prochainement), mais ça remplie surtout le point 2 que j’ai cité plus haut.
On ne pense pas forcément aux mal-voyants et non-voyants. Bien qu’ils soient minoritaires, je ne veux pas les ignorer par respect et par intéressement. En effet un site e-commerce qui respect les standards pourra vendre à un aveugle, c’est toujours un client en plus pour nous et un en moins pour ceux qui ne respectent pas.
Pour ceux qui ne savent pas, un aveugle peut utiliser internet ! Pour cela il utilise un lecteur de page qui va lire et interpréter le site pour lui, grâce à une synthèse vocale. Pour reprendre l’exemple du point et de la majuscule, si je ne met pas de point, la synthèse vocal n’accentuera pas correctement la phrase, ce qui est plutôt désagréable et peut nuire à la compréhension.
Je suis tombé récemment sur ce site qui explique très bien (grâce à des vidéos) pourquoi et comment il faut respecter ces standards, je le conseil à tous les développeurs qui ne se sont pas vraiment penché sur le sujet. J’essaie de prendre en compte tous ces paramètres des le début, ça évite de faire ensuite de lourdes modifications du site après coup, et principalement :
- Les structures de textes avec les <H?>eader et les <P>aragraphes
- La balise title dans le liens et les images
- La balise alt pour le texte alternatif dans les images
- La balise <label> dans les formulaires
- La déclaration de la langue
Et vous amis dévellopeurs respectez vous (strictement) tout ces standards ?
Est ce qu’un aveugle a lu cet article ?
[edit] Je viens de tomber sur cet article qui raconte surement plus profondement ce que je viens de dire (en anglais) : http://www.internetretailer.com/article.asp?id=26565
Tags: développement, ecommerce, html, php, standards web
8 juin 2008 à 21:55
Là tu m’en apprend en ce qui concerne les aveugles!… Je croyais que les mal-voyant pouvait tout de même naviguer, par des réglages de luminosité/contraste, mais je ne savais pas qu’il existait un système de synthèse vocale… C’est intéressant en tout cas ; )
[Répondre]
23 juin 2008 à 11:51
Bonjour
L’accessibilité est un enjeu de plus en plus important notamment en matière de e-commerce, tout autant que pour le moteurs de recherche qui prennent de plus en plus en considération ce type de sites web.
Effectivement, en France, la population des déficients visuels (mal-voyants et non-voyants) représente environ 8%. Toutes proportions gardées, on peut, à mon sens, estimer cette population sur le Web entre 2 et 4%.
Nous n’avons pas le droit de les oublier. D’une part, parce que ce ne serait pas éthique, et d’autre part parce qu’en tant que cybermarchand, ce serait une part de marché potentielle dont vous vous priveriez.
Malheureusement, je ne connais aucune étude à ce jour qui puisse permettre d’identifier la proportion d’actes d’achat d’une population de déficients visuels comparée à celle d’une population valide. Il serait peut-être intéressant d’en apprendre davantage. Nous pourrions être surpris ! Et il n’est sans doute pas exclu que l’intention d’achat de cette population soit plus prononcée que chez les valides.
Dela même manière, peut-être que les non-voyants, par leur incapacité à voir, optimisent leurs temps de connexion en visitant les sites marchands pour ne se concentrer que sur l’essentiel : le produit qu’ils recherchent, donc surferaient bien moins (i.e flaneraient).
Déjà, leurs visites se limiteraient aux sites accessibles, cad, comme vous le disiez, aux sites capables d’être “traduits” par synthèse vocale par des outils adaptés. Donc avantage pris aux sites respectant ce standard.
Il réside néanmoins dans ce schéma un problème de taille : les moteurs de recherche. Effectivement, si Google par exemple accorde une plus grande importance (a priori) dans son algorithme aux sites respectant ce type de standard, les résultats donnés n’en demeurent pas moins mélangés (comme d’habitude d’ailleurs, et selon les critères que l’on connait => backlinks, contenu, authorité, etc…). Et l’internaute valide ou déficient visuel n’obtient pas toujours ce qu’il souhaite rapidement.
Voici quelques-unes de mes reflexions à la lecture de votre très bon billet.
Concernant votre logo (celui du blog), justement, mon associé (déficient visuel - daltonien - il en existe plusieurs variantes), ne le distingue pas du fond. Son invalidité ne lui permet pas de discerner correctement le ton sur ton (en tous cas celui-ci - gris sur gris). La même chose par exemple (en ce qui le concerne) pour le jaune sur vert et bien d’autres anomalies.
Juste quelques conseils pour vos lecteurs :
> Privilégier les contrastes positifs : fond clair, écriture sombre (fond blanc, police noire par exemple) et éviter le ton sur ton (contraste négatif comme l’écriture claire et le fond sombre qui réduit la lisibilité web)
> Un attribut title pour chaque lien et un attribut alt pour chaque image : le title permettra au synthétiseur de traduire le libellé du lien et l’attribut alt, la description de l’image. A noter que cela a une incidence sur les moteurs de recherche, en particulier l’attribut alt des images pour leur indexation dans Google Images.
> Les repères : l’internaute possède toute une série de repères lorsqu’il se trouve sur un site web (positionnement des blocs). Veillez donc à respecter ce standard (qui n’en est pas un), afin d’améliorer leur navigation sur votre site.
> Ecrivez moins et favorisez les listes
…
Félicitations pour votre blog et surtout pour votre initiative estudiantine/entrepeneuriale. Pas facile je pense d’allier les 2. Mais la passion, je connais ;o).
J’ai parcouru vos billets et vous félicite également pour la qualité de vos reflexions.
Christophe Da Silva
Arkantos Consulting
[Répondre]
martin reply on juin 23rd, 2008 12:10:
Christophe,
merci pour cet excellent commentaire.
J’en discute avec François ‘le Designer’ pour changer les contrastes de Prestille.
Il est vrai qu’on joue pas mal sur du ton sur ton et que c’est souvent nuisible (même pour les non déficients, mais ceux qui ont un écran de mauvaise qualité ou dont la luminosité est trop forte)
Je viens de mettre en place sur Prestille.com une gestion des images dynamiques (par BDD) avec gestion de la balise title, alt et longdesc (car moi j’en connais l’utilité, mais les rédacteur des fiches produits et autres designers ne le savent pas forcément)
Je reviendrais sûrement vers vous pour avoir d’autres conseils au moment voulu.
Surtout pour l’optimisation des balise title sur les liens (longueur, contenu …)
Martin Balas
CTO Prestille
[Répondre]
23 juin 2008 à 12:31
Re-bonjour,
Autre chose concernant votre blog en termes d’ergonomie et les repères dont je parlais dans le commentaire précédant.
Ayant eu besoin de revenir à l’accueil de blog, je n’ai trouvé aucun lien permettant de le faire. Alors effectivement, connaissant les usages du Web ;o) et accessoirement WordPress, je me doutais que votre logo donnait l’accès.
Mon conseil : si moi je le sais, d’autres non. Facilitez-leur la tâche en ajoutant des liens en dur (non gérés par WP) dans votre colonne de gauche, au dessus des catégories comme cela par exemple :
NAVIGATION :
Accueil du blog
Accueil de Prestille
Mentions légales
Protection de la vie privée
Contact
Egalement, un lien “haut de page” à la fin de chaque billet et accessoirement après les commentaires seraient les bienvenus.
N’hésitez pas à me contacter le cas échéant.
Christophe Da Silva
Arkantos Consulting
[Répondre]
martin reply on juin 23rd, 2008 12:39:
Accueil du blog
Accueil de Prestille
rapidement rajouté
on va retravailler le thème avec François, mais ce n’est pas la priorité)
merci pour le conseil !
[Répondre]