Liens relatifs aux validité, accessibilité, qualité de création Web

This site is designed to be displayed in the browser "Firefox".

Par contre ça c'est dommage :

Citation : http://www.hpinfo.info/

Et bien en fait ça veut dire que je ne vérifie l'affichage presque que avec Firefox, (très) peu avec I.E (dont je n'ai de toute façon que la version 7). C'est pas "pro" du tout mais c'est tellement mieux d'avoir un navigateur aux normes.

Ca te gène pas que plus des 3/4 des visiteurs sont sur IE et sont donc dispensés de le visiter ?

Citation : JulFisher Je n'ai pas dit que le site hpinfo.info s'affiche mal sous I.E, seulement qu'il l'est mieux sous I.E. Il est évident que si il y a des bogues, je le corrige, sinon ce n'est même pas la peine de faire ce site.

Bonjour à toutes et à tous.

Bienvenue dans ce grand tutorial qui a pour but de vous donner les clefs pour concevoir, créer, réaliser, développer ou optimiser un site Web de façon à le rendre optimal.


Dans ce cours, vous apprendrez ou découvrirez pourquoi et comment réaliser des sites qui sont à la fois conformes aux standards du Web, accessibles à tous les publics et de qualité ; en clair : des sites dont vous pourrez humblement être fiers. (Je parle indifféremment de "un" site ou de "des" sites, ce n'est qu'un détail.)

Ce cours comporte beaucoup de liens externes car le sujet (VAQ = validité, accessibilité, qualité) est extrêmement vaste et je ne peux pas tout dire dessus en un seul tutoriel.

Bonne lecture et bon courage.

barre horizontale

Ce cours est composé des parties suivantes :

• Connaissances basiques indispensables

Partie 1 : Connaissances basiques indispensables

Avant de se lancez dans la réalisation pratique de son site, il est préférable de maitriser son sujet dans la théorie. Cette partie vous donne du vocabulaire et des références, définit notre sujet et en donne les enjeux.


1) Un peu de culture en V.A.Q Web

• Termes et expressions à connaître absolument
• Qui est qui ? Qui fait quoi ?

2) Qu'est-ce que les validité, accessibilité, qualité de sites Web ?

• Qu'est-ce que la validité ?
• Qu'est-ce que l'accessibilité ?
• Qu'est-ce que la qualité Web ?

3) Pourquoi réaliser des sites valides, accessibles, de qualité ?

• Pourquoi réaliser des sites valides ?
• Pourquoi réaliser des sites accessibles ?
• Pourquoi réaliser des sites de qualité ?

Vous disposez désormais de nombreuses connaissances théoriques à ce sujet. Dans quelques semaines, vous pourrez passer à la pratique et entamer l'apprentissage de la conception valide.

barre horizontale

Ce cours n'est pas du tout terminé, vous vous en doutez, c'est un peu "light" pour l'instant.

Le prochaine partie s'appelle "Réaliser un site valide" (elle a déja un titre) et vous expliquera... comment réaliser un site conforme.

La structure complète de ce cours (en incluant les sous-parties de chaque chapitre) est disponible dans le message du forum à l'origine de ce tutoriel. Aller lire ce message.

Bonne Année les Zéros.

A bientôt.

Ce chapitre est un abébcédaire des VAQ.
Il vous donne des bases théoriques sur ce sujet.
La pratique de la création Web de qualité ne commencera qu'à la deuxième partie de ce cours.

barre horizontale

Termes et expressions à connaître absolument

Bobby : surnom de l'évaluateur d'accessibilité "WebXACT" de Watchfire.com.

checkpoint (mot anglais) : point de contrôle.

compliance (mot anglais) : conformité, respect.

conformance (mot anglais) : conformité, respect.

CSS (Cascading Style Sheet = Feuille de Style en Cascade) : langage informatique destiné à la stylisation (dont la mise en page) du contenu des pages, en regroupant les informations de style dans ce seul fichier indépendemment des pages XHTML. Accueil du CSS sur le site du W3C : www.w3.org/ Style/ CSS/.

Cynthia : surnom de l'évaluateur d'accessibilité de Hi Software disponible sur le site www.contentquality.com/.

implementation (mot anglais) : implémentation = mise en éxécution = mise en place sur le site.

to pass the validation (expression anglophone) : réussir l'évaluation/la validation (aucune erreur détectée).

priorité : les points de contrôle des WCAG du W3C sont classées en trois groupes qui sont autant de niveaux de difficulté d'implémentation.
Explications de la FAQ du W3C : page originale en anglais | traduction en français.

