QuiboBlog, notre blog corporatif
Mercredi, 2 juillet 2008
Le référencement du flash : le bout du tunnel ?
Google Yahoo et Adobe semblent s'être unis pour améliorer et rendre possible le référencement de texte contenu dans les animations Flash. On parle bien ici du texte et non des images ou encore des vidéos.Google prendra maintenant en compte les liens contenu dans les textes des animations lors de son crawler. Le moteur de recherche pourra alors indexer les pages du site liées entre elles.
Le contenu appelé par Javascript dans le Flash ne pourra quant à lui pas être indexer pour le moment. Il ne sera pas non plus possible d'indexer une ressource externe tel un fichier XML ou tout autre document appelé.
Alors va-t-on pouvoir répondre à la frénésie des clients pro flash ? À priori, non pas encore. Le système est encore à tester. Et puis le référencement de ce type de site restera toujours plus difficile et moins prévisible. Finalement à moins d'avoir un joli site en Flash avec beaucoup de texte, l'indexation des site Flash avec toutes leurs belles gugusses, images, video, et animation n'est pas encore tâche facile.
Vendredi, 30 mai 2008
Le petit larousse du webmaster made in google
Google a récemment mis en ligne une wiki pour webmaster regroupant les bonnes pratiques du web, les langages CSS, HTML, JAVASCRIPT, et bien d'autres.
Bien sur il y a beaucoup d'autres ressource sur le net sur le même sujet. Pas besoin de nommer Wikipedia et devGuru. Google a un petit plus : Il est possible de trouver les renseignements mais également des codes source déjà programmés via googleCode.
On trouvera également pour chaque propriété ou balise sa compatibilité IE (6, 7, 8) ainsi que Firfeox (2 et 3). Une petite avance par rapport aux autres du fait que IE8 et Firefox 3 ne sont pas encore totalement disponible ou en version beta.
Deplus étant un wiki, chacun pourra y mettre du sien pour améliorer la chose.
Lundi, 26 mai 2008
Réflexion sur la société
Nous sommes généralement encastré dans un mode de pensée plus ou moins identique aux autres personnes. Nous sommes, dès notre jeune âge, conditionnés à penser d'une certaine manière et beaucoup d'entre nous resterons conditionnés jusqu'à la fin de leur vie. C'est un phénomène moins... apparent (pour ne pas dire moins présent) chez les québécois. Nous sommes souvent vus par les autres nations comme une petite province inventive mais nous restons tout de même, relativement "conditionnés". Vous aurez probablement l'impression que c'est une remarque négative mais je la vois plutôt d'un côté positif. Une société qui pense en général de la même façon pour la base, est un avantage. Imaginez seulement si la moitié de la population décidait que les piétons devraient marcher dans la rue et les automobiles rouler sur les trottoirs... Vous avez probablement une image de ce que j'essaie d'exprimer et je viens vous parler en fait aujourd'hui d'un "bug" qui nous a longtemps suivi et qui, à cause de ce conditionnement, n'a jamais été réglé.
Je parle du pot de beurre d'arachide. Combien de fois vous êtes vous salis les mains en essayant d'aller chercher le beurre dans le fond du pot? Le problème ne se limite pas seulement au beurre d'arachide mais il est un bon exemple je crois. Le pot (qui est seulement au stade design, donc pas encore en production) ressemble à notre pot d'arachide bien ordinaire mais avec une ouverture dans le bas en plus. Voici le lien qui pointe sur Sherwood Forlee.
Le problème est pourtant relativement simple, mais nous sommes tellement habitués à utiliser un pot "défectueux" que régler le "bug" ne nous a jamais traversé l'esprit (du moins, pas assez pour le régler!).
publié par Pierre Paul Lefebvre
Vendredi, 16 mai 2008
Après "Ingénieur informaticien" place aux intégrateurs
En sautant de blog en blog à la recherche désespérée d’un magazine spécialisé pour les intégrateurs je me suis retrouvée à écouter ceci.
Reste que le site n’est lui-même pas valide css (l’opacity c’est pour CSS3 – on y croit !)
J’ai tout de même trouvé quelques site intéressant pour les intégrateurs et trices de ce monde qui se sentent délaissés :
pulsearts
css4design
smashingmagazine
je garde le meilleur pour la fin :
les integristes
et pour ceux qui ont toujours rêver d'expliquer ce qu'on fait au travail :
Mon métier éxpliqué à ma maman
Mercredi, 27 février 2008
Évaluations de sites Web de pharmacies : partie 2 de 4
En 2e partie de l'évaluation des sites Web des bannières de pharmacie au Québec au niveau du design et de l'ergonomie, voici un volet un peu plus technique.
J'aime beaucoup le guide des bonnes pratiques Opquast (www.opquast.com). C'est un outil très intéressant et puissant pour évaluer la qualité d'un site Web. Un sous ensemble de 20 bonnes pratiques sous les rubriques accessibilité, code, formulaires, page d'accueil, navigation, URL, hyperliens et titres permettent de bien évaluer la qualité technique d'un site Web.
Notre échantillon : Jean-Coutu, Uniprix, Pharmaprix, Familiprix, Proxim et Brunet.
RESPECT DES NORMES ET BONNES PRATIQUES

www.uniprix.com
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Non respectée. Les images de la page carrières n'ont pas le texte alternatif.
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (px) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Conforme.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, la case code postale devrait utiliser une balise « label » plutôt que la balise « p » . Cela dit, les balises « label » ont été utilisées dans le cas d'une case à cocher ce qui est très bien.
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Conforme.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Conforme. Le site utilise les balises « h1 » et « h2 » .
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non applicable
HYPERLIENS
Le soulignement est réservé aux hyperliens : Conforme.
Les hyperliens sont visuellement différenciés du reste du contenu : Conforme.
Tous les hyperliens internes du site sont valides : Conforme.
Les hyperliens texte visités et non visités sont différenciés : Conforme. Changement de couleur!
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Conforme.
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Conforme. Il y a un changement visuel dans les menus nous permettant de déduire la position de la page dans la structure du site. Cela dit, un fil d'Ariane serait beaucoup plus efficace.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Le site de propose pas de page 404 personnalisée.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Non respectée. 122K
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Conforme.
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme
Les URL internes du site ne contiennent pas d'espaces : Conforme

www.brunet.ca
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Non respectée. Les images de la page d'accueil n'ont pas le texte alternatif.
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (px) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Conforme.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, la case de recherche devrait utiliser une balise « label » plutôt que la balise « p » . Cela dit, les balises « label » ont été utilisées dans le formulaire de renouvellement de prescription ce qui est excellent.
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Conforme. Il faudrait par contre que cette balise « meta » apparaisse avant la balise « title » pour que le titre de la page soit supporté par le même jeu de caractères.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Conforme.
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non respectée. Le formulaire de question à un pharmacien ne respecte pas cette bonne pratique. Par contre, le formulaire de renouvellement de prescription le respecte.
HYPERLIENS
Le soulignement est réservé aux hyperliens : Non applicable. Le soulignement n'est pas utilisé.
Les hyperliens sont visuellement différenciés du reste du contenu : Conforme.
Tous les hyperliens internes du site sont valides : Conforme.
Les hyperliens texte visités et non visités sont différenciés : Non respectée.
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Conforme.
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Non respectée. L'utilisation d'un fil d'Ariane aiderait à la navigation.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Le site ne propose pas de page 404 personnalisée.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Conforme. 59K
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Non respectée. Toutes les pages ont le même titre soit « Brunet ».
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme.
Les URL internes du site ne contiennent pas d'espaces : Conforme.

www.jeancoutu.com
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Conforme
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (px) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Conforme. Les liens dans les animations Flash ne sont pas disponibles avec le clavier seulement.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, le formulaire de renouvellement de prescription devrait utiliser des balises « label » plutôt que des balises « span » .
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Conforme.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Non respectée. Le site utilise la balise « h2 » mais devrait utiliser « h1 » et « h3 » à la place de « strong »
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non respectée. Dans le formulaire de renouvellement de prescription, on connait les champs obligatoires seulement lorsqu'on soumet nos informations et que le formulaire est validé par le serveur.
HYPERLIENS
Le soulignement est réservé aux hyperliens : Non applicable. Le site n'utilise pas le soulignement.
Les hyperliens sont visuellement différenciés du reste du contenu : Non respecté. Ce n'est pas toujours évident comme dans le cas du lien « Cliquez ici » dans la page de renouvellement d'ordonnance. Au premier coup d'oeil, le texte et le lien sont similaires.
Tous les hyperliens internes du site sont valides : Conforme.
Les hyperliens texte visités et non visités sont différenciés : Non respectée. Il faut idéalement faire un changement de couleur, permettant au visiteur de savoir s'il a déjà visité la page ou non.
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Conforme. Il faut faire attention aux liens du style « Cliquez ici » car dans une liste de liens internes, tous les liens « Cliquez ici » seraient ambigus.
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Non respectée. La présence d'un fil d'Ariane aiderait la navigation.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Au moins, le site présente une page 404 personnalisée qui permet de revenir vers la page d'accueil.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Non respectée. Plus de 300K.
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Conforme.
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme
Les URL internes du site ne contiennent pas d'espaces : Conforme

