Conception du site
Un site plus accessible
Ce site a été conçu pour être plus accessible à tous. Pour consulter un site, l'internaute dispose de plusieurs outils. Il peut utiliser un navigateur tel que : Opéra, Internet explorer, Firefox, Chrome, Safari. S'il souffre d'un handicap, il peut employer un lecteur d'écran comme Jaws ou NVDA. Il peut accéder à un site par le biais d'un téléphone portable. Un site accessible à tous doit pourvoir fonctionner pour toute catégorie d'utilisateurs. De même, les moteurs de recherche tels que Google ou Yahoo analyse le contenu d'un site à la recherche d'information pertinente servant à alimenter leur index.
Un site respectant les standards du Web
Certains concepteurs prévoient un développement spécifique à chaque type d'outil. Nous avons les moyens de rémédier à ce genre de pratique en utilisant les standards du Web, langages préconisés par le W3C, consortium international, dont le rôle est de promouvoir l'évolution du Web et l'interopérabilité des techniques utilisées. W3C a donc rédigé les spécifications des langages HTML, CSS, XHTML, devenus des standards et pris en charge par les outils de navigation actuels. S'appuyer sur les standards permet de parler le même langage et donc de se comprendre. Le contenu d'un site respectant ces standards sera directement exploitable.
Les objectifs des standards du Web
Html est un langage de balisage, conçu pour structurer le contenu d'une page en introduisant un titre, des sous-titres, des paragraphes, des listes, des énumérations, tout ce qui permet d'éditer un texte sur Internet. Html n'a pas été conçu pour mettre en forme un texte sur une page Web, c'est-à-dire contrôler la typographie, le positionnement, la couleur, etc. La présentation d'un texte est laissé au langage CSS, en créant une feuille de style, stockée dans un fichier séparé du texte. Cette séparation permet de modifier la présentation sans modifier le contenu du texte et inversement. Le texte reste du contenu structuré grâce au balisage HTML. Il est associé à une feuille de style qui définit comment le texte de chaque balise va s'afficher.
Cette séparation du contenu et de la présentation permet de réduire le temps de développement et de maintenance mais elle induit également un contenu textuel plus facilement exploitable et plus rapide à charger car non polué par des balises de présentation. En respectant les standards, un site est accessible par tout type d'outils, sans avoir à développper de version spécifique.
Conformité aux standards
Ce site a été conçu dans le soucis de respecter les standards du Web tels que XHTML1.0, CSS2, RSS2. Vous pouvez tester la validité de chaque page du site en cliquant sur les liens présents en bas de page.
Pour vérifier la conformité à ces standards, les validateurs suivants ont été utilisés :
- Validateur XHTML1.0, selon les spécifications XHTML1.0
- Validateur CSS2, selon les spécifications CSS2
- Validateur RSS2.0, selon les spécifications RSS2.0 en anglais, ou encore une traduction des spécifications RSS2.0 en français
- Une liste de contrôle pour les standards Web
Respecter les règles d'accessibilité
Ce site a été conçu afin de permettre aux personnes handicapées (malvoyantes, malentendantes...) d'accéder facilement au site.
Pour cela, les référentiels et outils suivants ont été utilisés :
- Spécifications WCAG2.0 du w3c.
- Tests unitaires du RGAA (Référentiel Général d'Accessibilité pour les Administrations)
- Outils de de vérification des contrastes de couleurs Contrast Colour Analyser
- Navigateur textuel Lynx
- Lecteur d'écran Jaws
- Barre d'outils Web Developper pour Firefox
- Plonger dans l'accessibilité en 30 jours
La structuration du contenu de chaque page est respectée grâce à l'utilisation des balises de chapitres h1, h2, ..., des listes (balises ul, li), des paragraphes (balise p), des liens bien formés, des images bien commentées.
Afin de permettre l'augmentation de la taille des caractères affichés, la mise en page utilise des unités mesures relatives et non absolues. Cette possibilité a été testée de manière concluante sur une personne atteinte de dégénérescence de la macula.
La couleur verte est utilisée pour marquer la présence de liens cliquables. Les personnes atteintes de daltonisme ont une déficience visuelle avec le rouge et le vert. La couleur verte ne doit pas être l'unique façon de signaler la présence de liens et c'est pourquoi chaque lien cliquable est également souligné.
Réduire la taille des pages
Les pages du site ont été contrôlées afin de se limiter à une taille variant sensiblement autour de 100 ko pour du contenu textuel et 200 Ko pour une page contenant des images.
Il est également important de prévoir dans la conception un chargement progressif d'une page. Pour cela, il faut bannir le chargement de structure trop lourde, telle que les tableaux utilisés pour la mise en page du site et profiter à la place des possibilités des feuilles de styles CSS2. De cette manière, même si des images un peu lourdes sont chargées, le texte qui les accompagne sera visible rapidement, permettant de faire patienter l'internaute.
Les pages du site ont été analysées par l'outil suivant :
L'utilisabilité du site
Pour être consulté et utilisé, il est important que les besoins des utilisateurs du site soient pris en compte. Il s'agit de faciliter l'utilisation du site, de répondre rapidement à la recherche d'information et de permettre à l'utilisateur de réaliser sa tâche dans de bonnes conditions.
Les différents contacts pris et les mesures d'audience effectuées lors de la première version du site, ont permis de connaître un peu mieux les attentes des utilisateurs dans leur recherche d'information telle que:
- rechercher un club de vélo dans la région de Méré-Montfort
- rechercher des circuits à vélo en forêt de Rambouillet ou dans les Yvelines
- faire du tourisme à vélo
- consulter le calendrier des sorties du club
- connaître les horaires de sorties et les tarifs
- s'inscrire au club
- participer à la randonnée annuelle
- nous contacter
- se faire une idée de l'ambiance du club
La navigation du site et son contenu a donc été conçu afin de permettre la réalisation des tâches que l'utilisateur cherche à accomplir. Un échantillon de 6 personnes a permis d'effectuer des tests d'utilisabilité.
Des sites et livres de référence
- Articles et études sur l'ergonomie des NTIC : http://www.lergonome.com
- Des conseils en ergonomie de l'informatique (système d'information, intranet, site web) : http://usabilis.com
- De nombreux articles techniques sur l'utilisation des standards W3C du Web et l'accessibilité : http://openweb.eu.org
- Site de ressources en ergonomie web et logiciel : http://www.ergolab.net
- Un ensemble de bonnes pratiques pour la qualité des services en ligne : http://www.opquast.org
- De nombreux articles clairs et pratiques, le dossier de Xavier Borderie sur les standards du web : http://developpeur.journaldunet.com/
- Livre "Conception de sites Web, l'art de la simplicité" de Jakob Nielsen
Navigateurs testés
- Internet Explorer, Firefox, Opera, Safari, Chrome sur Windows 7, Vista, XP
- Navigateurs texte : Lynx
- Synthèse vocale : Jaws
Référencement naturel du site
La tâche de référencement de ce site a suivi les étapes d'un processus de référencement mis au point et déjà appliqué précédemment pour d'autres sites.
Ce guide synthétise l'expérience personnelle en la matière et suit les règles préconisées par les principaux acteurs du domaine :
- Outiref, audit des pages web et mot-clés pour le référencement d'un site : http://audit.abondance.com
- Actualités, conseils sur le référencement Google, Yahoo, MSN : http://www.webrankinfo.com
- Générateur de mots clés : Google AdWords
- Livre "Google trucs de pros" par Olivier Duffez et Olivier Andrieu
Aucune technique de spamdexing n'est utilisée. L'accent est mis sur le titre de chaque page et sur la pertinence du contenu. Le plus important est de cibler les catégories d'internautes susceptibles d'être intéressés par les informations apportées par le site, de leur faire découvrir le site et de les fidéliser.
Le respect des standards du Web (XHTML, CSS), un contenu bien structuré, sa mise en forme séparée et définie par des feuilles de styles externes, le respect des règles d'accessibilité ont permis aux moteurs de recherche d'accéder plus facilement et plus naturellement au contenu pertinent. D'où un meilleur positionnement auprès des moteurs, une augmentation du traffic et surtout une réponse plus adaptée à l'activité de recherche des internautes.