to run a site through the W3C MarUp validator/Bobby/The Wave (expression anglophone) : proposer un site à l'évaluation avec l'évaluateur du W3C/Bobby/Cynthia/The Wave.

section 508 : la section 508 est le nom usuel d'un amendement à une loi fédérale états-unienne qui elle porte sur l'accessibilité aux personnes handicapées des sites fédéraux et ressources électroniques du gouvernement. La loi en question est la loi sur la réhabilitation de 1973 (Rehabilitation Act of 1973). La section 508 comprends l'intégralité des Site : www.section508.gov/.

standard : un standard est une norme, un ensemble de règles sur lesquels plusieurs personnes seson mises d'accord. Les standards du Web sont l'ensemble des spécifications et lignes directrices du W3C.

validateur : logiciel en ligne à qui on soumet une adresse Internet ou code dans le but de le faire analyser. Le logiciel en tire des statistiques et indique les erreurs de rédaction.

VAQ (validité, accessibilité, qualité) : acronyme de ma composition pour désigner de façon rapide notre sujet qui est validité, accessibiltié, qualité.

W3C (World Wide Web Consortium = Consortium Mondial de la Toile) : organisme de gestion des standards du Web. Site : www.w3.org/.

WAI (Web Accessibility Initiative = Initiative pour l'Accessibilité du Web) : département du W3C. Je parle indifféremment du WAI en tant que département ou de la WAI en tant qu'initiative. Accueil du WAI sur le site du W3C : www.w3.org/ WAI/.

WCAG (Web Content Accessibility Guidelines = Directives pour l'Accessibilité aux Contenus Web) : base de travail pour l'accessibilité des sites Web. Accueil des WCAG sur le site du W3C : www.w3.org/ WAI/ intro/ wcag.php.

webmaster : maître du Web (littéralement). Terme par lequel s'identifie une infinité de développeurs de sites Web peu humbles. En effet, selon moi, ce terme ne doit et peut par son étymologie s'appliquer qu'aux développeurs maitrisant tous les langages de création Web (HTML, XML, XHTML, CSS, JS, PHP, ASP, AJAX, etc), réalisant des sites valides (selon le dernier standard le plus accessible) et accessibles (triple "A") à tous... Le terme "développeur" est plus approprié car il sous-entend la notion de travail alors qu'à l'opposé le mot "maître" peut laisser supposer un génie ( hum...). Selon ma définition, il n'a donc presque aucun "webmaster" au monde.

webmistress : femme webmaster. Voir aussi le terme "webmaster".

WYSIWYG (What You See Is What You Get = Ce Que Vous Voyez Est Ce Que Vous Obtenez) : type d'éditeur (de pages) Web.

XHTML (eXtensible HyperText Markup Language = Langage eXtensible de Balisage HyperTexte) : langage de balisage qui sert à coder le contenu des pages Web. Accueil du XHTML sur le site du W3C : www.w3.org/ MarkUp/.

Qui est qui ? Qui fait quoi ?

Ce glossaire ne pourrait pas être complet sans quelques-unes des personnes que l'on rencontre sur les sites et blogs liés aux standards du Web, à son usagibilité ou à sa qualité en général. Ce Who's Who n'est évidemment pas complet, je me concentre sur les personnes ayant fondé des sites de référence, ou les gérant, celles tenant des sites proposant des traduction d'articles et celles ayant écrit un ou des livres de référence. Il n'est pas du tout nécessaire de connaître tous ces noms, mais vous risquez fort d'en entendre parler si vous naviguez sur des sites de références.

Alexandre AFCHAIN . Nationalité française. Co-auteur du livre "Créer des sites web accessibles à tous" (ISBN : 2-87880-576-3) paru en 2003 aux éditions Liaisons.

Marie ALHOMME. Nationalité française. Créatrice Web, spécialiste en accessibilité. Site : PouipouiDesign "... et pourquoi pas ?!".

Tim BERNERS-LEE. Nationalité états-unienne. Inventeur du World Wide Web en août 1991, fondateur du W3C en 1994 dont il est le président depuis.

Sébastien BLONDEEL. Nationalité française. Collaborateur de Raphaël Goetter dans l'écriture du livre "CSS 2 - Pratique du design web" (ISBN : 2-212-11570-9) paru le 16 juin 2005 aux éditions Eyrolles et principal traducteur du livre de Jeffrey ZELDMAN "Designing with web standards".

Paul BOHMAN. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Stephanie BOOTH. Nationalité suisse. Créatrice en 2001 du site Pompage "Web design puisé à la source" et directrice honoraire.

Denis BOUDREAU. Francophone, nationalité canadienne. Créateur du site CyberCodeur "Coder moins, coder mieux !".

Monique BRUNEL. Francophone, nationalité belge. Créatrice et éditrice des site et blog Webatou "Le Web accessible à tous" ; site | blog.

Michael BURKS. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Joe CLARK. Nationalité canadienne. Auteur du livre "Building accessible websites" (ISBN : 0-7357-1150-X) paru en octobre 2002 aux éditions New Riders. Le livre est disponible en ligne sur son site. Site : JoeClark.org.

Laurent DENIS. Nationalité française. Rédacteur en chef du projet OpenWeb, membre du collectif Alsacréations et consultant Temesis.

Raphaël GOETTER. Nationalité française. Développeur des sites "Alsacréations" (communauté et agence de création) et auteur du livre "CSS 2 - Pratique du design web" (ISBN : 2-212-11570-9) paru le 16 juin 2005 aux éditions Eyrolles.

Pierre GUILLOU. Nationalité française. Responsable éditorial du site AccessiWeb.org.

Shawn Lawton HENRY. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Julien LANCERAUX . Nationalité française. Co-auteur du livre "Créer des sites web accessibles à tous" (ISBN : 2-87880-576-3) paru en 2003 aux éditions Liaisons.

Mathieu NEBRA. Nationalité française. Créateur du Site du Zér0 "Ici, on apprend tout à partir de zéro..." et auteur du livre "Réussir son site web avec XHTML et CSS" (ISBN : 2-212-11948-8) paru le 26 octobre 2006 aux éditions Eyrolles.

Tristan NITOT. Nationalité française. Co-fondateur et membre du collectif OpenWeb et fondateur et président de Mozilla Europe. Blog : StandBlog.org.

Bob REGAN. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Elie SLOÏM. Nationalité française. Gérant de la société Temesis et de son site, membre du collectif OpenWeb, membre du Groupe de Travail Accessiweb et expert Accessiweb en évaluation.

Sarah SWIERENGA. Nationalité états-unienne. Co-auteure du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Jim THATCHER. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Mark D. URBAN. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Cynthia D. WADDELLl. Nationalité états-unienne. Co-auteur du livre "Constructing Accessible Web Sites" (ISBN : 1-590-59148-8) paru en avril 2002 aux éditions Glasshaus et républié en juillet 2003 aux éditions Apress.

Jeffrey ZELDMAN. Nationalité canadienne. Auteur du livre "Designing with web standards" (ISBN : 0-321-3855-1 pour la deuxième édition anglophone) paru en jullet 2006 (pour la deuxième édition) aux éditions New Riders. Le livre a été adapté en français par Sébastien BLONDEEL et Virginie MARECHAL sous le titre "Design web : utiliser les standards" (ISBN : 2-212-12026-5 pour la deuxième édition francophone) paru en jullet 2006 (pour la deuxième édition) aux éditions Eyrolles.

barre horizontale

Après tous ces mots "en vrac", voyons plus précisément les définitions de "validité", "accessibilité" et "qualité Web" dans le chapitre suivant.

On entend assez souvent parler de "validité"ou d'"accessibilité" sur le Web, parfois même de "qualité". Mais qu'est-ce que c'est au fait ?

barre horizontale

Qu'est-ce que la validité ?

Pour commencer, sachez qu'il n'y a pas une mais des validités.

La validité désigne de façon générale l'état de codes rédigés dans le respect des spécifications le concernant, c'est-à-dire dans les règles de l'art, en respectant sa "grammaire".

On parle principalement de la validité de deux codes : XHTML et CSS.

X.H.T.M.L
Ce langage structurel est celui dans lequel sont rédigée les pages web et qui donc en contient le contenu, d'où l'importance de ne pas faire d'erreur dans sa rédaction. Sans cela, le contenu peut ne pas s'afficher du tout !

C.S.S
Ce langage de présentation est celui utilisé pour mettre en forme le contenu de vos pages XHTML. En cas d'erreur, votre contenu n'aura pas du tout l'aspect que vous souhaitiez lui donner.

On parle aussi parfois de conformité, il s'agit dans ce cas du respect des standards du web (spécifications à suivre pour réaliser des sites valides, accessibles, interopérables) en général.

Qu'est-ce que l'accessibilité ?

L'accessibilité web est le caractère utilisable par tous du web, c'est-à-dire que n'importe qui, handicapé ou non doit pouvoir accéder à votre site de façon égale, sans différence ni de contenu ni de fonctionnalité.

Qu'est-ce que la qualité Web ?

La qualité est une notion très subjective, qui dépend de chaque développeur et chaque visiteur.

Un concepteur Flash privilégira les animations et du multimédia, un programmateur PHP préférera un site dynamique, et un webmaster se mettra en 4 pour offrir à ses visiteurs un site accessible à tous.

Néanmoins, on peut s'accorder sur le fait que la qualité d'un site vient avant tout de son contenu et de la pertinence de celui-ci, avant même de considérer sa conformité.

Nous reparlerons plus en détail de la qualité web dans la quatrième partie de ce tutoriel "Réaliser un site de qualité". Cette partie n'est pas encore disponible.

barre horizontale

Certains d'entre vous se disent peut-être : "C'est bien beau tout cela, mais à quoi ça sert ?". Nous allons voir cela dans le dernier chapitre de cette partie.

La plupart des sites sont mal codés et non valides, alors pourquoi donc se fatiguer à réaliser des sites conformes ?

barre horizontale

Pourquoi réaliser des sites valides ?

Les standards sont des normes de création, de réalisation sur lesquelles de nombreuses personnes se sont mises d'accord et s'engagent à les respecter dans me futur. Ce règles étant établies en consensus, il est logique de les appliquer. Il s'agit de rigueur et de sérieux, tout comme il est convenu que l'on ne "balance" pas le résultat d'une équation (la valeur de chaque variable) à son professeur sans explications préalables.

La validité est la première qualité d'un site, avant même de parler de son accesibilité, dont elle est la condition sine qua non. On ne peut pas imaginer un site accessible mais non conforme !

La validité d'un site lui confère de nombreux avantages :

• affichage correct dans les navigateurs actuels (= sans bogue et comme vous le désirez) ;
• évolutivité pour les futurs navigateurs (= compatibilité ascendante) ;
• la séparation du contenu et de sa forme (via l'emploi des CSS) permet une meilleure expérience utlisateur quelque soit leur navigateur.

La conformité d'un site est de plus en plus souvent devenu obligatoire, du moins pour les sites gouvernementaux, mais la loi sera peut-être plus sévère dans l'avenir. Pour l'instant, la validté constitue une bonne pratique rigoureuse et morale (pour l'accessibilité), et malheureusement un atout marketing vu le faible nombre de sites valides.

Article d'OpenWeb : "Pourquoi les standards du W3C ?"

Pourquoi réaliser des sites accessibles ?

L'accessibité d'un site donne à celui-ci une bien meilleure audience : pourquoi en effet se priver de visiteurs potentiels ?

On s'est rendu compte que l'accessibiltié ne concerne pas que les personnes handicapées pour deux raisons :

• l'accessibiltié facilite la navigation pour tous les visteurs ;
• n'importe qui peut avoir un handicap, ne serait-ce que quelque temps. De plus, les défaillances du corps vont croissantes avec l'âge : nous sommes tous des handicapés en puissance.

Articles d'OpenWeb :

• "Pourquoi l'accessibilité numérique ?"
• "Introduction à laccessibilité".

Pourquoi réaliser des sites de qualité ?

La qualité est la garantie d'une bonne image que vous donnez via votre site.

Cet "effet miroir" est primordial pour tous les sites à vocation comerciale, et tous ceux des entreprises.

Ceci ne s'applique bien sûr pas que à cette catégorie de sites : si le vôtre est de qualité, vous prouvez que vous vous souciez du confort de vos visteur durant leur viste.

Article d'Alacréations : Principes à suivre pour un site web de qualité : Ergonomie, Compatibilité, Accessibilité.

barre horizontale

Maintenant que vous avez assimilé les enjeux des V.A.Q, il est temps de passer à la pratique !

Cependant, notre tutoriel s'arrête là pour l'instant. La suite est en cours de rédaction.

Le plan est pas mal, comme c'est très structuré, ça peut aider. Après il faut voir si ça donne des parties homogènes. Je ne saurais que te conseiller de mettre ton tuto sur ZAP, ça permettrait à tout le monde de participer/commenter/corriger des coquilles.

Le tout très simplement! afin qu'un novice puisse gérer le site sans l'aide du webmaster.

J'ai une petite question ! Mais avant petite mise en situation.

J'ai appris à faire un site web grâce au cours sur le xhtml de m@teo21 idem pour le cours sur le php.
Pourtant si je veux me lancer dans un site web conséquent, je ne sais pas par où commencer. Ton cours va t-il traiter de cela en même tant que les standards du web, ou va t-il uniquement traiter des standards du web?

Donc est-ce que ton cours répondra à la question "Par où dois-je commencer?"