www.pharmaprix.ca
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Non respectée. Les images de la page d'accueil n'ont pas le texte alternatif.
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (px) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Conforme.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, le champ Recherche devrait avoir une balise « label » associée à la case.
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Non respectée.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Non respectée. Le site n'utilise pas les balises « h1 » et « h2 » .
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non applicable
HYPERLIENS
Le soulignement est réservé aux hyperliens : Conforme.
Les hyperliens sont visuellement différenciés du reste du contenu : Conforme.
Tous les hyperliens internes du site sont valides : Conforme.
Les hyperliens texte visités et non visités sont différenciés : Non respectée. Un changement de couleur serait utile.
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Non respectée. Le site utilise à quelques reprises des libellés de type « Cliquez ici »
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Non respectée. L'ajout d'un fil d'Ariane aiderait à la navigation.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme. En cliquant sur le logo. L'ajout d'un lien « Accueil » en texte serait bien.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Le site ne propose pas de page 404 personnalisée.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Non respectée. 116K.
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Conforme.
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme
Les URL internes du site ne contiennent pas d'espaces : Conforme

www.familiprix.com
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Non respectée. Un non voyant ne pourra pas faire la différence entre la publicité du centre photo, celle du CAA et les logos d'Opération Enfant Soleil et d'Apotex
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (pt) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Non respectée. Les liens « Lire la suite » et « Archives » sur la page d'accueil ne fonctionne qu'avec la souris.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, la case recherche devrait utiliser une balise « label » plutôt que la balise « span » .
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Non respectée.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Non respectée. Le code source ne contient aucune balise de titre. Tous les titres sont en « span »
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non applicable
HYPERLIENS
Le soulignement est réservé aux hyperliens : Conforme. Certains liens utilisent le soulignement, d'autres non...
Les hyperliens sont visuellement différenciés du reste du contenu : Non respecté. Les liens dans la liste de maladies ressemblent étrangement aux titres dans les fiches de maladies.
Tous les hyperliens internes du site sont valides : Conforme
Les hyperliens texte visités et non visités sont différenciés : Non respectée. Il faut idéalement faire un changement de couleur, permettant au visiteur de savoir s'il a déjà visité la page ou non.
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Conforme. Il faut faire attention aux liens du style « Lire la suite » car dans une liste de liens internes, tous les liens « Lire la suite » seraient ambigus.
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Non respectée. La présence d'un fil d'Ariane aiderait la navigation.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme. En cliquant sur le logo Familiprix dans la barre de menu. Il serait tout de même idéal d'avoir un lien texte « Accueil » quelque part.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Le site n'a pas de page 404 personnalisée.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Non respectée. 128K.
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Non respectée. Toutes les pages présentent le même titre. Un titre personnalisé est pratique pour les pages pour impression mais également pour améliorer le référencement.
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme
Les URL internes du site ne contiennent pas d'espaces : Conforme

www.essaim.ca
ACCESSIBILITÉ
Le contenu alternatif de toutes les images est correctement indiqué : Non respectée. Les images de la page d'accueil n'ont pas le texte alternatif.
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe : Non respectée. Utilisation du (px) plutôt que le pourcentage (%) ou (em)
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier : Non respectée. Le menu est construit à partir du JavaScript.
Le site n'emploie pas la technique des frames : Conforme.
Chaque champ de formulaire est associé à une étiquette qui lui est propre : Non respectée. Par exemple, le formulaire de contact devrait utiliser des balises « label » plutôt que mettre le contenu directement dans des balises « td » .
CODE
Le code source des pages contient les informations relatives au jeu de caractères employé : Conforme.
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée : Non respectée. Le site n'utilise pas les balises « h1 » à « h6 » .
FORMULAIRES
Les champs obligatoires des formulaires sont indiqués : Non respectée. Le formulaire de contact dans la page Nous Joindre n'indique pas les champs obligatoires.
HYPERLIENS
Le soulignement est réservé aux hyperliens : Conforme.
Les hyperliens sont visuellement différenciés du reste du contenu : Conforme.
Tous les hyperliens internes du site sont valides : Non respectée. Lorsque je suis dans une fiche de maladie dans l'encyclopédie médicale, avec Firefox, certains menus ne fonctionnent plus. De plus, certains liens ne fonctionnent plus dans la section Liens Pratiques.
Les hyperliens texte visités et non visités sont différenciés : Non respectée. Un changement de couleur serait nécessaire.
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe : Non respectée. L'utilisation de liens du style « Cliquez ici » n'est pas une bonne pratique, à moins que l'attribut « title » soit spécifié.
NAVIGATION
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site : Non respectée. L'ajout d'un fil d'Ariane améliorerait la navigation.
Il est possible de revenir à la page d'accueil depuis toutes les pages : Conforme.
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée : Non respectée. Le site ne propose pas de page 404 personnalisée.
PAGE D'ACCUEIL
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko : Non respectée. Plus de 400K.
TITRE
Chaque page comporte un titre significatif et représentatif de son contenu : Non respectée. Toujours le même titre sur toutes les pages : « Proxim – Votre destination bien-être »
URL
L'adresse du site fonctionne avec ou sans préfixe www : Conforme.
Les URL internes du site ne contiennent pas d'espaces :Conforme.
Pour ce qui est du respect des standards du W3C, aucun site ne respecte leur spécification HTML ou XHTML et seulement Jean-Coutu et Familiprix respecte la spécification CSS.
Jean-Coutu, Uniprix et Brunet font une bonne utilisation de la technologies CSS pour la conception de leurs pages Web. Les 3 autres utilisent des tableaux pour la mise en page de leur information ce qui constitue une mauvaise pratique.
Mercredi, 5 décembre 2007
Les mythes et réalités de l'accessibilité Web
Extrait du livre "Créer des sites Web accessibles à tous" d'Alexandre Afchain et Julien Lancereaux.
Un site Web accessible permet à n'importe quelle personne d'y accéder de façon équivalente, quels que soient :
- le navigateur (explorer, firefox, safari...)
- l'interface (clavier, souris...)
- la plate-forme (Windows, Mac OS, Linux...)
- Le périphérique d'affichage (écran 17 pouces, portable, cellulaire...)
- L'aide technique (loupe d'écran, plage braille, synthèse vocale...)
Peu connue du grand public, l'accessibilité est souvent mal comprise. Démystifions les mythes :
"L'accessibilité ne sert qu'à peu de personnes, elle est donc inutile."
Si l'on pense qu'elle est utile uniquement pour les personnes handicapées, il est évident que cela réduit le nombre de personne concernée. Un site accessible est accessible à tous, personne handicapée ou non! De plus, la mise en place de cette technique dans un site Web améliore le référencement de celui-ci sur les moteurs de recherche.
"L'accessibilité est difficile à mettre en place."
Peu connue, l'accessibilité effraie les entreprises Web qui imaginent devoir embaucher un super spécialiste qui coûte cher. En réalité, se sont des normes simples à intégrer en amont! Garantie! Pensez-y, personne n'oblige un développeur Web à rendre son site parfaitement accessible dès le premier jour... Les normes peuvent être mises en place graduellement et facilement.
"Les personnes handicapées ne correspondent pas à mon marché. Ils ne visitent pas mon site."
Un site Web tend à être disponible à tous via les moteurs de recherche. Pourquoi alors limité celui-ci? Pourquoi ne pas augmenter son potentiel de client? Saviez-vous que la mobilité réduite accroît l'acte d'achat en ligne? Choisir l'accessibilité, c'est de faire le choix technique d'un référencement optimisé.
"L'accessiblité coûte cher."
Prenez par exemple un immeuble en construction. Si celui-ci prevoit avoir dans les années à suivres un ascenseur, le coût de cet ascenseur sera très relatif par rapport au coût global de la construction, simplement parce que l'accessibilité a été anticipée. En revanche, si vous décidez de placer cet ascenseur dans un vieux immeuble en rénovation, le coût de celui-ci sera beaucoup plus élevé.
Si l'accessibilité est prévue dès l'origine de la fonte du site Web, le coût est quasi nul. Par exemple, QuiboWeb inclu dans ses projets les normes d'accessibilités pour tous ses clients et ce, sans coûts supplémentaires. Cela fait partie de notre méthode de travail. Or, l'accessibilité augmente le potentiel de clients, ce qui est rend le retour sur investissement presqu'immédiat.
"L'accessibilité limite la création graphique."
En tant que designer Web, je peux vous affirmez que jamais je n'ai été limité dans mes créations graphiques à cause de la mise en place des normes d'accessibilité! Depuis l'utilisation des feuilles de style CSS, tout est possible!
"L'accessibilité n'est pas obligatoire, pourquoi se presser?"
Prendre un peu d'avance avant que la loi n'oblige à respecter des calendriers contraignants et intégrer en amot l'accessibilité de son site n'est pas incohérent pour un gestionnaire prévoyant.
De plus, la mise en application d'une méthodologie d'accessibilité Web touche plusieurs domaines :
- Sociaux et éthiques
- Techniques
- Économiques
- Politiques
Il est d'un intérêt moral et civique!
Pour en savoir plus :
accessibiliteweb.com
accessibiliteweb.org
w3qc.org/docs/accessibilite.html
braillenet.org
w3.org
w3.org/WAI/
e-accessibility.org
anysurfer.be/fr/
openweb.eu.org/accessibilite/
accessiweb.org
webaccessibilite.net
Lundi, 3 décembre 2007
Accessibles, les sites web au Québec?
L'organisme Accessibilité Web a lancé aujourd'hui les résultats de son étude sur l'accessibilité des 200 sites Web les plus consultés dans les canadiens français. Une étude similaire avait été faite en 2003 et on peut se rendre compte qu'il n'y a pas eu d'amélioration notable dans les 4 dernières années ce qui laisse amplement de place à l'amélioration.
Le W3Québec est fier d'avoir contribué financièrement pour la réalisation de cette étude, les problèmes d'accessibilités étant souvent étroitement liés au non respect des bonnes pratiques du Web, ce qui correspond en partie à la bataille que mène le W3Québec : Améliorer le Web au Québec!
De son côté, QuiboWeb a contribué à ce succès en offrant gracieusement le design graphique du site Web des résultats : Top 200 des sites Web accessibles au Québec. Ce geste démontre l'importance qu'a le respect des bonnes pratiques du Web pour QuiboWeb.
Les résultats de l'étude sont disponibles ici :
Résultats de l'évaluation 2007
Mercredi, 24 octobre 2007
Des application portable pour plus de facilités
Entre le bureau, les déplacements, la maison, il est souvent difficile d'avoir accès en tous temps et en tous lieux à ses courriels, ses favoris, ou encore ses contacts ou son agenda.
Pour remédier à cela il existe les applications portables. Ce sont des logiciels transportables sur support amovibles. Nul besoin de les installer sur votre postes vous les transporterez sur votre clé usb ou disque dur externe. On y retrouve des logiciels communs tels que Firefox, thunderbird, messagerie instantanée, lecteur mp3, openOffice, Gimp et bien d'autres !
De plus les plugins habituels de ses logiciels tels les calendriers, ou les modules complémentaires de firefox peuvent être ajoutés aux applications portables.
Cela n'a pas qu'un avantage pratique : en effet vous pourrez avoir accès en tout temps à vos logiciels mais dans le cas d'un problème informatique sur votre poste vos courriels et vos favoris internets ne seront pas affectés !
Voici quelques liens pour trouver les logiciels dont vous avez besoin :
Lundi, 24 septembre 2007
3 façons de valider l'accessibilité de votre design web
Il existe encore beaucoup trop de sites web ayant des problème d'accessibilité web relié à leur design. Qu'ils soient mineurs ou majeurs, ils se doivent d'être relevés et corrigés. Pourquoi? Il faut simplement penser aux gens atteints de daltonisme quelqu'en soit le type, les gens ayant une insuffisance visuelle qui pourraient avoir des problématiques de lisibilité, ou encore le type d'environnement ou de périphérique utilisé par l'utilisateur (écran désuet, réflections de lumières...) qui pourraient rendre difficile la lisibilité. Pour plus d'informations sur se sujet, je vous invite à visiter le site du WCAG (Web Content Accessibility Guidelines).
Je vous propose 3 tests rapides à faire afin d'augmenter l'accessibilité web de votre site web :
Colour Contrast Check
Cette outil vous indique si la couleur de fond et celle du texte sont assez contrasté.
Graybit
Cette outil permet d'afficher votre site web en version noir et blanc.
Color Filter
Cette outil affiche l'état visuel de votre site web du point de vue d'une personne daltonienne, et ce selon chaque type de daltonisme.
Amusez-vous!
Jeudi, 10 mai 2007
Dernière chance pour vous inscrire à la formation du W3Québec!
Formation de 6 heures sur HTML/CSS
donnée par le W3Québec.
Le formateur, Normand Lamoureux, est expert en accessibilité du Web et spécialiste en réadaptation en déficience visuelle à l'Institut Nazareth et Louis-Braille. L'un et l'autre volet du cours sera orienté accessibilité, standards et bonnes pratiques.
Cette formation sera présentée en 2 blocs de 3 heures, les mercredis 16 et 23 mai 2007, de 18h à 21h, à l'Université de Montréal.
Aperçu des contenus :
HTML
- HTML, le langage facile méconnu.
- Mythes et réalités à propos de HTML.
- HTML ou XHTML, telle n'est pas la question!
- Manifeste pour un balisage sémantique.
- Les avantages de séparer contenu, présentation et comportement.
CSS
- CSS, le casse-cou du développeur Web!
- Le véritable rôle de CSS par rapport à HTML.
- Bâtir une feuille CSS étape par étape.
- Trucs et astuces pour éviter les maux de tête et les hacks.
- Développement d'un projet concret visant à intégrer le tout (à préciser sur place).
Pour obtenir plus de détails et pour vous inscrire visitez : http://w3qc.org/formation/formation-html-css/
Faites vite, les places sont limitées!
Lundi, 2 avril 2007
Formation HTML/CSS - Accessible!
Formation de 6 heures sur HTML/CSS
donnée par le W3Québec.
Le formateur, Normand Lamoureux, est expert en accessibilité du Web et spécialiste en réadaptation en déficience visuelle à l'Institut Nazareth et Louis-Braille. L'un et l'autre volet du cours sera orienté accessibilité, standards et bonnes pratiques.
Cette formation sera présentée en 2 blocs de 3 heures, les mercredis 16 et 23 mai 2007, de 18h à 21h, à l'Université de Montréal.
Aperçu des contenus :
HTML
- HTML, le langage facile méconnu.
- Mythes et réalités à propos de HTML.
- HTML ou XHTML, telle n'est pas la question!
- Manifeste pour un balisage sémantique.
- Les avantages de séparer contenu, présentation et comportement.
CSS
- CSS, le casse-cou du développeur Web!
- Le véritable rôle de CSS par rapport à HTML.
- Bâtir une feuille CSS étape par étape.
- Trucs et astuces pour éviter les maux de tête et les hacks.
- Développement d'un projet concret visant à intégrer le tout (à préciser sur place).
Pour obtenir plus de détails et pour vous inscrire visitez : http://w3qc.org/formation/formation-html-css/
Faites vite, les places sont limitées!
Jeudi, 15 mars 2007
Parti vert vs Québec Solidaire - Qualité des sites Web
Suite à un intérêt évident à propos de ma première étude qui évaluait, selon le guide Opquast, la qualité des sites Web des 3 principaux partis politiques du Québec, je viens fermer le dossier en vous présentant l'évaluation des sites du Parti Vert et de Québec Solidaire. Il s'agit d'une évaluation en surface en utilisant le Guide de bonnes pratiques Opquast, en considérant le même sous-ensemble de bonnes pratiques que j'ai utilisé pour l'évaluation des 3 autres sites Web, soit environ 65% des bonnes pratiques listées dans le guide Opquast. Question de rendre cette chronique plus facile à lire, je présenterai seulement les points qui ne respectent pas la norme de l'industrie pour l'un ou l'autre des 2 sites évalués.
Je tiens à préciser que par cette étude, je ne prends aucune position pour un parti ou pour un autre. La politique n'étant pas mon domaine, c'est la qualité des sites Web qui me préoccupe.
Résumé
L'étude suivante peut être longue à lire. Le contenu est également très technique. Voici un court résumé des résultats en considérant que les responsables des sites Web des différents partis ont eu la chance d'apporter des modifications entre le moment de l'évaluation et l'instant même que vous lisez l'article.
Les résultats sont impressionnants, je rappelle pour fin de comparaison les notes qu'avaient obtenues les sites de l'ADQ, le PLQ et le PQ.
L'évaluation Opquast a donné les résultats suivants :
- ADQ : 47%
- PLQ : 57%
- PQ : 56%
- Parti Vert : 68%
- Québec Solidaire : 68%
Les sites du parti Vert et de Québec Solidaire sont tous les 2 conçus à l'aide du CMS (Content Management System - Outil de gestion de contenu) Open Source Drupal, tout comme le site du PQ. Contrairement aux 3 autres sites, l'utilisation des vidéos se fait plus modeste. Québec Solidaire utilise Youtube pour publier ses vidéos sur son site.
Le site du parti Vert est bilingue tandis que celui de Québec Solidaire est en français seulement. Les 2 sites montrent leur ouverture vers les nouvelles technologies par l'utilisation de blogues et d'outil Open Source.
Accessibilité
L'accessibilité numérique est un sujet très important, surtout pour des organismes politiques qui désirent rejoindre l'ensemble de la population. Ainsi, il est important que l'information des sites Web soit accessible pour les gens atteints d'un handicap, qu'il soit visuel ou autre. Les tests ont été faits à l'aide du navigateur Firefox muni de la barre d'outil Web Developer, Lori, Link Evaluator et FireBug le lundi jeudi 8 mars 2007 entre 9h et 12h. Il est possible que des changements aient été apportés après cette période.
Bonne pratique #1
Le contenu alternatif de toutes les images est correctement indiqué
Les 2 sites ne répondent pas à cette bonne pratique. Sur le site du parti Vert, il ne faut pas aller bien loin pour trouver le problème. Le logo ne contient pas de texte alternatif. Sur le site de Québec Solidaire, les images d'actualité de la page d'accueil ne présentent pas de contenu alternatif. Toutes images contribuant au contenu d'une page devraient présenter un texte alternatif pour permettre aux gens atteints de problème visuel de mieux interpréter l'information. Pour ce qui est des autres images, celles qui ne servent qu'à titre de présentation, on devrait les retrouver dans la feuille de styles et non pas dans le code XHTML.
Bonne pratique #13
Le code source des pages contient l'indication de la langue principale du contenu.
Le site du parti Vert ne respecte pas cette bonne pratique puisque dans la version anglaise du site, le code précise qu'il s'agit de contenu francophone ce qui n'est bien entendu pas le cas.
Bonne pratique #160
Le résumé des tableaux est correctement indiqué
Les 2 sites ne respectent pas cette bonne pratique. Le site de Québec Solidaire utilisent les tableaux dans des contextes ou le tableau n'est pas requis. L'utilisation d'un tableau doit être faite seulement pour présenter de l'information sous forme de ligne et de colonne. Il s'agit d'une mauvaise pratique d'utiliser le tableau comme d'un squelette de présentation pour le site ou une partie du site. Dans le cadre d'un tableau qui en ait vraiment un, il est important d'y insérer un résumé afin que les lecteurs d'écran soient en mesure de mieux faire comprendre l'aspect total du tableau avant d'en faire la lecture. Dans le cas du parti Vert, la page Calendrier est un exemple d'un cas où ils sont en faute.
Bonne pratique #2
Les pages du site satisfont au moins au niveau de conformité "A" des directives pour l'accessibilité aux contenus Web (WCAG) 1.0 du W3C
Les sites ne respectent pas le niveau 1 du WCAG (Web Content Accessibility Guidelines). Dès la page d'accueil, il est possible de recenser des erreurs avec le validateur.
Code
La qualité du code, la majorité des gens s'en balance. Par contre, avec un code de qualité, il est plus facile d'assurer une meilleure compatibilité dans les différents navigateurs et une meilleure pérennité des documents. De plus, il est possible que certains outils ne soient pas en mesure de lire l'information si le document en question ne respecte par la DTD qu'il utilise. Les navigateurs populaires ont dû développer une flexibilité au niveau de l'analyse du code car sinon, 98% des sites Web ne seraient par consultables puisqu'ils ne respectent pas leur DTD. Dans le cas des 2 sites de cette étude, le parti Vert a opté pour la DTD XHTML 1.0 Transitional et Québec Solidaire, d'une surdose d'intrépidité ;-) opte pour le XHTML 1.0 Strict qui est un peu plus contraignant.
Bonne pratique #149
Les technologies du W3C utilisées sur la page d'accueil le sont de manière conforme
Cette bonne pratique est facile à évaluer. Il s'agit simplement de passer la ou les pages du site dans les différents validateurs mis en place par le W3C. Dans ce cas ci, je n'ai eu besoin que des pages d'accueil pour pouvoir trancher la question. Les 2 sites présentent des erreurs au niveau du code XHTML, mais Québec Solidaire en a qu'une seule! Il arrive parfois que le validateur en échappe de sorte qu'en corrigeant cette erreur, d'autres pourront apparaîtrent.
- PVQ = 25 Erreurs
- QS = 1 Erreur
Il faut également valider les feuilles de styles et les 2 sites ont des erreurs à ce niveau là.
Fichiers en téléchargement
Un site Internet sert à partager de l'information, il est donc normal qu'on doive permettre à nos visiteurs de télécharger certains fichiers. Dans le cas des sites des partis politiques, il s'agit principalement de fichiers aux formats PDF, MP3 et MPG.
Bonne pratique #32
Le format (extension du fichier ou lecteur logiciel) des fichiers proposés en téléchargement est indiqué
Ici il faut prendre l'analyse avec un grain de sel. Il est possible que je n'aie pas bien vu toutes les pages des 2 sites mais il ne me suffit d'une seule erreur pour justifier de noter la non-conformité d'un site!
Seul le site du parti Vert est problématique. Par exemple, dans la section Médias, on peut voir un lien Dépliant de promotion qui est au format PDF mais rien ne l'indique. À ma grande surprise, et je dois avouer que j'ai trouvé ça très chouette, Québec Solidaire présente les fichiers dans un petit tableau en bas de page dans lequel on peut très bien voir le format et la taille du fichier à télécharger. Le parti Vert, utilisant le même CMS propose également ces petits tableaux mais pas de façon systématique...
Bonne pratique #34
La taille des fichiers proposés en téléchargement est indiquée
Comme je l'indique au point précédent, le site de Québec Solidaire gère très bien cette bonne pratique, dans la majorité des cas. Il est possible sur le site de Québec Solidaire de trouver des liens vers des fichiers PDF sans indication de la taille du fichier. Le site du parti Vert ne l'indique pas toujours non plus. Je dois tout de même féliciter l'effort dans la section Médias encore une fois pour la note : Attention 15 Mb!
Formulaires
Bonne pratique #38
Les champs obligatoires des formulaires sont indiqués
Rien de plus frustrant que de se faire dire par un site Web qu'on a omis de remplir certains champs d'un formulaire lorsque rien ne l'indiquait à l'étape précédente. Les sections pour faire un don sur le 2 sites, Don et adhésion sur le site du parti Vert et j'appuie - en ligne pour le site de Québec Solidaire. À la défense du parti Vert, celui-ci utilise un service Web GiftTool.com pour gérer les dons de sorte qu'ils n'ont peut être par le contrôle sur la conception totale du formulaire.
Hyperliens
Bonne pratique #45
Les URL des hyperliens pointant vers un répertoire et non vers une page en particulier se terminent par une barre oblique ("/")
Les 2 sites sont couplables ! Drupal présente les pages par Node... Vous pouvez d'ailleurs voir le mot node dans les URL des pages. Par défaut, il n'ajoute pas le / à la fin des liens. Voilà pourquoi les 2 sites ne respectent pas cette bonne pratique.
Bonne pratique #52
Les hyperliens texte visités et non visités sont différenciés
Les 2 sites affichent les liens de la même façon qu'ils aient été visités ou non. Il est pourtant pratique, même s'il s'agit d'une subtile nuance de couleur, de pouvoir différencier les pages qu'on a visitées et celles que nous n'avons pas visitées lorsqu'on navigue sur un site Web.
Bonne pratique #167
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe
Il faut être prudent avec les liens du type : En savoir plus ou Texte intégral! Ce genre de liens ne représentent pas bien l'information vers laquelle ils pointent. Il faut éviter le plus possible d'utiliser des liens dont le contexte donne plus d'information sur le lien que le lien lui-même. D'un point de vue du référencement, un lien du type "Lire la suite" n'ajoute rien à votre stratégie SEO (Search Engine Optimization).
Internationalisation
Bonne pratique #21
Les données financières sont exprimées dans une unité monétaire conforme à la norme internationale
Généralement classée sous la rubrique "Offre" par l'équipe d'Opquast, j'ai décidé de l'inscrire dans la section "Internationalisation" puisqu'il s'agit de la devise qui n'est pas présente sur aucun des 2 sites. Pour devenir membres d'un parti, vous devez cotiser. Les montants sont indiqués mais nul part c'est indiqué qu'il s'agit de dollars canadiens. C'est évident vous me direz... Je suis d'accord... mais si un brésilien voulait cotiser? Dans le cas du parti Vert, puisqu'ils utilisent GiftTool, on peut voir apparaître le code CAD. Malgré tout, dans quelques autres pages les montants ne sont pas accompagnés de la devise.
Bonne pratique #185
Le pays est précisé dans toutes les adresses postales
Qu'on soit séparatiste ou non, le pays est encore officiellement le Canada et aucun des 2 sites n'indique Canada dans les adresses postales. Il faut considérer que pour certaines personnes dans le monde, il est fort possible qu'ils ne sachent pas où c'est le Québec! En indiquant Canada dans les adresses qu'on publie sur nos sites Web, on met les chances de notre côté de mieux informer le visiteur mais également de réduire le nombre de demande par courriel qui ne sont pas justifiées à cause de la question de proximité géographique!
Bonne pratique #186
L'indicatif téléphonique du pays est précisé devant chaque numéro de téléphone
Québec Solidaire se fait prendre à ne pas préciser le 1- devant les numéros de téléphones... À la défense des Webmestres, j'ai pu constater que le numéro 1-800 ou 1-866 ou 1-888 était toujours spécifié avec le 1-. D'un point de vue théorique, il faut spécifier le 1- pour chaque numéro de téléphone pour s'assurer que celui-ci soit le plus complet possible et ainsi en faciliter son utilisation. Le parti Vert profite du fait qu'il publie sur son site Web seulement un numéro sans frais.
Multimédia et Plugins
Bonne pratique #79
Aucun objet multimédia de plus de 50 ko (image ou autre) n'est envoyé sans avertissement préalable, prévisualisation ou affichage progressif
Dans les 2 sites il est facile de trouver une image qui est envoyée automatiquement au navigateur du visiteur sans avertissement préalable dépassant la taille de 50K. Dans le cas du parti Vert, la photo de M. McKay pèse 66K et sur le site de Québec Solidaire dans la section Actualité, la photo de François Saillant pèse 85K.
Bonne pratique #76 et #77
#76 - Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, la taille du fichier à télécharger est précisée
#77- Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, un lien de téléchargement ou d'information sur ce dernier est proposé
Le parti Vert ne présente pas d'élément en Flash sur son site. Dans le cas de Québec Solidaire, je n'ai pas trouvé le lien pour télécharger la dernière version du "player" Flash. Dans le cas du "player" Flash, dans le code il y a moyen d'indiquer l'URL vers la page de téléchargement du plug-in. Il est par contre mieux de présenter un paragraphe d'information qui explique quels plugins sont nécessaires pour consulter le site, pour quelles raisons les documents sont disponibles dans ces formats et sur quels sites peut-on trouver les outils nécessaires pour la consultation des documents.
Navigation
Bonne pratique #62
Les hyperliens internes ne pointent pas vers des pages en construction
Sur le site du parti Vert, au moment de l'évaluation, le site présentait une section Album photos qui était en construction. Autres tâches d'entreprise obligent, j'ai été en mesure d'écrire cet article trop tard!
Bonne pratique #68
Si la totalité des pages du site n'est pas directement accessible depuis le menu de navigation, un plan du site est accessible depuis toutes les pages
Le site du parti vert est pris en défaut car il ne propose pas de plan du site. Quant à lui, le site de Québec Solidaire présente un plan du site très complet. Contrairement aux sites du PQ, PLQ et ADQ, les sites du parti Vert et de Québec Solidaire offre un moteur de recherche disponible sur chaque page.
Bonne pratique #44
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko
En cette période de campagne électorale, il est évident que la page d'accueil des sites des partis est sur utilisée! Aucun des 2 sites ne présente moins de 100K d'information.
Bonne pratique #151
Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée
Les 2 sites respectent la bonne pratique #82, soit d'afficher une page d'erreur 404 personnalisée. Le parti Vert par contre, n'affiche pas de menu sur cette page. En réalité, j'ai l'impression qu'il s'agit plus d'une page par défaut affichée par Drupal, donc une page sans contenu, plutôt qu'une page d'erreur 404...
URL
Bonne pratique #88
Les URL internes du site ne contiennent pas d'espaces
Sur le site du parti Vert, il est possible de trouver des liens vers des documents PDF dont le nom de fichier contient des espaces.
Bonne pratique #89
L'extension du nom de domaine (.com, .org, .net, etc.) est cohérente avec l'activité, la zone géographique couverte ou le statut de l'auteur
Le .net utilisé par Québec Solidaire n'est pas le meilleur choix. Un .qc.ca représente le côté géographique du parti ce qui est bien à mon avis et le .org dénote le côté organisation. Toute autre extension ne serait pas à propos dans le cas des sites évalués. Chose amusante et incompréhensible à la fois, Québec Solidaire a réservé le nom de domaine www.quebecsolidaire.org mais ils utilisent le .net par défaut... Pourquoi ?
Conclusion
Je suis étonné des résultats. Les partis politiques émergeants dépasse considérablement ses rivaux. Il est également amusant de voir que les 2 sites utilisent la même technologie et arrive à la même note. Le PQ utilise le même outil mais est assez loin derrière. C'est ce qui est intéressant avec le guide Opquast. Il s'agit de points assez techniques mais l'outil n'est pas tout, le contenu et la mise en page comptent pour beaucoup. Malgré son 68%, le site du parti Vert est très simpliste... trop peut être... D'un point de vue général, malgré les résultats des évaluations Opquast, les 2 sites les plus intéressants à utiliser et les plus complets sont les sites du PQ et de Québec Solidaire. J'ai bien hâte de constater qui gagnera la vraie bataille!
Lundi, 12 mars 2007
Formation HTML/CSS - Accessible!
Formation de 6 heures sur HTML/CSS
donnée par le W3Québec.
Le formateur, Normand Lamoureux, est expert en accessibilité du Web et spécialiste en réadaptation en déficience visuelle à l'Institut Nazareth et Louis-Braille. L'un et l'autre volet du cours sera orienté accessibilité, standards et bonnes pratiques.
Cette formation sera présentée en 2 blocs de 3 heures, les mercredis 21 et 28 mars 2007, de 18h à 21h, à l'Université de Montréal.
Aperçu des contenus :
HTML
- HTML, le langage facile méconnu.
- Mythes et réalités à propos de HTML.
- HTML ou XHTML, telle n'est pas la question!
- Manifeste pour un balisage sémantique.
- Les avantages de séparer contenu, présentation et comportement.
CSS
- CSS, le casse-cou du développeur Web!
- Le véritable rôle de CSS par rapport à HTML.
- Bâtir une feuille CSS étape par étape.
- Trucs et astuces pour éviter les maux de tête et les hacks.
- Développement d'un projet concret visant à intégrer le tout (à préciser sur place).
Pour obtenir plus de détails et pour vous inscrire visitez : http://w3qc.org/formation/formation-html-css/
Faites vite, les places sont limitées!
Mardi, 6 mars 2007
Chaude lutte "numérique" entre l'ADQ, le PLQ et le PQ
Pendant que les spécialistes en politique évaluent les différentes campagnes des 3 principaux partis politiques au Québec, l'équipe QuiboWeb, soucieuse des bonnes pratiques sur Internet s'est intéressée à évaluer les sites Web de l'Action démocratique du Québec, du Parti Libéral du Québec et du Parti Québécois. Il s'agit d'une évaluation en surface en utilisant le Guide de bonnes pratiques Opquast. Question de rendre cette chronique plus facile à lire, je présenterai seulement les points qui ne respectent pas la norme de l'industrie pour un ou plusieurs des 3 sites évalués.
Je tiens à préciser que par cette étude, je ne prends aucune position pour un parti ou pour un autre. La politique n'étant pas mon domaine, c'est la qualité des sites Web qui me préoccupe.
Résumé
L'étude suivante peut être longue à lire. Le contenu est également très technique. Voici un court résumé des résultats (profitez-en, c'est rare qu'on peut avoir les résultats dès le début... sauf peut-être avec les Canadiens ces temps ci!).
L'évaluation Opquast a donné les résultats suivants :
- ADQ : 47%
- PLQ : 57%
- PQ : 56%
Seulement 66% des bonnes pratiques du Guide Opquast ont été considérées.
Le site du PQ est plus complet, utilise du logiciel Open Source et encourage les partisans à participer. Il est par contre disponible en français seulement.
Le site de l'ADQ est bilingue mais offre peu d'information outre la liste des candidats et quelques communiqués de presse.
Le site du PLQ présente de l'information des les 2 langues à l'intérieur d'une même page qui est une mauvaise pratique car ça rend les pages plus lourdes.
Les 3 partis utilisent les vidéos, l'audio, les feuilles de styles, les options de partage ce qui montre une ouverture vers les nouvelles technologies.
Accessibilité
L'accessibilité numérique est un sujet très important, surtout pour des organismes politiques qui désirent rejoindre l'ensemble de la population. Ainsi, il est important que l'information des sites Web soit accessible pour les gens atteints d'un handicap, qu'il soit visuel ou autre. Malgré qu'il ait encore quelques problèmes, on dénote une nette amélioration en comparant avec les versions antérieures des sites des partis, principalement pour le Parti Québécois et le Parti Libéral. Les tests ont été faits à l'aide du navigateur Firefox muni de la barre d'outil Web Developer, Lori, Link Evaluator et FireBug le lundi 5 mars 2007 entre 9h et 12h. Il est possible que des changements aient été apportés après cette période.
Bonne pratique #1
Le contenu alternatif de toutes les images est correctement indiqué
Les 3 sites ne répondent pas à cette bonne pratique. Sur le site de l'ADQ, sur les fiches des candidats, la photo de ceux-ci ne présente pas de texte alternatif. Sur le site du PQ, les images de la page d'accueil, sauf les menus, ne présentent pas de contenu alternatif. Sur le site du PLQ, c'est également dans la section Équipe qu'on peut voir le problème. Toutes images contribuant au contenu d'une page devraient présenter un texte alternatif pour permettre aux gens atteints de problème visuel de mieux interpréter l'information. Pour ce qui est des autres images, celles qui ne servent qu'à titre de présentation, on devrait les retrouver dans la feuille de styles et non pas dans le code XHTML.
Bonne pratique #4
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe
Seul le site du parti Libéral respecte cette bonne pratique. Dans les 2 autres, la taille du texte est exprimée en Pixel (px) contrairement au site du parti Libéral qui utilise le EM, unité variable. Il est important de pouvoir modifier la taille des caractères pour permettre aux visiteurs atteints d'un problème visuel d'ajuster la grosseur du caractère pour bien voir l'information.
Bonne pratique #5
La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier
Maintenant, il s'agit de l'Action Démocratique du Québec qui respecte cette bonne pratique. Dans le cas du PLQ, il est impossible de consulter les différents communiqués de presse en utilisant seulement le clavier. Sur le site du PQ, c'est la zone Communiqués / Radio PQ / Agenda du chef / Événements de la page d'accueil qui pose problème. Cette zone utilise la technologie Ajax qui, très souvent, pose des problèmes d'accessibilité. De plus sur le site du PQ, les menus déroulant ne fonctionnent pas avec le clavier seulement.
Bonne pratique #13
Le code source des pages contient l'indication de la langue principale du contenu
Seul le site du PQ respecte cette bonne pratique. À la défense des 2 autres, j'ai l'impression que la seule raison pour laquelle le site du PQ la respecte est parce qu'il utilise le CMS (Content management system) Drupal.
Bonne pratique #160
Le résumé des tableaux est correctement indiqué
Les 3 sites ne respectent pas cette bonne pratique. En réalité, les 3 sites utilisent les tableaux dans des contextes ou le tableau n'est pas requis. L'utilisation d'un tableau doit être faite seulement pour présenter de l'information sous forme de ligne et de colonne. Il s'agit d'une mauvaise pratique d'utiliser le tableau comme d'un squelette de présentation pour le site ou une partie du site. Dans le cadre d'un tableau qui en ait vraiment un, il est important d'y insérer un résumé afin que les lecteurs d'écran soient en mesure de mieux faire comprendre l'aspect total du tableau avant d'en faire la lecture.
Bonne pratique #162
Chaque champ de formulaire est associé à une étiquette qui lui est propre
Une fois de plus, les 3 sites ne respectent pas cette bonne pratique. Il s'agit une fois de plus d'une bonne pratique favorisant la lecture par un lecteur d'écran car celui-ci sera en mesure de relier l'étiquette d'une case avec la case en tant que tel. L'autre avantage de cette bonne pratique, et je suis sûr que les utilisateurs d'Internet seront d'accords avec moi, c'est que dans le cas d'un "radio button" ou d'un "checkbox", en utilisant la balise "label" il devient possible de cocher et de décocher une case en cliquant sur l'étiquette de la case... Beaucoup plus efficace....
Bonne pratique #2
Les pages du site satisfont au moins au niveau de conformité "A" des directives pour l'accessibilité aux contenus Web (WCAG) 1.0 du W3C
Aucun des sites respecte le niveau 1 du WCAG (Web Content Accessibility Guidelines). Le site du PLQ présente une page d'accueil sans erreur en utilisant le validateur d'accessibilité mais il s'agit de choisir une autre page pour voir apparaître les problèmes. Dans le cas du PQ et de l'ADQ, dès la page d'accueil, il est possible de recenser des erreurs avec le validateur.
Code
La qualité du code, la majorité des gens s'en balance. Par contre, avec un code de qualité, il est plus facile d'assurer une meilleure compatibilité dans les différents navigateurs et une meilleure pérennité des documents. De plus, il est possible que certains outils ne soient pas en mesure de lire l'information si le document en question ne respecte par la DTD qu'il utilise. Les navigateurs populaires ont dû développer une flexibilité au niveau de l'analyse du code car sinon, 98% des sites Web ne seraient par consultables puisqu'ils ne respectent pas leur DTD. Dans le cas des 3 sites de cette étude, il s'agit de la DTD XHTML 1.0 Transitional.
Bonne pratique #16
Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée
Seul le site du PLQ respecte cette bonne pratique. Les 2 autres utilisent les balises DIV plutôt que les balises H1 à H6. Il est important d'utiliser les balises de la bonne façon afin d'améliorer la qualité sémantique du document. N'allez pas croire que le site du PLQ est parfait sur ce point ci. Plusieurs pages utilisent seulement la balise H1 et passe rapidement à l'utilisation des DIV.
Bonne pratique #149
Les technologies du W3C utilisées sur la page d'accueil le sont de manière conforme
Cette bonne pratique est facile à évaluer. Il s'agit simplement de passer la ou les pages du site dans les différents validateurs mis en place par le W3C. Dans ce cas ci, je n'ai eu besoin que des pages d'accueil pour pouvoir trancher la question. Les 3 sites présentent des erreurs au niveau du code XHTML.
- ADQ = 576 Erreurs
- PLQ = 57 Erreurs
- PQ = 250 Erreurs
Fichiers en téléchargement
Un site Internet sert à partager de l'information, il est donc normal qu'on doive permettre à nos visiteurs de télécharger certains fichiers. Dans le cas des sites des partis politiques, il s'agit principalement de fichiers aux formats PDF, MP3 et MPG.
Bonne pratique #32
Le format (extension du fichier ou lecteur logiciel) des fichiers proposés en téléchargement est indiqué
Ici il faut prendre l'analyse avec un grain de sel. Il est possible que je n'aie pas bien vu toutes les pages des 3 sites mais il ne me suffit d'une seule erreur pour justifier de noter la non-conformité d'un site!
Le site de l'ADQ est celui à mon avis qui présente l'erreur de façon plus flagrante. Le site propose plusieurs fichiers PDF en téléchargement mais jamais on indique avant de cliquer sur les liens qu'il s'agit de fichiers PDF. Sur le site du PLQ, je n'ai pas vu d'endroit ou le type de fichier n'était pas spécifié à côté du lien ou dans le texte présentant le lien. Le PLQ respecte donc cette bonne pratique. Dans le cas du PQ, je considère qu'il s'en tire pas trop mal mais le site est victime de lui-même du fait qu'il est beaucoup plus complet que les 2 autres et qu'il présente beaucoup plus d'information. Sur le site du PQ, dans la section Le Chef > Déclarations et discours, il est possible de télécharger des fichiers MP3 et MPG. Puisqu'il est indiqué Audio | Vidéo, le visiteur, sans avoir une idée précise du format des fichiers, il sait tout de même qu'il s'agit d'un son ou d'une vidéo... C'est la raison pour laquelle le PQ s'en tire pas trop mal malgré tout.
Bonne pratique #33
Les fichiers en téléchargement sont proposés dans au moins un format dont les spécifications sont publiques
Encore une fois, le PQ est victime du fait que son site est plus complet que les 2 autres. Puisque celui-ci présente des fichiers audio et vidéo aux format MP3 et MPG, ce que les 2 autres ne font pas, celui-ci ne respecte pas la bonne pratique #33 qui dit que le fichier doit être disponible dans un format dont les spécifications sont publiques. Dans le cas du MP3, le OGG serait l'équivalent public... Qui connaît les OGG? Les mordus de l'Open Source!
Bonne pratique #34
La taille des fichiers proposés en téléchargement est indiquée
Sur aucun site, la taille des fichiers proposés en téléchargement est indiquée. Il est pourtant pratique pour un utilisateur d'une connexion Internet à faible débit de savoir dans quoi il s'embarque avant de cliquer sur un lien pour télécharger une vidéo ou un document volumineux!
Formulaires
Bonne pratique #36
En cas de rejet des données saisies dans un formulaire, les champs contenant les données rejetées sont indiqués à l'utilisateur
Seul le site de l'ADQ ne respecte pas cette bonne pratique car le programme PHP derrière le formulaire Partagez ce site contient une erreur aux niveaux du traitement des données. Lorsque vous cliquez sur le bouton Envoyez du formulaire sans remplir aucune case, plutôt que d'indiquer que certaines cases étaient obligatoires, le script PHP plante et présente un message d'erreur cryptique pour M. et Mme. tout le monde!
Bonne pratique #37
En cas de rejet des données saisies dans un formulaire, toutes les données saisies peuvent être modifiées par l'utilisateur
Pour les mêmes raisons que pour la bonne pratique #36, le site de l'ADQ ne passe pas ce critère non plus. De son côté, le PLQ dans sa section Impliquez-vous présente un formulaire pour devenir membre du parti. Si vous indiquez vos informations dans le formulaire mais que vous oubliez une case obligatoire, le site vous présentera le nom de la case que vous avez oubliée ainsi qu'un lien "Cliquez ici pour revenir au formulaire"... Autant utiliser le bouton précédent de votre navigateur car le lien vous retournera vers un formulaire vide et vous devrez spécifier toutes vos informations à nouveau! Pour sa part, le PQ ne semble pas présenter de problème à ce niveau ci.
Bonne pratique #38
Les champs obligatoires des formulaires sont indiqués
Rien de plus frustrant que de se faire dire par un site Web qu'on a omis de remplir certains champs d'un formulaire lorsque rien ne l'indiquait à l'étape précédente. C'est une situation probable sur le site du PQ dans la section Participez! > Convaincre un ami . Aucun champ n'est marqué comme obligatoire mais en réalité ils le sont tous... sauf les multiples cases de Courriel ami... bref ils le sont pas tous... autant indiquer lesquels le sont!
Hyperliens
Bonne pratique #45
Les URL des hyperliens pointant vers un répertoire et non vers une page en particulier se terminent par une barre oblique ("/")
Seulement le site du PLQ ne respecte pas cette bonne pratique à cause du lien "Où voter" disponible dans la marge de gauche.
Bonne pratique #47
Les hyperliens sont visuellement différenciés du reste du contenu
Je déclare les 3 sites non conformes même si le site du PQ devrait passer le test. Ce que je reproche au site du PQ est que la couleur qu'ils ont utilisée pour les liens est un bleu difficile à différencier du noir du texte. On peut également remarquer une tendance : les partis politiques n'aiment pas les liens soulignés! Il s'agit pourtant de la meilleure façon de représenter un lien. Je peux comprendre pour des questions esthétiques que ne veule pas souligner un lien dans un menu. Cependant, trop souvent on souligne les adresses courriel mais on ne souligne pas les autres liens. Une autre chose que j'ai remarqué c'est l'utilisation du JavaScript dans les sections d'actualité des sites. Il s'agit donc de liens sans vraiment en être car si on clique sur un résumé d'une nouvelle, un script JavaScript va nous mener vers la version complète du texte.
Bonne pratique #48
Tous les hyperliens internes du site sont valides
Seul le site du PQ ne respecte pas cette bonne pratique. Il s'agit ici d'une erreur grave. Pour trouver les liens erronés sur le site du PQ il suffit de visiter la section Participez! - Survol . Cette page présente différents paragraphes d'information dont les titres sont des liens. Si vous cliquez sur un titre, vous aurez une erreur 404, page non trouvée.
MAJ 2007-03-08 : Le PQ a réglé ce problème... Bravo!
Bonne pratique #52
Les hyperliens texte visités et non visités sont différenciés
Les 3 sites affichent les liens de la même façon qu'ils aient été visités ou non. Il est pourtant pratique, même s'il s'agit d'une subtile nuance de couleur, de pouvoir différencier les pages qu'on a visitées et celles que nous n'avons pas visitées lorsqu'on navigue sur un site Web.
Bonne pratique #167
Le libellé des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe
Il faut être prudent avec les liens du type : Voir la suite, lire la suite ou tout simplement suite! Ce genre de liens ne représentent pas bien l'information vers laquelle ils pointent. Il faut éviter le plus possible d'utiliser des liens dont le contexte donne plus d'information sur le lien que le lien lui-même. D'un point de vue du référencement, un lien du type "Lire la suite" n'ajoute rien à votre stratégie SEO (Search Engine Optimization).
Internationalisation
Bonne pratique #21
Les données financières sont exprimées dans une unité monétaire conforme à la norme internationale
Généralement classée sous la rubrique "Offre" par l'équipe d'Opquast, j'ai décidé de l'inscrire dans la section "Internationalisation" puisqu'il s'agit de la devise qui n'est pas présente sur aucun des 3 sites. Pour devenir membres d'un parti, vous devez cotiser. Les montants sont indiqués mais nul part c'est indiqué qu'il s'agit de dollars canadiens. C'est évident vous me direz... Je suis d'accord... mais si un brésilien voulait cotiser?
Bonne pratique #185
Le pays est précisé dans toutes les adresses postales
Qu'on soit séparatiste ou non, le pays est encore officiellement le Canada et aucun des 3 sites n'indique Canada dans les adresses postales. Il faut considérer que pour certaines personnes dans le monde, il est fort possible qu'ils ne sachent pas où c'est le Québec! En indiquant Canada dans les adresses qu'on publie sur nos sites Web, on met les chances de notre côté de mieux informer le visiteur mais également de réduire le nombre de demande par courriel qui ne sont pas justifiées à cause de la question de proximité géographique!
Bonne pratique #186
L'indicatif téléphonique du pays est précisé devant chaque numéro de téléphone
Une fois de plus, les 3 sites se font prendre à ne pas préciser le 1- devant les numéros de téléphones... À la défense des Webmestres, j'ai pu constater que le numéro 1-800 était toujours spécifié avec le 1-. D'un point de vue théorique, il faut spécifier le 1- pour chaque numéro de téléphone pour s'assurer que celui-ci soit le plus complet possible et ainsi en faciliter son utilisation.
Moteur de recherche
Bonne pratique #60
Si le site comporte plus de 15 pages de contenu textuel, un moteur de recherche interne est accessible depuis toutes les pages
Tous les sites comportent plus de 15 pages mais aucun ne présente de moteur de recherche. Dans le cas du PQ, je ne comprends pas pourquoi le moteur de recherche disponible avec Drupal n'est pas affiché sur le site. Celui-ci serait vraiment très pratique étant donné la quantité impressionnante d'information qu'on peut trouver sur ce site.
Multimédia et Plugins
Il est possible rapidement de voir une nouvelle mode sur l'Internet. La mode des vidéos! Les 3 sites présentent des vidéos de leur chef ou de ministres répondant à des questions du peuple etc.. La vidéo est un médium enrichi mais son utilisation apporte des considérations techniques supplémentaires au niveau de la conception du site Web.
Bonne pratique #76 et #77
#76 - Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, la taille du fichier à télécharger est précisée
#77- Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, un lien de téléchargement ou d'information sur ce dernier est proposé
Sur aucun des sites j'ai trouvé le lien pour télécharger la dernière version du "player" Flash. Je n'ai pas trouvé non plus le lien vers Acrobat Reader pour les fichiers PDF. Dans le cas du "player" Flash, dans le code il y a moyen d'indiquer l'URL vers la page de téléchargement du plug-in ce que les 3 sites font. Il est par contre mieux de présenter un paragraphe d'information qui explique quels plugins sont nécessaires pour consulter le site, pour quelles raisons les documents sont disponibles dans ces formats et sur quels sites peut-on trouver les outils nécessaires pour la consultation des documents.
Bonne pratique #79
Aucun objet multimédia de plus de 50 ko (image ou autre) n'est envoyé sans avertissement préalable, prévisualisation ou affichage progressif
Dans les 3 sites il est facile de trouver une image ou un fichier Flash qui est envoyé automatiquement au navigateur du visiteur sans avertissement préalable. Dans le cas du PLQ, il suffit d'aller dans la page Bien gérer votre argent où on y présente plusieurs graphiques en image de plus de 50K chaque.
Navigation
Bonne pratique #62
Les hyperliens internes ne pointent pas vers des pages en construction
Le site du PLQ est coupable... La page Plan du site indique Prochainement en ligne...
Bonne pratique #65
Les icônes de navigation sont accompagnées d'une légende explicite
Les sites de l'ADQ et du PQ ne respectent pas cette bonne pratique. Les 2 sites utilisent des images pour la présentation de leurs menus. Il est idéal d'utiliser l'attribut "title" de la balise A en plus de spécifier un texte alternatif sur l'image pour permettre aux gens qui ne voient pas, d'associer un texte au lien mais également un texte à l'image utilisée pour représenter le lien. Sur le site du PLQ, les menus sont textuels.
Bonne pratique #67
L'ordre de présentation des rubriques de navigation est identique sur toutes les pages
Je reproche au site du PLQ de ne pas respecter cette bonne pratique car dans la section "Notre programme", le site ne propose plus le menu principal qui est disponible sur l'ensemble des autres pages du site. La section "Notre programme" est donc considérée comme un micro-site à l'intérieur du site du parti mais je trouve que ça rend la navigation un peu plus difficile.
Bonne pratique #68
Si la totalité des pages du site n'est pas directement accessible depuis le menu de navigation, un plan du site est accessible depuis toutes les pages
Aucun des 3 sites ne propose de plan du site. Le site du PLQ semble sensible à l'idée d'en proposer un mais celui-ci est présentement en construction. Dans le cas du PQ, bien que les menus déroulant soient une mauvaise pratique pour l'accessibilité, ceux-ci donnent accès à l'ensemble du contenu du site ce qui veut dire que la mise en place d'un plan du site est moins nécessaire pour eux.
Bonne pratique #72
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site
Aucun des 3 sites ne présente de fil d'ariane... Oui oui, un fil d'ariane... Vous savez cette série de liens du style : Vous êtes ici : Accueil - Notre équipe - Mario Dumont . Seul le site du PQ présente une façon graphique de savoir où on se retrouve sur le site en ajoutant une petite flèche dans le menu du haut et en mettant en gras la section courante de le sous-menu de gauche. Pour les 2 autres, ne laissez surtout pas votre navigateur sur une page pendant que vous quittez pour aller prendre un café. À votre retour, rien ne vous indiquera où vous étiez rendu sur le site.
Bonne pratique #78
Sauf avertissement préalable, la quantité de données à télécharger pour afficher une page est inférieure à 150 Ko
Les pages types des sites Web de l'ADQ et du PQ dépasse de justesse le 150K prescrit par le guide Opquast.
- ADQ = 152K
- PLQ = 30K
- PQ = 160K
Bonne pratique #44
La quantité de données à télécharger pour afficher intégralement la page d'accueil est inférieure à 100 Ko
En cette période de campagne électorale, il est évident que la page d'accueil des sites des partis est sur utilisée! Aucun des 3 sites ne présente moins de 100K d'information.
- ADQ = 300K
- PLQ = 245K
- PQ = 400K
Bonne pratique #151 et #82
#151 - Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée
# 82 - Le serveur envoie une page d'erreur 404 personnalisée
Il s'agit pourtant d'une fonctionnalité intéressante et importante. Elle sera d'autant plus importante à la fin des élections lorsque les différents acteurs voudront effacer toute trace des promesses faites au courant de la campagne électorale (Joke plate de citoyen LOL!) puisque les liens provenant des résultats de recherche de Google tomberont sur des pages inexistantes! Vous comprendrez rapidement que le fait de ne pas respecter la bonne pratique #82 implique automatiquement le non-respect de la #151.
Pop-ups
AH les pop-ups... Invention sur utilisée, maintenant presque tout le monde a un dispositif pour les éviter! Pourquoi continuer des utiliser? Seul le site de l'ADQ a recours au Pop-ups.
Bonne pratique #155
Si le site impose des pop-ups, celles-ci n'apparaissent qu'une seule fois
Cette bonne pratique a pour objectif de sévir pour les sites qui utilisent des pop-ups et plus vous cliquez, plus ouvrez de nouvelles fenêtres... Pour les amateurs de la barre des tâches camouflées, il faut attendre que l'ordinateur devienne lent avant de se rendre compte qu'on a 200 pages ouvertes! Sur le site de l'ADQ, il y a 2 pages qui s'ouvrent en pop-ups et les 2 s'ouvrent dans une fenêtre différente : Partagez ce site et Envoyez un commentaire (dans la fiche d'un candidat).
Bonne pratique #156
Si le site impose des pop-ups, celles-ci contiennent un bouton fermer
Je crois que la bonne pratique est claire... Dans le cas de l'ADQ, le bouton ou le lien Fermer n'y ait pas.
Titres
Les titres sont très importants pour les questions de référencement. Une page avec un titre non pertinent sera moins intéressant dans une liste de résultat de Google. Dans une liste de résultats de recherche Google, si vous avez le lien suivant : Nouvelle Page 1 ou le lien suivant : Action démocratique du Québec - Contactez-nous , lequel des 2 résultats allez-vous choisir?
Bonne pratique #86
Chaque page comporte un titre significatif et représentatif du contenu du site
Dans le cas du site de l'ADQ, à un seul endroit j'ai pu voir une faiblesse... La page Contactez-nous a pour titre : adqaction.com .
URL
Bonne pratique #89
L'extension du nom de domaine (.com, .org, .net, etc.) est cohérente avec l'activité, la zone géographique couverte ou le statut de l'auteur
Dans le cas de l'ADQ, l'adresse www.adq.qc.ca qui est conforme à la bonne pratique #89 redirige vers www.adqaction.com . Même si le .com est considéré l'extension par défaut par M. et Mme. tout le monde, celui-ci ne correspond pas du tout pour un parti politique. Un .qc.ca représente le côté géographique du parti ce qui est bien à mon avis et le .org dénote le côté organisation. Toutes autres extensions autres ne seraient pas à propos dans le cas des 3 sites évalués à mon avis.
Conclusion
Je dois féliciter les 3 partis pour les efforts investis sur leur site Web. Le PQ semble être celui qui profite le plus du Web en incitant ses partisans à faire circuler la bonne parole sur les blogs, forum etc... De plus, le PQ utilise Drupal, un CMS Open Source très populaire pour la mise à jour de son site et WordPress, un outil de carnet Web également Open Source pour la mise à jour de son blogue. Les 3 partis tirent profit du vidéo sur le Web ce qui montre une ouverture au progrès. Les 3 sites utilisent les feuilles de styles pour la majorité des détails de mise en page. Les 3 partis se livrent une chaude lutte qui se terminera dans 20 jours!
Mardi, 6 février 2007
Est-ce que votre site Web est accessible?
Il y a quelques années, les propriétaires de site Web se préoccupaient d'avantage d'avoir un site qui accroche l'oeil soit par un design très illustré ou par l'utilisation d'animation Flash. De nos jours, ceux-ci se préoccupent d'avantage de la question de référencement dans les moteurs de recherche. Bientôt, ils seront également sensibles aux questions d'accessibilité. Pourquoi? À quoi bon faire un site pouvant être consulté par les personnes ayant des difficultés visuelles? C'est simple! Les robots des différents moteurs de recherche sont des visiteurs aveugles. Ils ne considèrent pas vos couleurs ni vos images ni vos animations. Ils sont là sur votre site pour l'information. Est-ce qu'ils ont accès à votre information? C'est ce que nous allons voir!
Premièrement, définissons « accessibilité ». La définition de Wikipédia est la suivante :
Mettre le Web et ses services à la disposition de tous les individus, quel que soit leur matériel ou logiciel, leur infrastructure réseau, leur langue maternelle, leur culture, leur localisation géographique, ou leurs aptitudes physiques ou mentales.
Source : Wikipédia - Accessibilité du Web
Maintenant, comment savoir rapidement si son site est accessible ou non? Il existe une multitude d'outils permettant l'analyse d'un site. Pour ma part, la première étape est de valider une page de son site avec le validateur d'accessibilité francophone d'Accessibilité pour tous disponible à l'adresse suivante : http://validateur-accessibilite.apinc.org/
Le validateur vous permet rapidement de valider plusieurs bonnes pratiques d'accessibilité automatiquement en vous présentant les résultats sur 3 niveaux de prior