Docstoc

Formation - Appreciation et valorisation de la qualite sur le web

Document Sample
Formation - Appreciation et valorisation de la qualite sur le web Powered By Docstoc
					                                        FLOCARD Mickaël

                                 Date de création :   01.08.2005
                                   Date de dépôt :    31.08.2005
                                          Niveau :     BAC + 4




Appréciation et valorisation de la qualité sur le web
Mickaël FLOCARD
ESC Wesford 2004/05
Formation Responsable Marketing




                                  MEMOIRE



                                     Thème:
     Appréciation et valorisation de la qualité sur le web,
     des difficultés inhérentes aux technologies nouvelles.


                                  Problématique:

    “Peut-on prétendre valoriser la qualité des solutions innovantes
             en matière de web, face à un public non éduqué ?”




   Mickaël FLOCARD                Mémoire de Maîtrise - Wesford 2004/05   
   1
                                 REMERCIEMENTS

Je tiens dans un premier temps à remercier Mr Alex Liénard et Mme Virginia Ricour qui,
malgré l’interruption de mes études durant 4 années, m’ont donné l’opportunité d’intégrer
la formation de “responsable marketing” à l’ESC Wesford de Grenoble et de pouvoir ainsi
profiter de l’expérience professionnelle et de la qualité des différents intervenants.


Egalement Mr Xavier Destombes, directeur de la société de communication réseaux
Anazys (site web: http://www.anazys.com ) spécialisée dans la qualité et l’accessibilité des
solutions web, auprès de qui je me suis formé aux diverses démarches nécessaires à
l’obtention d’une qualité optimale lors de la conception de sites web.


Et pour finir, je souhaite remercier Mme Marie-Hélène Thoraval, responsable pédagogique
de notre formation, pour son aide et sa disponibilité dans l’élaboration de mes travaux.




                                       LEGENDE


• “ * ” : Les mots signalés par une étoile (exemple: mot*) dans le mémoire sont des mots
 définis dans le glossaire que vous trouverez à la page 48.

•“       ”ou “     ”: Les flèches que vous rencontrerez sont des renvois à d’autres
 pages du mémoire afin d’obtenir plus d’informations sur le sujet traité à ce moment.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             2
                                                            SOMMAIRE


I. Introduction ................................................................................................................................. p 5
II. Le web et son évolution .................................................................................................. p 6
         1) Historique du web ................................................................................................................ p 6
         2) Les technologies utilisées pour la création de pages web ................. p 6
                  a) L’utilisation des tableaux ............................................................................................ p 6
                  b) L’utilisation des frames ............................................................................................... p 7
                  c) Les abus de Flash ............................................................................................................ p 8
         3) L’art de la présentation ramené à l’essentiel: le contenu .................... p 8
         4) Mise en place des standards par le W3C .......................................................... p 9
III. Le graphisme, élément prédominant dans l’appréciation ... p 10
         1) Comportement critique de l’internaute “non éduqué” ........................... p 10
         2) L’aspect visuel à l’origine d’une “critique passive” ................................. p 11
         3) Les inconvénients d’un site “tout en image” ................................................ p 12
                  a) Des problèmes de référencement ............................................................................ p 12
                  b) Une accessibilité médiocre ......................................................................................... p 13
                  c) Des coûts de mise à jour importants ..................................................................... p 13
IV. Qu’entend-t-on par “qualité web” ..................................................................... p 14
         1) Introduction .............................................................................................................................. p 14
         2) Respect des standards du W3C ............................................................................... p 14
         3) Ergonomie et utilisabilité ............................................................................................... p 15
         4) Accessibilité ............................................................................................................................. p 16
                  a)    Internet, média universel accessible à tous ? ...................................................                           p 16
                  b)    Troubles de la vue chez les séniors et les baby-boomers ............................                                        p 16
                  c)    Vers une accessibilité multi plate-formes ..........................................................                        p 17
                  d)    Des problèmes relatifs aux troubles de chacun ..............................................                                p 18
                  e) Accessibilité et qualité visuelle peuvent-elles co-exister? ........................... p 20
                  f) Vers une “accessibilité universelle” ....................................................................... p 20
         5) Interopérabilité ....................................................................................................................... p 20




Mickaël FLOCARD                                            Mémoire de Maîtrise - Wesford 2004/05                          
                              3
V. Quelques repères pour mieux apprécier la qualité ........................ p 21
          1) Des points de repère simples ..................................................................................... p 21
                    a) Les logos du W3C ............................................................................................................ p 22
                    b) Les logos du label “Accessiweb” .............................................................................. p 24
                    c) L’absence de toute restriction d’accès .................................................................. p 26
          2) Quelques points de contrôle d’une ergonomie correcte ..................... p 26
                    a)    Organisation par rubriques ...................................................................................... p 26
                    b)    Habillage du site ............................................................................................................. p 27
                    c)    Barre de navigation ...................................................................................................... p 28
                    d)    Temps de chargement des pages ............................................................................ p 29
              e) Organisation des pages à fort contenu ............................................................... p 30
              f) Un nombre de clics minimum .................................................................................. p 31
              g) Prise en compte de la diversité du matériel utilisé ........................................ p 32
          3) D’un point de vue plus technique ........................................................................... p 34
              a) Ouverture du fichier HTML ....................................................................................... p 34
              b) Structure d’une page HTML ...................................................................................... p 35
              c) Les balises à vérifier ...................................................................................................... p 36
              d) Vérifier l’absence de frames ...................................................................................... p 38
                    e) Vérifier l’absence de tableaux .................................................................................. p 39
VI. Valorisation de la qualité: justification et argumentation... p 40
          1) Introduction .............................................................................................................................. p 40
          2) Pérennité des sites ............................................................................................................. p 41
                    a)    Par l’utilisation des feuilles de style ....................................................................... p 41
                    b)    A travers l’évolution des navigateurs ................................................................... p 41
                    c)    Par une meilleur interopérabilité ........................................................................... p 42
                    d)    Face à l’évolution des modes d’accès ..................................................................... p 42
          3) Amélioration des ventes ................................................................................................. p 42
          4) Des coûts de mise à jour moindres ....................................................................... p 43
          5) Des dépenses en bande passante maîtrisées ............................................... p 44
          6) En ce qui concerne les coûts de développement ....................................... p 44
          7) D’un point de vue légal ..................................................................................................... p 45
VII. Conclusion ................................................................................................................................... p 47

Glossaire .......................................................................................................................................................... p 48
Bibliographie ................................................................................................................................................. p 53
Annexes ............................................................................................................................................................ p 57


Mickaël FLOCARD                                                 Mémoire de Maîtrise - Wesford 2004/05                               
                                 4
I. Introduction
L’ internet, devenu aujourd’hui un outil incontournable dans notre société où les
Technologies de l’Information et de la Communication (T.I.C.) sont omniprésentes, reste
cependant une technologie peu connue et mal appréhendée par le grand public.
On pourrait se demander si le fait de comprendre dans les détails le fonctionnement du
web est réellement pertinent. Après tout, quasiment personne ne saurait expliquer
comment une publicité est diffusée à travers un poste de télévision, ni pourquoi des
millions de gens ont la possibilité de voir et d’entendre la même chose au même moment.
La différence fondamentale qu’il existe entre internet et les autres médias disponibles est
l’aspect permanent et évolutif de l’outil. Un site web est conçu pour durer et surtout pour
évoluer dans le temps, dans le but principal de développer son nombre de visiteurs et de
les fidéliser. Cet aspect évolutif est lié à d’autres paramètres, qui peuvent
malheureusement être plus ou moins efficaces. Ce qui fait surtout la différence, c’est la
multitude des plate-formes disponibles pour accéder à un site. Pour regarder la télévision,
nous sommes limités au choix du téléviseur, puis au choix de la chaîne que l’on souhaite
voir, ensuite tout fonctionne plutôt bien. Sur internet, c’est une toute autre histoire. Pour
accéder à un site web, il vous faut choisir un ordinateur, un système d’exploitation*
(Windows, Mac OS X, Linux...), un navigateur internet* (Internet Explorer, FireFox,
Safari,...), mais surtout chacun a la possibilité de faire des modifications sur sa propre
machine, comme par exemple augmenter la taille de la police, interdire l’apparition de pop-
up*,...
Toutes ces possibilités donnent donc un nombre important de combinaisons possibles
pour chaque internaute. Autant de combinaisons qui sont susceptibles de modifier le rendu
d’une page HTML*, voire de la rendre inaccessible dans certains cas.
Un concepteur de sites web doit prendre en compte toutes ces contraintes afin de
permettre une meilleur lisibilité de son oeuvre et ce par un nombre maximum
d’internautes. On peut donc à présent introduire la notion de qualité web, car c’est bien de
cela qu’il s’agit. Un site web de qualité est un site qui sera conçu et développé en gardant
toujours à l’esprit le fait qu’il existe des centaines de façons différentes d’accéder à son
contenu, et donc des centaines de façons différentes d’altérer son contenu et de le rendre
plus ou moins inaccessible.
Suite à ces différentes remarques, plusieurs questions se posent, côté client et côté
prestataire. Comment faire en sorte que le client, désireux d’acquérir un site web, puisse
avoir une bonne lisibilité sur la qualité d’un prestataire, tout en sachant qu’il se trouve face
à des technologies nouvelles, qui requièrent un niveau minimum de connaissances
techniques pour pouvoir prétendre en évaluer leur qualité? Par quels moyens des
prestataires de qualité peuvent-ils se différencier des autres face à une méconnaissance
technique et donc à une vulnérabilité commerciale de la clientèle ciblée?




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
                5
Mon objectif dans ce mémoire sera de donner des pistes pour une meilleure évaluation et
une meilleure valorisation de la qualité sur le web, en répondant à la problématique
suivante:
“Peut-on prétendre valoriser la qualité des solutions innovantes en matière de web, face à
un public non éduqué ?”.




II. Le web et son évolution


     1) Historique du web
ARPANET, premier ancêtre de l’internet d’aujourd’hui, a été créé en 1969 suite à un projet
de recherche lancé par l’Armée Américaine et a permis dans un premier temps de relier
quelques universités situées dans 4 états différents, dans le but de conserver des voies de
communication ouvertes en cas de conflit nucléaire avec l’U.R.S.S. . Au début des années
70, le réseau, devenu public, attira de plus en plus d’universités, car il facilitait de façon
considérable les échanges d’informations nécessaires aux différents travaux de
recherche.
Le réseau est devenu international en 1973 avec la connexion de la Norvège et du
Royaume-Uni, et depuis n’a plus cessé de croître.
Tim Berners-Lee est considéré comme l’inventeur du Web car il a su mettre en place en
1990 un langage capable de structurer le Web, le HTML*, en donnant du sens aux
différentes parties d’un document texte (titres, sous-titres, listes, paragraphes...).
Malgré le but premier du HTML qui était de structurer, les webmasters se sont appropriés
le langage en ne l’utilisant qu’à des fins de mise en page. Ils ne possédaient au début de
l’internet d’aucun outil permettant de disposer les éléments d’une page à l’endroit désiré
(Placer par exemple une photo d’un produit et ses caractéristiques côte à côte peuvent
poser des problèmes). C’est pourquoi beaucoup de sites sont aujourd’hui encore
structurés essentiellement à base de tableaux, éléments de structure HTML qui sont, à
l’origine, réservés aux éléments de même nom composant un document.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
               6
     2) Les technologies utilisées pour la création de pages web


            a) L’utilisation des tableaux
L’exemple le plus flagrant de mauvaise utilisation du HTML est donc le recours aux
tableaux pour positionner les différents éléments d’une page HTML. L’inconvénient d’une
telle pratique est la perte de tout sens structurel du document qui se retrouve donc illisible
par tout outil de navigation conçu pour lire des pages respectant les règles de structure.
Les feuilles de style CSS* sont aujourd’hui utilisées pour combler cette lacune du HTML,
et permettent depuis environ 2000 (date à laquelle elles ont commencé à correctement
fonctionner sur les navigateurs) de séparer le contenu de la mise en forme.
Il est possible de se rendre compte assez rapidement de l’utilisation abusive ou non des
tableaux pour la mise en page d’un site, mais il faut pour cela regarder le code HTML de la
page que l’on souhaite examiner.
(voir p39      : “V.3)e) Vérifier l’absence de tableaux” )
L’utilisation de tableaux pour la mise en page des sites est aussi un frein considérable à
l’accessibilité des sites web aux personnes handicapées.
(voir p16    : “IV.4) Accessibilité” )


            b) L’utilisation des frames
 Les cadres (”frames” en anglais) sont moins courants que les tableaux mais il arrive
encore que l’on rencontre des sites web utilisant encore cette technologie. Leur
particularité est de diviser la fenêtre du navigateur en plusieurs petits cadres ayant chacun
les propriétés d’une fenêtre (c’est-à-dire la possibilité d’utiliser la barre de défilement, une
adresse URL* propre à chaque fenêtre, ...). L’utilisation des cadres permettait de créer
rapidement une mise en page simple du site.
Cependant, le référencement de ce genre de site pose de gros problèmes, les moteurs de
recherche ayant tendance à indexer les différents cadres d’une page de façon
indépendante. Les fichiers HTML* contenus dans chacun des cadres sont au final
totalement indépendants et ne comportent aucun lien permettant de les relier les uns aux
autres. Etant donné que la partie “contenu” d’une page se situait dans un cadre lui étant
réservé, il était possible d’en trouver l’URL* lors de recherches web sur Google par
exemple, et donc de ne voir s’afficher sur son navigateur que le contenu, sans menu (car
lui-même se trouve dans un autre cadre), sans bandeau de page pour savoir dans quel
site on se trouve, sans titre de fenêtre, ...
Dans le cas où l’information trouvée dans ce contenu est pertinente pour l’internaute, il lui
est cependant impossible de continuer à naviguer dans le site pour approfondir ses
recherches, car il n’a pas accès au menu qui se trouve à l’origine dans un autre cadre.




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
               7
Les frames ont été beaucoup utilisées par le passé mais sont aujourd’hui à proscrire dans
le développement de tout site web. Elles posent des problèmes de navigation, de
référencement, d’intégration d’une page web dans la liste des favoris*, mais surtout elles
sont de moins en moins supportées par les navigateurs web et rendent impossible
l’accessibilité du site aux personnes handicapées.
(voir p38    : “V.3)d) Vérifier l’absence de frames” )


            c) Les abus de Flash
Certaines technologies ajoutent des fonctionnalités côté client (c’est-à-dire sur la machine
de l’utilisateur), comme par exemple Flash*, Java*, QuickTime*, PDF* ou encore Windows
Media*. Elles sont à utiliser le moins souvent possible (sauf pour Java qui est
normalement utilisable sur toutes les machines). L'architecture de base et la navigation
dans le site ne doivent pas faire appel à ces technologies. Il doit s'agir uniquement
d’éléments additionnels tout en précisant le plug-in* utilisé (voir même la taille s’il est un
peu volumineux).
Le Flash est un format multimédia propriétaire appartenant à la société Macromédia*. Il
sert principalement à créer des animations web sonorisées ou non. Il a la particularité de
pouvoir générer des animations interactives fournissant un impact visuel considérable en
comparaison de la taille du fichier correspondant (La taille d’un fichier HTML reste très
importante et contribue à de longs temps de chargement de la page si l’internaute
possède une connexion à bas débit). Ses possibilités ont séduit de nombreux concepteurs
web, au détriment de l’ergonomie et de l’accessibilité. Ces derniers, au lieu d’utiliser Flash
comme un moyen d’intégrer des fichiers interactifs améliorant la qualité visuelle de la
page, ont construit des sites entièrement en Flash, se souciant peu des conséquences
que cela pouvait avoir en terme de qualité, de référencement et d’accessibilité. Le but
premier de ces prestataires web étant de concevoir un site web attractif pour toute
personne méconnaissant les exigences du web quant à l’obtention d’un site de qualité, le
Flash devenait leur outil de travail idéal.
Tous les sites ayant été conçus de la sorte posent de gros problèmes de référencement,
de coûts de mise à jour du contenu, et d’accessibilité.



     3) L’art de la présentation ramené à l’essentiel: le contenu
On constate donc un manque cruel d’éléments structurels permettant de faire la mise en
page des sites web jusque dans le milieu des années 90. Les webmasters ont dû trouver
des techniques pour arriver à leur fin (cadres, tableaux,...), mais au détriment d’une bonne
utilisation du code HTML*. C’est pourquoi on retrouve encore aujourd’hui un nombre très
important de sites web utilisant ces techniques déviées.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
               8
Ensuite sont apparues les CSS* (Cascading Steel Sheet) afin de pouvoir séparer
complètement le contenu d’une page web et les différents éléments de mise en page. Le
contenu texte d’une page web et la structure de ce contenu sont présents dans la page
HTML alors que les éléments permettant d’attribuer des couleurs aux fonds et aux textes,
ainsi que les éléments permettant de positionner les différents blocs de contenu d’une
page, sont eux positionnés dans un fichier que l’on appelle la feuille de style. Disponibles
dès 1996, il faudra attendre jusqu’en 2001 pour que les CSS fonctionnent sur les deux
principaux navigateurs, Internet Explorer et Netscape.
L’apparition des feuilles de style CSS a joué un rôle important dans le fait de rendre
possible la qualité des documents web, en permettant un “nettoyage” du code HTML* qui
s’avérait de plus en plus nécessaire.



     4) Mise en place des standards par le W3C*
Pour revenir légèrement en arrière, au tout début de l'internet, Internet Explorer et
Netscape étaient les deux principaux navigateurs utilisés sur le net. A ce moment aucun
des deux n’avait jugé utile de se mettre d'accord sur une façon commune d'utiliser le
langage HTML*.
Chacun pris donc son propre chemin dans le développement de son navigateur,
compliquant ainsi la vie des développeurs, mais aussi des utilisateurs.
Pour résumer, un site conçu pour être optimisé sur Internet Explorer posait de gros
problèmes de navigation sur Netscape et vice versa. A moins que le propriétaire d'un site,
avide de dépenses inutiles, n'ait décidé d'en faire développer deux versions, le
fonctionnement et la mise en page de ce dernier n'étaient corrects que sur l'un ou l'autre
des deux navigateurs.
Le Web, terrain de prédilection pour la diffusion d'une information libre et accessible à
tous, s'écartait peu à peu de son chemin...
Les choses ont commencé à changer en 1994 grâce au W3C, un organisme de
standardisation mettant en oeuvre des recommandations afin de réguler l’évolution du
web. La mise en place de ces standards du web permet de donner une certaine
cohérence à son évolution, en donnant la possibilité à tous les acteurs du web de se
projeter avec plus de facilité dans l’avenir. Aujourd’hui les fabricants de navigateurs vont
de plus en plus dans le sens du W3C, en intégrant les recommandations au fur et à
mesure des développements et des mises à jour de leurs navigateurs. Il appartient
désormais à la bonne volonté de chaque internaute de participer à ces changements en
devenant plus actif. Les internautes ont par exemple la possibilité de s’investir dans ce
grand projet en téléchargeant régulièrement les nouvelles versions ou mises à jour de leur
navigateur ou bien en optant pour le choix d’un navigateur plus conforme aux standards
que celui qu’ils utilisent.
(Voir la page web suivante pour plus de renseignement sur les navigateurs:
http://www.openweb.eu.org/articles/navigateurs_alternatifs ).

Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             9
Le World Wide Web Consortium (W3C) est donc un consortium international dont le but
est de “mener le web à son plein potentiel” (source: http://www.w3.org/Consortium/). Il
est dirigé par Tim Berners-Lee, l’inventeur du web. Depuis sa fondation en 1994, le W3C a
considérablement élargi le nombre de ses participants et compte aujourd’hui parmi ses
membres des noms prestigieux tels que Microsoft, Apple computer, Adobe, Macromédia,
Sun Microsystems, ..., mais aussi un nombre important de sociétés de télécommunication
et d’institutions académiques.
Le W3C émet des recommandations dans le but d’assurer l’interopérabilité du web et de
favoriser son évolution. Les standards développés par le W3C concernent, entre autres, le
code HTML*, les feuilles de style CSS*, et les WCAG* (recommandations relatives à
l’accessibilité des pages web).




III. Le graphisme, élément prédominant dans l’appréciation


     1) Comportement critique de l’internaute “non éduqué”
En essayant de comprendre quel comportement critique l’internaute non professionnel
adopte face à la qualité d’un site web, on rejoint alors l’idée selon laquelle l’internaute peut
être considéré comme appartenant à un public non éduqué (voir la problématique du
mémoire), en terme bien sûr de qualité web.
Le W3C et les standards, la séparation entre structure et mise en page, l'ergonomie
web, ..., sont des concepts qui paraissent aujourd'hui indispensables à tout expert du web,
mais il faut rappeler qu'il y a seulement quelques années, il étaient encore assez
méconnus du milieu professionnel. Ces technologies sont donc encore aujourd'hui
considérées comme nouvelles et quasiment inconnues du grand public.
Or, tout internaute naviguant sur le web émet constamment des critiques, volontaires ou
non, conscientes ou inconscientes, sur son expérience d’utilisateur, pour au final conclure
sur une satisfaction plus ou moins grande pour chaque site web qu’il aura visité. Cette
appréciation va donc se baser sur des paramètres qu’il saura juger ou qu’il ressentira tout
naturellement sans forcément se baser sur des connaissances techniques. Les
paramètres en question, à disposition de tout internaute non expert, sont l’aspect visuel du
site, la facilité de navigation, et la pertinence de l’information. Une bonne cohérence de
ces trois éléments devrait au final pousser l’internaute à ajouter le site concerné dans ses
favoris* ou bien, au contraire, à fermer la fenêtre dans laquelle il se trouve et continuer de
naviguer sur le web à la recherche de meilleurs sites.




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
              10
L’aspect visuel, point qui nous intéresse particulièrement sera traité dans le paragraphe
suivant. En ce qui concerne la facilité de navigation, nul besoin d’être un expert du web
pour se rendre compte si un site web est bien conçu. Dès la première entrée dans un site
web de qualité, que ce soit par la page d’accueil ou par n’importe quelle autre page du
site, on comprend vite quel est le mode de navigation, quel comportement on va devoir
adopter pour trouver l’information recherchée. Cette aisance de navigation est ensuite
immédiatement confirmée si, lorsqu’on accède à une page différente, on se retrouve face
à la même structure, face à la même disposition des éléments utiles à la navigation; le
menu, les raccourcis, les champs de recherche... Dans le cas contraire, “l’intensité” de la
réflexion demandée pour seulement comprendre comment fonctionne un site mène
rapidement l’internaute à en sortir, à moins bien sûr que l’information qu’il recherche se
trouve directement dans la page consultée. Mais dans ce cas il y a peu de chance qu’il
revienne consulter ce site pour d’autres recherches. Cette facilité de navigation est
appelée “l’ergonomie d’un site web” et sera traitée plus profondément dans le chapitre IV.
(voir p15    : “IV.3) Ergonomie et utilisabilité” )

La pertinence de l’information disponible dans un site web est, quant à elle, beaucoup plus
liée à ce que recherche l’internaute à un moment donné. Il n’a donc en aucun cas besoin
de maîtriser les aspects techniques pour pouvoir apprécier la justesse de la relation entre
le contenu d’une page web et l’information recherchée.




     2) L’aspect visuel à l’origine d’une “critique passive”
L’internaute désireux d’adopter un comportement critique lors de sa navigation sur le web
se retrouve donc très vite confronté à une incompréhension des technologies utilisées
pour construire les pages web. Hormis sa capacité à juger, comme nous venons de le voir,
de l’ergonomie d’un site web et de sa pertinence par rapport à l’information qu’il
recherche, la principale caractéristique d’un site que tout individu non atteint de
déficiences visuelles peut cerner est sa charte graphique, son aspect visuel.
On a d’ailleurs affaire ici à l’un des principaux problèmes rencontrés par l’émergence de la
qualité sur le web. En effet, que ce soit une personne volontairement critique ou bien tout
simplement un internaute se souciant guère d’évaluer la qualité d’un site web, la réaction
la plus connue face à la découverte d’un nouveau site web est celle consistant à dire si oui
ou non le site est visuellement attractif. Pour un public non éduqué, un site d’une
conception graphique réussie est forcément un site bien conçu, un site de qualité !




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
          11
Le but n’est pas ici de dénigrer l’importance du graphisme dans un site web, mais plutôt
de démontrer qu’il est l’un des facteurs de réussite lorsqu’on conçoit un site web, et non
pas “LE” facteur de réussite. D’ailleurs, dans tout projet de développement de site bien
organisé, le graphiste ne doit intervenir qu’à la fin du projet. Une fois que les différentes
rubriques et leur contenu auront été déterminés, alors la structure du site pourra être
arrêtée (tout en n’oubliant pas de prévoir une évolution dans le temps), et enfin le design
se mettra en place en fonction de ces différents éléments.
Un site de très bonne qualité structurelle, c’est-à-dire un site où l’on retrouve une
séparation totale du contenu et de la mise en forme, permet en plus de pouvoir changer
de design autant de fois que l’on veut sans pour autant modifier ni le contenu ni la
structure. C’est un des nombreux avantages des feuilles de style CSS*, qui contiennent
les photos, le logo, l’ensemble des éléments de la charte graphique, alors que le code
HTML* ne contient que le contenu textuel du site et bien sûr sa structure. Cette
particularité des CSS donne en outre la possibilité de donner un choix de design à
l’internaute, qui pourra par exemple modifier en temps réel le code couleur d’un site en
fonction de ses préférences.
Le fait que l'internaute ait adopté ce comportement critique, que l'on peut qualifier de
"passif", a encouragé bon nombre de personnes provenant de formations à dominantes
graphiques (comme les écoles des beaux arts, les écoles de designers ou
infographistes...) à se lancer dans la conception de sites web, et ce avec réussite, avec
comme principal atout leurs seules compétences en design. Les sites web conçus par
cette catégorie de prestataires sont de toute évidence des sites agréables à regarder, et
qui satisfont entièrement le client, dans un premier temps.



     3) Les inconvénients d’un site “tout en image”
Ces prestataires ont donc réussi à vendre du design, du visuel, mais pas forcément de la
qualité. En y regardant de plus près, de nombreux inconvénients émergent au fil du temps.


          a) Des problèmes de référencement
Les moteurs de recherche utilisent des robots, aussi appelés “spiders”, pour parcourir le
web et indexer les sites qu’ils rencontrent. Pour cela, les spiders se promènent de site en
site grâce aux différents liens qu’ils rencontrent dans chacun. Le bon référencement d’un
site web est dû d’une part à sa popularité* et d’autre part à la pertinence de son contenu
par rapport à la recherche de l’internaute à un moment donné. Une bonne connaissance
des techniques de référencement mériterait beaucoup plus d’attention qu’une simple
partie dans ce mémoire, nous nous en tiendrons donc à ce qui nous intéresse, à savoir le
problème des sites en images. Pour de plus amples informations, reportez-vous aux
multiples sites disponibles sur le web, qui eux traitent le sujet de manière plus
approfondie.



Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             12
Certains sites ne sont donc constitués que par des morceaux d’images collées les unes
aux autres. Le contenu textuel est directement intégré à l’image. Les différents mots
présents dans la page ne sont donc pas considérés comme du texte par les spiders*, mais
par des images et n’ont alors aucun intérêt pour le référencement.


          b) Une accessibilité médiocre
Les sites en images posent plusieurs problèmes en terme d’accessibilité. Tout d’abord les
personnes ayant des problèmes de vue sont dans l’impossibilité de zoomer le texte qui les
intéresse étant donné que la fonction “zoom” des différents navigateurs ne s’applique
qu’au contenu textuel des pages, et non aux images. Essayez donc d’augmenter la taille
de la police sur votre navigateur, et vous vous rendrez compte que les éléments qui
grossissent sont bien les textes et que les images ne changent pas de taille. Si toutefois
certaines parties du site web que vous testez ne grossissent pas alors qu’il s’agit de texte,
c’est que vous êtes en présence d’un texte intégré à une image, ce qui est souvent le cas
pour les logos, les slogans et quelques fois pour les boutons de menu.
Un autre problème classique en ce qui concerne l’utilisation d’images ou encore les sites
web réalisés à l’aide de l’outil Flash*, est le fait que les internautes handicapés visuels
utilisent des lecteurs d’écran permettant une retranscription de l’information soit par une
synthèse vocale, soit par un clavier en braille. Ces lecteurs d’écran parcourent le code
HTML* à la recherche de texte contenu dans les différentes balises* HTML. Donc tout le
texte qui se trouve uniquement sous forme d’image, tous les liens du site ou boutons qui
ne sont que des images, sont alors inaccessibles et entraînent bien souvent l’impossibilité
de naviguer dans le site.


          c) Des coûts de mise à jour importants
Intégrer du texte à une image est une solution qui peut paraître plus rapide pour un
graphiste ne maîtrisant pas toutes les techniques de conception web, mais elle s’avère
vite être une perte de temps quand on considère qu’un site web est fait pour évoluer dans
le temps et que son contenu va devoir être modifié assez fréquemment. Le temps mis
pour modifier un paragraphe dans un document HTML peut être comparé à celui que l’on
mettrait pour modifier un document Word. Par contre pour modifier une image, c’est une
toute autre histoire, surtout si l’image à modifier doit au final contenir un paragraphe avec
plus de contenu et donc nécessitant un agrandissement de l’image. Pour une meilleure
compréhension, imaginez que vous enlevez une pièce d’un puzzle et que vous voulez la
réintégrer au même endroit après en avoir augmenté sa surface par un quelconque
procédé...




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             13
IV. Qu’entend-t-on par “qualité web” ?


     1) Introduction
Afin d'être en mesure d'apprécier la qualité d'un site web et donc par la même occasion la
compétence d'un prestataire, il paraît indispensable d'acquérir des connaissances de base
en ce qui concerne le fonctionnement du web. La compréhension du concept d'ergonomie
ainsi que la faculté à pouvoir apprécier la qualité d'une conception graphique sont des
éléments indispensables mais qui s’avèrent insuffisants pour une appréciation exhaustive
de la qualité d'une réalisation web.
Les cinq concepts suivants paraissent incontournables:
   • Le respect des standards du W3C*
   • L'utilisabilité
   • L'ergonomie
   • L'accessibilité
   • L’interopérabilité
Ces différentes notions, si elles sont respectées de façon cohérente lors de la conception
d'un site, sont les clés d'une qualité optimale orientée vers la satisfaction de l'internaute,
mais aussi vers celle du client ayant fait appel à un prestataire pour la réalisation de son
site web.


     2) Respect des standards du W3C
La qualité web peut se résumer dans un premier temps au respect pur et simple des
standards du W3C. Ils représentent les bases de toute mise en place d'une démarche de
qualité sur le web. Les autres "concepts" de qualité, l'utilisabilité, l’interopérabilité,
l'ergonomie et enfin l'accessibilité, en découlent directement et sont dépendants des
différentes recommandations émises à travers les normes du W3C.
L'idée principale qui en ressort est le respect d'une structure de site cohérente et
permanente à travers les différentes pages. Une balise* HTML est dédiée à chaque
élément de structure présent dans un document texte (ces éléments de structure sont le
titre de la page, les titres de paragraphes, les paragraphes, les listes et les sous-listes, les
citations, les tableaux...). Ces balises doivent donc être utilisées à bon escient.
On retrouve par exemple une balise à utiliser uniquement pour le titre principal de la page
(la balise <h1>) ainsi que des balises de même famille et utilisées hiérarchiquement pour
chaque sous-titre de différents niveaux ( <h2>, <h3>, <h4>, ... ), correspondant aux
paragraphes, aux sous-paragraphes... .
(Voir annexe 2 p59        : “Un exemple des recommandations du W3C, la balise <title>”).


Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
             14
     3) Ergonomie et utilisabilité
Sur le web, ergonomie et utilisabilité sont deux notions suffisamment proches pour ne pas
être traitées séparément. L’utilisabilité web peut se résumer dans notre cas par la facilité
d’utilisation d’un site par un internaute. Un site web de bonne utilisabilité est un site
ergonomique, qui permet à l’internaute d’atteindre rapidement l’information ou le service
recherché, et dont l’expérience en tant qu’utilisateur aura été vécu de façon agréable. Sur
le web l’utilisabilité est une condition de survie pour un site web. Si l’utilisateur a des
difficultés à s’en servir, il le quitte immédiatement pour un autre site.
Par exemple, le principe de base de fonctionnement d’un site étant l’utilisation des liens à
travers les différentes pages, ces derniers doivent être suffisamment explicites en ayant
une couleur différente du texte normal, et peuvent être par exemple soulignés pour mieux
les repérer. Ces liens doivent de plus être tous représentés de la même façon dans le site
web.
Comme autre point important en terme d’utilisabilité, on peut citer le temps de
téléchargement des pages. Un site conçu pour ne fonctionner que sur des ordinateurs
connectés avec l’ADSL*, devient inutilisable avec une connexion bas débit*, laquelle est
encore largement utilisée aujourd’hui. Les temps de réponse des serveurs web*, comme
lors d’appels à des bases de données, sont de manière générale des éléments affectant
l’utilisabilité.
La particularité d’un site web par rapport aux plaquettes publicitaires et autres supports
papier est que l’on peut sans le vouloir rentrer par n’importe quelle page. En effet, la
majorité des consultations de sites sur internet se fait suite à une recherche par mots clés
sur des moteurs comme Google ou Yahoo. Le résultat de ces recherches dépend donc
directement des mots clés tapés et peut donner accès à des pages internes de sites,
pages dont le contenu sera directement lié aux mots clés. Il est dès lors très important que
toutes les pages d’un site aient une structure identique et que l’on puisse, quelle que soit
celle par laquelle on rentre dans le site:

   • Se repérer facilement, c’est-à-dire comprendre à travers les différentes indications
     données à quel niveau la page dans laquelle on se trouve se situe, s’il s’agit d’une
     rubrique ou, bien d’une sous rubrique, ...

   • Repérer la signalétique de la marque ou de l’organisme à l’origine de ce site.

   • Comprendre de façon intuitive le thème principal, grâce au titre du site, ou encore
     grâce aux différents éléments du menu de navigation.

   • Assimiler le plus rapidement possible le mode de navigation afin de stimuler chez
     l’internaute la tentation de découvrir le reste du site.

   • Etre capable de juger le plus rapidement possible de la pertinence de l'information
     que l'on va pouvoir trouver, en fonction de celle que l'on recherche.


Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            15
L’ergonomie devient encore plus intéressante lorsqu’on s’intéresse à un site de vente en
ligne. Comment réussir à vendre un produit si l’internaute ne parvient pas à trouver ce
produit sans un minimum de difficultés? Comment convaincre l’internaute du sérieux de
l’entreprise et donc du bon déroulement de sa commande si le site web ressemble à
quelque chose d’incohérent et de mal organisé? Il est évident que les entreprises
souhaitant se lancer dans la vente de produit en ligne, ou même celles souhaitant
augmenter leur chiffre d’affaire sur le web ont grand intérêt à faire intervenir des
spécialistes de l’ergonomie ou plus généralement des spécialistes de la qualité web.
L’internaute est très instable lorsqu’il navigue sur le web, il suffit du moindre détail le
gênant ou le faisant attendre pour qu’il quitte le site sans y revenir de si tôt.




     4) Accessibilité


          a) Internet, média universel accessible à tous ?
La presse écrite ne peut pas s'adresser aux personnes aveugles ne maîtrisant pas le
braille. La télévision s’avère inutile pour un spectateur incapable de voir et d'entendre.
Quant à la radio, elle exclue totalement les personnes sourdes.
Environ 5 millions de personnes en France et 40 millions en Europe souffrent d’un
handicap.
(source: site web “Accessibilité.info”, http://www.accessibilite.info/accessibilite.php ).
Parmi tous ces outils de communication, le web est le seul à pouvoir devenir le premier
média accessible à tous, aussi bien aux séniors dont la majorité de la population est
confrontée à des troubles de la vue, qu’aux personnes atteintes de handicaps.


          b) Troubles de la vue chez les séniors et les baby-boomers
“Chez  les personnes âgées, les troubles de la vision sont particulièrement fréquents. La
prévalence de la malvoyance augmente de 3,9 % pour les 60-69 ans, à 20 % pour les
personnes âgées de 80 ans ou plus résidant à leur domicile. À ces âges, la part
d’aveugles s’élève à 1,5 %. Ces proportions sont plus élevées en institution, où 32 % des
80 ans ou plus sont malvoyants et 1,8 % aveugles”. ( source: Article "Quels sont les freins
à la communication pour les personnes âgées ? " , http://www.lemarchedesseniors.com ).




Mickaël FLOCARD                  Mémoire de Maîtrise - Wesford 2004/05   
            16
Les problèmes de la vue sont d’évidence un des éléments à prendre très au sérieux lors
du développement d’un site web, que ce soit un site de service public, un site de vente en
ligne, ou encore un site d’informations, non seulement parce qu’il est immoral de négliger
volontairement une partie de la population car elle se trouve en minorité mais aussi parce
que tous les outils de développement sont aujourd’hui à disposition des webmasters et
qu’ils ne peuvent plus prétendre être incapables d’apporter des solutions concrètes à ce
genre de problèmes. Les personnes atteintes de troubles de la vue forment la “catégorie”
la plus nombreuse de gens ayant des difficultés de navigation sur internet mais il ne faut
pas oublier tous les autres problèmes liés aux multiples handicaps possibles.


           c) Vers une accessibilité multi plate-formes
Le but premier d'internet est de garantir l'interopérabilité du contenu et la liberté de choix
des utilisateurs. Dès qu'un soit-disant site Web est optimisé pour un navigateur précis ou
même une résolution d'écran (on retrouve assez souvent en bas des page web ce genre
d’expressions: “ce site est optimisé pour un écran en résolution 800x600 pixels et pour
Internet Explorer version 5”), il s'agit simplement d'un site réalisé sans connaissance
d'internet, et qui ne respecte pas la liberté de choix de l’internaute. L’internaute ne doit en
aucune façon s’adapter à un site web en téléchargeant un quelconque plug-in* ou en
changeant sa résolution d’écran, c’est au contraire le rôle du webmaster de fournir un
contenu qui soit accessible à partir de différentes plate-formes.
Les personnes atteintes de troubles de la vue sont celles qui rencontrent le plus de
problèmes dus au manque d'accessibilité et d'interopérabilité du contenu présent sur le
web. Leur approche du web est particulière, notamment par le matériel utilisé:

   • Des navigateurs textes (Lynx par exemple) permettent de leur fournir uniquement le
     contenu textuel d'une page. Tous les éléments graphiques du site, couleurs, feuilles
     de style CSS,..., sont ignorés et seul un rendu texte du contenu est obtenu. On se
     rend alors compte de l’importance de respecter la bonne utilisation des balises
     HTML.

   • Des synthèses vocales pour les non-voyants permettent d’interpréter le contenu de la
     page web via son code HTML pour ensuite le retranscrire vocalement. Des efforts
     supplémentaires doivent être faits par le webmaster, efforts liés à une certaine
     logique de lecture. Prenons exemple des sites comportant des menus de navigations
     très importants, par exemple plus d’une dizaine d’items. Il est préférable de proposer
     des “accesskeys*” en début de page, permettant à l’internaute de se rendre
     directement soit au contenu de la page, soit au menu. Il devient alors possible de
     positionner le menu en fin de la page HTML et donc d’éviter à l’internaute utilisant
     une synthèse vocale de devoir écouter entièrement le menu sur chaque page avant
     de pouvoir accéder au contenu.




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
             17
   • Des lecteurs brailles sont aussi disponibles pour les adeptes de ce langage. Il faut
     également prendre en compte la même logique de lecture que pour les synthèses
     vocales afin de rendre la lecture des sites web plus confortable pour l’utilisateur
     handicapé.




      Photos de lecteurs braille (source: http://www.eurobraille.fr/ )

Toute utilisation détournée des balises HTML* posera des problèmes de lecture par ces
différents procédés. Les logiciels utilisés permettent d’interfacer des navigateurs
fonctionnant sous Windows avec ces terminaux brailles ou synthèses vocales, en faisant
une lecture du code HTML sans se préoccuper des feuilles de style CSS étant donné que
l’aspect visuel n’a plus aucun intérêt. Par contre si le code HTML n’est pas utilisé de la
bonne façon comme nous l’avons vu précédemment, alors la lecture du contenu sera
difficile voir incompréhensible.
Pour plus de détails sur le fonctionnement des synthèses vocales, n’hésitez pas à
télécharger une vidéo très intéressante à l’adresse suivante:
   • http://www.doit.wisc.edu/accessibility/video/screenreader22.mov
   • Format du fichier à télécharger: “.mov” (ouverture possible avec l’application QuickTime).
   • Taille: 22 Mo
   • Langue: Anglais




          d) Des problèmes relatifs aux troubles de chacun
Le simple fait de vouloir zoomer le texte dans une page web mal conçue peut créer de
sérieux problèmes d'accès à l'information:

   • Il arrive souvent que des blocs de texte viennent se chevaucher lorsqu’on tente
     d’augmenter la taille de la police sur certaines pages web. Un menu qui se retrouve
     chevauché par le contenu devient alors inutilisable, et l’internaute ne peut donc plus
     naviguer dans le site.

Mickaël FLOCARD                      Mémoire de Maîtrise - Wesford 2004/05   
           18
   • Il est aussi fréquent, pour des raisons d’esthétisme, que les boutons du menu soient
     composés essentiellement d’images. Si le texte de ce bouton n’est pas suffisamment
     gros pour être lisible par des personnes souffrant de déficiences visuelles, alors le
     site devient inutilisable étant donné que les images ne réagissent pas à la fonction
     “zoom” des navigateurs.
   (voir p12      : “III.3) Les inconvénients d’un site tout en image” )



L'utilisation de vidéos ou de bandes sonores auxquelles on n'associe aucun sous-titre ou
équivalent textuel devient inutile pour des non-voyants et surtout pour des personnes
sourdes.
Les personnes non-voyantes ayant recours à des plages brailles voir des synthèses
vocales, les sites composés en grande partie d'images et de cartes (géographiques ou
autres) non commentés n'ont alors aucun sens. Il existe des balises HTML* spécialement
dédiées à ce genre de défaut. La balise “<longdesc>” entre autres, permet d’associer à
l’élément concerné, une longue description sous forme textuelle, description qui
n’apparaîtra pas sur un navigateur classique, mais qui sera lue par une synthèse vocale
ou bien une plage braille. Dans le cas d’un plan d’accès à un lieu précis, une personne
aveugle obtiendra ainsi un descriptif des différentes rues à prendre pour se rendre à
l’endroit désiré, et pourra plus facilement demander l’aide de passants dans les différentes
rues empruntées.
Tous les sites ayant des menus composés d'images cliquables mais non commentées
deviennent également incompréhensibles dans un navigateur texte ou autre, car
l'internaute sait qu'il y a un lien à cet endroit précis mais ne sait pas à quelle page il est
associé. La balise HTML <img> qui permet d’incorporer des images au contenu possède
des attributs permettant de décrire avec précision ce que représente cette image et ce
vers quoi elle pointe s’il s’agit d’un lien vers une autre page.
Nous ne rentrerons pas plus dans les détails dans ce mémoire sachant que les
recommandations du W3C pour l’accessibilité des sites web (elles sont appelées les
“WCAG*”) comportent environ une centaine de points à vérifier sur chacune des pages
d’un site.
Vous retrouverez ces recommandations à la page suivante: http://www.la-grange.net/w3c/
wcag1/wai-pageauth.html .




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
           19
           e) Accessibilité et qualité visuelle peuvent-elles co-exister?
Le plus souvent la réalisation d'un site web (portail ou système d'information) est basée
sur l'aspect graphique, la créativité artistique. Bien que cette démarche ne soit pas
appropriée pour la communication, elle a amené une vision erronée du média réseau, le
réduisant à une simple façade. Les technologies éprouvées depuis quelques années
permettent de réhabiliter cet outil à la hauteur de ses capacités. Elles permettent en
particulier d'apporter une charte graphique de qualité tout en ayant une qualité structurelle
adaptée. Les techniques actuelles permettent d'obtenir une séparation complète du
contenu (HTML) et de sa mise en forme (CSS), ce qui permet de séparer la structure du
document (qui conditionne grandement son utilisabilité) de sa représentation graphique
qui reprend alors son sens de mettre en valeur un contenu réfléchi et adapté. Cette
séparation du contenu et de la mise en forme est la base de l'accessibilité, c'est elle qui
permettra de rendre le site accessible, sans nuire à la qualité visuelle. En effet, il suffit que
le contenu soit accessible, pour que le site soit techniquement accessible (via un
navigateur textuel ou vocal).


           f) Vers une “accessibilité universelle”
Un site web conçu dès le départ pour être accessible est pour sûr un site dont les divers
coûts de maintenance et de mise à jour seront minimums. En effet faire un site accessible
contraint le webmaster à en améliorer la présentation et la compréhension du contenu,
tout en respectant une structure simple mais précise du code HTML. Rien ne peut être
laissé au hasard, on obtient de ce fait une meilleure organisation dans la structure globale
du site. L'ergonomie se voit par la même occasion grandement améliorée, notamment
dans les sites très denses où le manque d'accessibilité ne concerne plus uniquement les
personnes atteintes de handicap mais bien l'utilisateur de tous les jours, qui se retrouve
souvent perdu face à des pages surchargées et mal organisées. On entend donc de plus
en plus parler d’une “accessibilité universelle”.
Avoir accès à toute l'information disponible dans le monde, du plus jeune âge à l'âge de la
retraite, est un des facteurs majeurs d'intégration sociale.
L'accessibilité d'un site web est gage de qualité et de liberté, et concerne donc l'ensemble
des utilisateurs d'internet.



     5) Interopérabilité
Le W3C s’est donner pour mission de faire fonctionner les sites web quel que soit le
matériel utilisé pour y accéder. L’interopérabilité doit permettre aux gens d’avoir la liberté
de choisir leur propre périphérique pour accéder au web, leur propre système
d’exploitation (Windows, Mac OS, Linux, ...), ainsi que les logiciels qu’ils préfèrent utiliser.




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
              20
Le but de Tim Berners-Lee, l’inventeur du web, était de fournir un langage capable de
décrire les documents de façon indépendante des différents logiciels ou navigateurs qui
seraient utilisés pour lire ces documents. Cela rejoint l’idée selon laquelle le fait de
concevoir des sites fonctionnant pour une certaine résolution ou bien encore pour un
navigateur précis est contre la liberté de l’internaute. Toute consultation de site web doit
être possible à partir de n’importe lequel des navigateurs disponibles sur le marché,
l’internaute ayant lui-même la responsabilité de mettre à jour son propre navigateur. En
effet les différents navigateurs web présents aujourd’hui tels que Firefox, Safari, Mozilla,
ou encore Internet Explorer, évoluent sans cesse vers un meilleur respect des standards
du W3C. Les mises à jour sont disponibles sur les sites de ces fabricants et doivent être
utilisées pour un meilleur fonctionnement.
Avec l’apparition du web mobile, l’interopérabilité est de plus en plus d’actualité. La
population devrait d’ici peu ne plus attendre d’être confortablement installée devant un
ordinateur pour se connecter au web car il sera de plus en plus pratique et confortable
d’utiliser son téléphone portable ou même son agenda électronique pour accéder à la
toile. Les sites conçus dès maintenant en prenant compte de cette interopérabilité ne
nécessiteront pas d’énormes coûts supplémentaires de mise à jour voire de refonte totale
du site.




V. Quelques repères pour mieux apprécier la qualité


     1) Des points de repère simples

Le but de cette partie du mémoire et de celles qui vont suivre est de donner des outils
d’appréciation et d’évaluation de la qualité à tous ceux qui souhaitent en savoir plus, en
particulier aux personnes dont le projet est de faire appel à un prestataire web pour la
conception de leur site. Pour commencer, il existe des points de repère assez simples qu’il
suffit de connaître pour pouvoir les identifier sur les sites web. Attention à ne pas faire
d’amalgames en concluant qu’un site web qui ne comporterait aucun de ces logos ou point
de repère serait un site de très mauvaise qualité. Par contre ce dont vous pouvez être sûr,
c’est que si vous les rencontrez sur un site, cela signifie que le concepteur a adopté une
démarche de qualité dans la conception de ce site, ce qui est déjà un très bon signe. Il est
nécessaire ensuite de pousser l’analyse un peu plus en profondeur pour s’assurer des
réelles compétences du prestataire.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            21
          a) Les logos du W3C
Le W3C met à la disposition des webmasters des logos permettant d’indiquer la
conformité des pages à l’internaute. Ces logos sont aussi des liens qui permettent de
vérifier directement en cliquant dessus si la page correspondante possède réellement un
code valide.

✴ Le fonctionnement est assez simple à comprendre. Admettons que vous soyez en train
 de naviguer sur le web, ou bien que vous passiez du temps à vérifier les références de
 votre potentiel futur prestataire. Si vous rencontrez sur une des pages un logo
 ressemblant à ceux ci,




il s’agit alors d’un logo de validation du W3C concernant le code HTML ou bien encore
XHTML* de la page. Aucune permission de la part du W3C n’est requise pour avoir le droit
d’insérer ce logo sur une page. Il est donc nécessaire qu’un lien y soit associé et surtout
que, lorsque vous cliquez sur ce logo, le lien vous ouvre une page de validation.
L’URL que vous devez obtenir après avoir cliqué est la suivante: http://validator.w3.org/
check/referer
Et le titre de cette page doit être: “W3C Mark Up Validation Service”.
Dans la page un message vous indiquera la validation ou non de votre page par le
validateur du W3C. Si la page est valide HTML, le message pourra être le suivant:




Dans le cas où la page de validation indique des erreurs de code, cela est souvent dû au
fait que le webmaster a fait des mises à jour de son site en omettant de vérifier
d’éventuelles erreurs de code. Il vous suffit de lui envoyer un e-mail pour avoir plus de
renseignements à ce sujet.

✴ Il existe aussi un logo permettant de vérifier que la feuille de style CSS* a été écrite
 correctement par le webmaster. Il doit être identique à celui-ci:




  L’URL que vous devez obtenir après avoir cliqué sur ce logo est la suivante: http://
  jigsaw.w3.org/css-validator/check/referer .
  Et le titre de cette page doit être: ”Résultats du validateur CSS du W3C concernant...”




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
           22
✴ Pour signaler le niveau d’accessiblité du site, le W3C met à disposition des internautes
 3 logos, allant du niveau “simple-A” (”A”) au niveau “triple-A” (”AAA”). Cela correspond
 aux différents degrés d’accessibilité d’un site web. Plus il y aura de “A”, plus le site sera
 accessible. Il n’existe donc que trois niveaux d’accessibilité, le meilleur étant le niveau
 “AAA”. Les logos sont les suivants:




Contrairement aux logos relatifs au code HTML, les logos d’accessibilité ne permettent
pas de vérifier que les règles d’accessibilité ont été réellement respectées. Les créateurs
de sites web sont donc les seuls responsables de l’utilisation de ces logos sur leurs pages.
Afin d’atteindre les différents niveaux d’accessibilité, les webmasters doivent respecter
scrupuleusement les recommandations du W3C concernant l’accessibilité, appelées les
“Web Content Accessibility Guidelines” (WCAG). Le document officiel se situe à l’adresse
suivante: http://www.w3.org/TR/WAI-WEBCONTENT/ . Pour chaque recommandation
émise, un niveau de priorité est donné (il y en a 3).
(voir annexe 3 p60     : “Une des recommandations des WCAG”).
Donc, pour exemple, si une page web respecte tous les points de vérification
correspondant à la priorité n°1 et donc au niveau “simple-A”, alors le webmaster est en
droit d’insérer le logo suivant sur la page:




Par contre, s’il respecte tous les points de priorité n°1 et quelques uns mais non la totalité
des points de priorité n°2, alors il ne pourra pas insérer le logo correspondant au niveau
“double A”.
 Voici quelques exemples de sites web où vous pourrez rencontrer ces différents logos:

   •   http://www.braillenet.org
   •   http://www.recrutement.bnpparibas.com


✴ De plus en plus de sites respectent les standard du W3C, mais n’incorporent pas les
 logos du W3C dans leurs pages pour des raisons de cohérence graphique. En effet le
 W3C ne permet pas de modifier le design des logos de validation, il n’est donc pas
 toujours évident de pouvoir les intégrer à toute sorte de charte graphique. C’est pour
 cette raison que dans certains sites web vous rencontrerez des liens textuels mais ayant
 les même fonctionnalités que les logos. Ils sont en général situés dans le pied de page
 et peuvent être soit seuls, soit intégrés à une phrase comme celle-ci:

             “Ce site respecte les standards HTML 4.01, CSS 2 et WAI-AAA”




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
            23
✴Voici quelques exemples de sites web où vous pourrez rencontrer ces liens textes
 équivalents aux logos précédents (se reporter au pied de la page web):

   •   http://www.csszengarden.com
   •   http://www.openweb.eu.org
   •   http://www.puitsdargent.com



           b) Les logos du label “Accessiweb”
L’association Braillenet, qui participe à la concertation internationale menée au sein de la
Web Accessibility Initiative (WAI), a créée Accessiweb, un “centre de ressources et de
recherche sur l’accessibilité du web”. Accessiweb décerne un label de qualité à tous les
sites web faisant preuve d’un bon niveau d’accessibilité. Inspiré directement des
recommandations du W3C en ce qui concerne l’accessibilité, Accessiweb décerne trois
niveaux de qualité aux sites web répartis à travers 92 critères, sachant que le niveau
accordé au site web correspondra à celui de la page possédant le plus bas niveau
d’accessibilité.


✴ Les trois niveaux sont les suivants:
   •   Le niveaux bronze
       Ce niveau comporte 55 critères à respecter dans une page web. C’est le plus bas
       niveau d’accessibilité permettant de pouvoir faire preuve de qualité par l’affichage
       du logo correspondant.

       Les 55 critères sont consultables sur la page web suivante: http://www.accessiweb.org/
       fr/Label_Accessibilite/criteres_accessiweb/55_accessiweb_bronze/

       Le logo correspondant au niveau bronze est le suivant:




   •   Le niveaux argent
       Ce niveau comporte 23 critères supplémentaires par rapport au niveau bronze.
       Les 23 critères sont consultables sur la page web suivante: http://www.accessiweb.org/
       fr/Label_Accessibilite/criteres_accessiweb/23_accessiweb_argent/




Mickaël FLOCARD                       Mémoire de Maîtrise - Wesford 2004/05   
         24
   •   Le niveaux or
       Ce niveau niveau comporte 14 critères supplémentaires par rapport au niveau
       argent. Il englobe donc la totalité des 92 critères Accessiweb. Il est le plus haut
       niveau de qualité décerné par Accessiweb, et correspond au niveau “triple-A” du
       W3C.
       Les 14 critères sont consultables sur la page web suivante: http://www.accessiweb.org/
       fr/Label_Accessibilite/criteres_accessiweb/14_accessiweb__or/

       Le logo correspondant au niveau or est le suivant:




✴ Le processus de labellisation par le centre Accessiweb a un coût pour le propriétaire du
 site, contrairement à l’utilisation des logos du W3C. En contre partie de ce coût, qui peut
 atteindre une somme de 3600 € hors taxes pour l’obtention des labels “Argent” ou “Or”,
 l’organisme effectue une évaluation de l’accessibilité du site à l’aide de différents outils
 tels que ceux dont nous avons parlé dans le chapitre consacré à l’accessibilité. Ensuite
 une réévaluation est effectuée au bout de 12 mois afin de vérifier que le site a gardé le
 même niveau d’accessibilité malgré les différentes mises à jour et ajouts de contenu au
 cours de l’année écoulée.


✴ Parmi les outils utilisés pour contrôler l’accessibilité, nous retrouvons Internet Explorer,
 Netscape et Opéra, qui sont 3 navigateurs web classiques. Sont aussi utilisés “Jaws for
 Windows” et “IBM Home Page Reader” qui sont des lecteurs d’écran (”screen readers”
 en anglais) permettant la lecture du document web par un logiciel plutôt que par
 l’humain , pour ensuite pouvoir retranscrire l’information sous forme vocale ou braille. Le
 navigateur texte “Lynx” et le validateur de code HTML du W3C sont mis également à
 contribution lors de ces tests.


✴ Voici quelques exemples de sites web ayant obtenu le label Accessiweb:
   • http://www.cr-languedocroussillon.fr

   • http://www.outre-mer.gouv.fr

   • http://www.legrandchalon.fr

   • http://www.tramway.paris.fr

   • http://www.integrance.fr




Mickaël FLOCARD                       Mémoire de Maîtrise - Wesford 2004/05   
         25
            c) L’absence de toute restriction d’accès
De nombreux sites web affichent de manière évidente le fait qu’ils ne prennent pas en
compte la totalité des internautes, et donc leur incompétence en matière d’accessibilité (il
ne s’agit pas ici uniquement d’accessibilité aux handicapés) et de qualité web.
On retrouvera sur ces sites web ce genre de propos:
   • “Ce site nécessite le plug-in Flash”
   • “Ce site est optimisé pour une résolution 800x600”
       (ou pour tout autre résolution)
   • “Ce site est optimisé pour Internet Explorer”
       (ou pour tout autre navigateur)
Si votre but est de faire appel à un prestataire fournissant un contenu de qualité et tout ce
que cela implique en terme de pérennité, de maîtrise des coûts, ..., vous pouvez d’ores et
déjà rayer de votre liste ceux affichant les propos précédents.
(voir p40    : “VI.Valorisation de la qualité: justification et argumentation” )




     2) Quelques points de contrôle d’une ergonomie correcte
La présence d’une bonne ergonomie dans un site web est quelque chose de fondamental
si l’on veut conserver ou développer le nombre de visiteurs. Un internaute qui rencontre
des difficultés de navigation ne prendra pas le temps de comprendre comment le site
fonctionne, il le quittera très rapidement.
Un site web bien conçu, dans lequel l’ergonomie aura été profondément étudiée,
apportera une très bonne “expérience utilisateur” à l’internaute, tellement agréable et
confortable qu’il trouvera l’information recherchée sans vraiment se rendre compte de
toute la technologie mise en place en amont pour parvenir à ce résultat. Un site web doit
être perçu comme un outil d’accès rapide à un service ou à une information et non comme
un obstacle, source d’une perte de temps inacceptable pour l’internaute.
Les points de contrôle suivants doivent permettre d’évaluer la bonne utilisabilité d’un site
web. Ils ne demandent pas des compétences spécifiques en informatique, mais seulement
un bon sens de l’observation.


            a) Organisation par rubriques
Tout le contenu disponible dans un site doit être organisé en différentes rubriques, de
façon à pouvoir obtenir une hiérarchisation du contenu et une complémentarité entre les
rubriques.




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
            26
Dans un site de vente en ligne on retrouve cette organisation par rubriques à travers les
différentes catégories de produit. Il est plus délicat de faire un classement des produits par
catégorie dans ce genre de site étant donné que les perceptions peuvent être assez
différentes d’un internaute à l’autre. Un premier internaute peut s’attendre à trouver un
produit dans une certaine catégorie alors qu’un deuxième internaute le chercherait plutôt
dans une autre catégorie.
En ce qui concerne l’évaluation de ce premier élément, il suffit de naviguer à travers le site
pour vérifier si l’organisation de l’information présente est logique ou non.


           b) Habillage du site
On entend par habillage tous les éléments qui caractérisent un site, cela peut aller du
code couleur utilisé à l’emplacement et la présentation du menu.

✴Le code couleur doit être évident et clair. Une couleur pour le fond de page. Une couleur
 pour le texte apportant un contraste suffisamment important avec celle du fond de page.
 Les plus utilisées sont noires sur fond blanc, c’est ce qu’il y a de plus lisible pour l’oeil
 humain. Et, aspect très important, une couleur utilisée pour les liens doit être
 suffisamment distincte de celle utilisée pour le texte, tout en étant suffisamment visible
 par rapport à la couleur de fond. Enfin ces trois couleurs doivent s’accorder un minimum
 pour créer un ensemble agréable à regarder, sans oublier de prendre en compte le fait
 qu’une partie de la population est atteinte de déficiences telles que le daltonisme ou
 encore une baisse de la vue et qu’il est donc préférable de choisir des teintes de couleur
 de façon à ce qu’elles soient suffisamment différenciables.

✴Les différents éléments de structure tels que les titres de page, les titres de chapitres, les
 paragraphes, les listes d’éléments, doivent être présentés de la même façon dans la
 globalité du site, afin que l’internaute déchiffre de plus en plus vite le contenu des pages
 au fur et à mesure de sa navigation. L’effort qu’il fournit afin d’examiner une page et
 comprendre si l’information qu’il cherche y est présente doit être décroissant tout au long
 de sa visite.

✴Le haut de la page comporte en général le logo de l’entreprise. Le pied de page
 comporte lui les liens d’accès rapides vers la page de contact, le plan du site et autres
 informations d’ordre général. Ces éléments doivent également être positionnés
 exactement de la même façon dans tout le site.




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
             27
✴De nombreux sites font l’erreur de proposer une page d’accueil complètement différente
 du reste du site, comme s’il était nécessaire de faire une introduction avant de rentrer
 dans le site. Cette première page n’apporte strictement rien à l’internaute mais lui fait
 perdre du temps avant même qu’il ait commencé à naviguer. Sa première réaction face à
 une telle page d’introduction va être de chercher où il va bien pouvoir cliquer pour rentrer
 dans le site. Cette première action peut prendre de quelques secondes à plus d’une
 minute suivant le degré d’imagination des concepteurs. Ensuite, une fois qu’il aura
 finalement atteint son but, l’internaute va se retrouver devant une page totalement
 différente, avec un menu, un contenu, une structure..., tout ce qu’il n’y avait pas sur la
 page d’accueil. Il va lui falloir de nouveau un certain temps d’adaptation avant de pouvoir
 réellement commencer à être actif. On est ici devant un cas réel et très courant d’ “anti-
 ergonomie”.

✴Et enfin le menu, qui se trouve être l’outil principal de navigation dans le site est un point
 très important pour une bonne utilisabilité du site. Il doit être positionné à un endroit
 précis de la page (à gauche, en haut, ou parfois à droite) et rester constant dans sa
 position dans tout le site. Le nombre d’éléments du menu ne doit pas changer en
 fonction de la page dans laquelle on se trouve. Plutôt que d’éliminer un lien du menu car
 on se trouve dans la page correspondante à ce lien, il est largement préférable de
 désactiver ce lien et de faire en sorte que l’internaute se rende compte qu’il est devenu
 différent des autres au moment où il est entré dans cette page. Ce lien désactivé peut
 par exemple se transformer en caractère gras, ou bien en italique, ou encore en
 modifiant légèrement sa couleur de fond. De façon intuitive, cet élément de distinction
 des différentes pages du site va devenir un point de repère pour l’internaute.


            c) Barre de navigation
La présence d’une barre de navigation est fortement appréciée notamment dans les sites
à fort contenu qui vont posséder plusieurs sous-rubriques. Plus on atteint des niveaux
profonds d’un site web et plus l’internaute a du mal à savoir d’où il vient, à se repérer. Ce
manque de repère est encore plus évident lorsque l’internaute rentre directement dans
une de ces pages grâce à une recherche par mots clés dans un moteur. Le fait de le
renseigner sur le chemin parcouru pour arriver jusqu’à cette page peut lui rendre service
et lui faire gagner du temps. Cela peut par exemple lui servir à remonter d’un niveau et
avoir ainsi un aperçu des différents liens proposés dans la rubrique supérieure, liens qui
devraient, si le site est bien conçu, être complémentaires et avoir un rapport avec la page
par laquelle il a introduit le site et donc lui donner des informations supplémentaires sur ce
qu’il recherche.
La barre de navigation, si elle existe, est facilement repérable. Elle se trouve logiquement
en haut de page et est souvent présentée de la sorte:
“Vous êtes ici: rubrique principale > rubrique de 2ème niveau > rubrique de 3ème niveau > page consultée”




Mickaël FLOCARD                        Mémoire de Maîtrise - Wesford 2004/05     
                  28
La partie “page consultée” de la barre de navigation précédente n’est pas un lien car elle
représente l’endroit ou l’internaute se situe dans l’architecture du site. Il n’a donc aucun
intérêt à se rendre à un endroit où il se trouve déjà. Par contre les 3 autres sont des liens
qui permettent de remonter aux différentes rubriques. Par exemple, en cliquant sur le lien
“rubrique de 3ème niveau”, l’internaute va se retrouver sur la page proposant dans son
contenu un lien d’accès à la page nommée ici “page consultée”.
Voici un exemple concret sur le site web de la Chambre de Commerce et d’Industrie de
Grenoble:


                             Site web de la CCI de Grenoble:




                      “Barre de navigation”
URL du site web: http://www.grenoble.cci.fr .


          d) Temps de chargement des pages
De nombreuses études ont été réalisées à ce sujet, certaines concluant que le poids d’une
page web devait se situer entre 30 et 40 Ko (Kilo octets), et d’autres que le poids et le
temps de téléchargement avait certes une importance mais que la réaction de l’internaute
était en grande partie conditionnée par la continuité du chargement. Cela signifie que si
lors du chargement d’une page, l’internaute doit patienter devant une page blanche
jusqu’au moment où le contenu de la page apparaît mais en une seule fois, alors il y a de
grandes chances qu’il ne patiente pas très longtemps et ferme la fenêtre en cours. Par
contre, si pour un même temps de chargement relativement long (que l’on peut évaluer à
environ plus de 5 secondes), la page apparaît petit à petit par différents blocs de contenu,
alors l’internaute serait plus susceptible d’attendre la fin du chargement.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             29
Quoiqu’il en soit, des études poussées dans ce domaine ne sont pas nécessaires pour
comprendre que le confort de navigation dans un site web est directement lié à la rapidité
d’affichage des pages. L’idéal serait de pouvoir obtenir une rapidité comparable à celle
perçue lorsqu’on tourne une page d’un livre. Par conséquent, plus un site web sera réactif
et plus l’expérience vécu par l’internaute sera satisfaisante, jusqu’au point le plus
intéressant où il ne pensera même plus qu’autrefois les pages mettaient du temps à
s’afficher et naviguera naturellement dans le site.
En avril 2005, 69,5% des foyers Français connectés à internet le sont par une connexion à
haut débit (source: “Le journal du net”, http://www.journaldunet.com/cc/02_equipement/
equip_hautdebit_fr.shtml ), et sachant que début 2004, 37% de la population française
avait accès à internet (source: “INSEE”, http://www.insee.fr/fr/ffc/ficdoc_frame.asp?
doc_id=1377 ), cela correspond à environ 6 millions de personnes en France reliées au
web avec une connexion bas débit !
Il est donc important que les pages des sites que vous visitez dans le but de vous faire
une idée sur leur utilisabilité, se chargent rapidement, surtout si vous effectuez ces tests à
l’aide d’une connexion à haut débit. Si une page met plus de 3 ou 4 secondes à se
charger sur votre ordinateur alors que vous disposez d’une connexion à internet à haut
débit telle que l’ADSL, alors il y a de fortes chances qu’une personnes essayant de
charger cette même page avec une connexion bas débit renonce face un temps de
chargement beaucoup trop long.


           e) Organisation des pages à fort contenu
Les pages web doivent avoir un contenu le plus synthétique possible. L’utilisation de listes
à puces est fortement recommandée, ainsi que la mise en évidence des titres de pages
qui doivent refléter au maximum le contenu présent dans la page. Une page web trop
longue et dépourvue de points de repère permettant de savoir si l’information ou le thème
recherché y est abordé, devient vite indigeste pour le lecteur. Face au nombre important
de sites présents sur le web et susceptibles d’aborder le sujet recherché, l’internaute n’a
pas le temps de s’attarder à lire des pages et des pages sans être sûr de trouver ce qu’il
cherche.
Une page web dont le titre ne serait pas explicite et dont le contenu ne serait pas un
minimum structuré et synthétique est pour sûr une page qui fera fuir l’internaute, même si
au final, l’information qu’il recherchait était belle et bien présente dans cette page.
Le meilleur outil que vous pouvez rencontrer sur le web en ce qui concerne les pages
longues et leurs utilisabilités est une sorte de plan de page positionné en haut de la page
web, et reprenant sous forme de liens à accès rapide les différents points importants
traités tout au long de cette page. Pour un exemple concret, pour pouvez consulter la
page d’introduction à l’accessibilité du W3C dont voici une page capture d’écran:




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             30
                                       Site du W3C:

                                                                     Plan de page




URL de cette page: http://www.w3.org/WAI/intro/accessibility.php    .

Les liens qui se trouvent dans l’encadré en pointillés nommé “Page Contents” sont donc
ces liens d’accès rapides dont nous parlions précédemment. Prenons l’exemple du lien
“For More Information”. Tout internaute possédant un minimum d’expérience comprendra
de façon intuitive qu’en cliquant sur ce lien, il accédera à l’avant dernier chapitre de cette
page et qu’il aura de grandes chances d’obtenir dans ce chapitre une information
approfondie sur l’accessibilité web ou bien encore des liens permettant de se diriger sur
des pages développant de façon plus poussée ce sujet. Cet encadré permet aussi, sans
perdre de temps à parcourir la page par différentes méthodes de balayage, de se rendre
compte de la totalité du contenu présent et de sa pertinence par rapport à ce que l’on
recherche.


           f) Un nombre de clics minimum
Un site doté d’une bonne utilisabilité est un site où l’on accède à ce qu’on l’on cherche le
plus rapidement possible et donc en un minimum de clics. Il est difficile d’évaluer de façon
précise le nombre de clics qui restera acceptable par un internaute étant donné que cela
dépend encore une fois de la perception de chacun (tout comme le temps acceptable de
chargement d’une page).




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             31
Plus ce nombre de clic est petit et mieux c’est, surtout lorsqu’il s’agit de sites de vente en
ligne. L’idéal dans ce genre de sites semble être de 3 clics maximum avant d’atteindre le
produit que l’on désire acheter, sinon l’acheteur potentiel risque fortement de changer de
site web sans même avoir atteint la fiche technique du produit qu’il cherchait et donc sans
avoir pu éventuellement découvrir une offre intéressante.


           g) Prise en compte de la diversité du matériel utilisé
Les internautes ont le choix entre une multitude de tailles d’écran, et surtout il ont la
possibilité de modifier leur résolution d’écran. Ce paramètre doit avoir été pris en compte
lors du développement du site, car dans les deux cas opposés qui vont suivre, l’utilisabilité
peut être sérieusement affectée.

✴Tout d’abord un petit rappel simple sur ce qu’est la résolution de l’écran. Beaucoup de
 personnes ont tendance à mélanger les notions de “taille de l’écran en pouces” et de
 “résolution de l’écran”. La taille de l’écran correspond à la longueur de la diagonale de
 l’écran, exprimé en pouces. Cette unité de mesure, le pouce, est équivalente à 2,54 cm.
 Donc pour un écran annoncé avec une taille de 15 pouces, cela signifie que la longueur
 de la diagonale de son écran sera d’environ 38 cm.


                             Exemple d’un écran 15 pouces:



                                         15
                                              po
                                                uc
                                                   es



  La résolution de l’écran correspond quant à elle au nombre de pixels que l’écran
  comporte dans sa largeur et dans sa hauteur. Par exemple, pour résolution de 800x600,
  cela signifie que l’écran dispose de 800 pixel dans sa largeur et de 600 pixel dans sa
  hauteur (voir la figure suivante). Il est possible de modifier soi-même la résolution de
  son écran d’ordinateur. C’est la qualité de la carte graphique installée qui va permettre
  une plus ou moins grande résolution d’écran pour un ordinateur donné. Plus la
  résolution d’un écran sera importante, et plus on aura de la place sur son écran et donc
  la possibilité de voir un maximum de choses.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             32
                      Exemple d’un écran en résolution 800x600:

                                      800 pixels




                                                      600 pixels
✴Le premier cas qui peut se présenter est celui où un webmaster décide de développer
 un site d’une largeur fixe comprise entre 600 et 700 pixels afin que la taille de ce dernier
 s’intègre au mieux dans celle des écrans 800x600. Tous les internautes ayant du
 matériel récent tel que des écrans de taille supérieure à 20 pouces et des résolutions
 égales ou supérieures à 1024x768 auront sur leur écran un site qui au final sera très
 petit et dont la taille ne pourra pas être modifiée par la fonction “zoom” du navigateur.
 Autant dire qu’ils ne resteront pas très longtemps sur ce site vu le manque de confort de
 lecture provoqué par cette petite taille. Sachant qu’il y a actuellement près de 69%
 d’internautes utilisant une résolution supérieure à 1024x768 (voir le graphique sectoriel
 qui suit), on comprend qu’il soit aujourd’hui de plus en plus risqué de concevoir des sites
 web optimisés pour fonctionner sur du 800x600.


                          Répartition des résolutions d’écran:

            > à 1024x768            1024x768                   800x600        Autres


                                                25%

                                                           6%

                                 55%                   14%




                            source: “W3 Schools”, juillet 2005
           Page web: http://www.w3schools.com/browsers/browsers_stats.asp



Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            33
✴Dans le cas opposé au précédent, le webmaster peut choisir de développer un site web
 par rapport à sa propre résolution d’écran, le 1024x768 par exemple. Le site devient
 alors difficilement consultable sur une résolution 800x600 puisque une barre de
 défilement horizontale apparaît étant donné que la largeur du site ne rentre pas
 entièrement dans l’écran. Du point de vue ergonomique, cette barre horizontale est très
 gênante et ne peut que déplaire à l’internaute. 25% des internautes utilisent encore une
 résolution 800x600 (voir le graphique précédent), il est donc nécessaire de continuer à
 les prendre en compte dans le développement des sites web.



     3) D’un point de vue plus technique
Pour ceux qui souhaiteraient aller un peu plus loin dans l’analyse de la qualité d'une page
web, rien de tel que de regarder directement le code source HTML* de la page web qui
vous intéresse. Cela peut dans un premier temps paraître assez compliqué et réservé aux
informaticiens alors qu'en fait ce code reste assez simple d'accès, contrairement aux
différents langages de développement informatique tels que JAVA*, C++*, ...
Le tout est de comprendre de quelle façon le code HTML est structuré et quelles
informations de base il peut nous donner.


          a) Ouverture du fichier HTML
Avant toute chose, il vous faut ouvrir le code source de la page web sur laquelle vous vous
trouvez. Pour cela la méthode va dépendre de votre système d’exploitation, c’est-à-dire si
vous êtes sur un PC avec Windows* ou bien sûr une machine Apple avec Mac OS X*
installé.

✴Sous Windows:

  Lancez le navigateur Internet Explorer (démarche similaire pour les autres navigateurs)
  et ouvrez une page du site web que vous voulez analyser.
  Dans le menu contextuel, cliquez sur: “Affichage > Source” .
  Une nouvelle page s’ouvre alors, il s’agit du code source HTML de la page web qui était
  en cours.

✴Sous Mac OS X:

  Lancez le navigateur Safari (démarche similaire pour les autres navigateurs) et ouvrez
  une page du site web que vous voulez analyser.
  Dans le menu contextuel, cliquez sur: “Présentation > Code source”.
  Une nouvelle page s’ouvre alors, il s’agit du code source HTML de la page web qui était
  en cours.




Mickaël FLOCARD                  Mémoire de Maîtrise - Wesford 2004/05   
            34
           b) Structure d’une page HTML
Le code HTML que vous apercevez sur cette page fonctionne à l’aide de balises
imbriquées. Ces balises sont tous les éléments écrits de cette forme: “<...>” ou </...>. Elles
sont en quelque sorte la séparation entre le texte normal et le code HTML. Chaque
élément d’une page HTML (le titre de la page, un lien, un paragraphe sont des exemples
d’élément) possède un début et une fin. La balise HTML que l’on écrira “<nom de
l’élément>” marquera le début de cet élément, et la balise HTML que l’on écrira “</nom de
l’élément>” en marquera la fin. Différentes balises vont remplir différentes fonctions.
Certaines vont permettre l’affichage de tableaux ou de listes à puces alors que d’autres
vont permettre de signaler la présence d’un passage important, voire d’une citation.
Par exemple, pour le titre d’une page web, on écrira en HTML la ligne suivante:
 <title>ici le titre de la page</title>

✴La structure globale d’une page HTML est la suivante:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
 </head>
 <body>
 </body>
</html>


✴<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  La premier balise, que l’on nomme le “doctype” est en quelque sorte une balise
  d’identification du langage HTML de la page. Elle se trouvera toujours à cet endroit,
  dans le haut de la page. Le navigateur va dans l’ordre ouvrir un fichier HTML puis tenter
  de le lire, afin ensuite de le retranscrire à l’écran en lui donnant l’aspect voulu par le
  concepteur. Lorsqu’il essaye de lire ce fichier HTML le navigateur ne peut pas deviner
  seul dans quel style de HTML il a été écrit. Cette ligne sert donc à spécifier la version
  du langage HTML qui a été utilisé pour coder la page. Ces versions ont évolué au cours
  du temps, un peu comme les différentes versions du système d’exploitation Windows,
  pour faire simple. La version la plus couramment utilisée aujourd’hui est le “HTML 4.01
  Transitional”, c’est celle que l’on retrouve dans notre exemple ci-dessus. “DTD” signifie
  en Français “Déclaration du Type de Document”. La présence de cette ligne est
  nécessaire pour les raisons qui viennent d’être évoquées, mais aussi parce qu’il est
  impossible de valider une page HTML à l’aide du validateur du W3C si cette ligne
  d’identification syntaxique est absente du fichier.

✴<html>...</html>
  Le début de la page est marqué par la balise “<html>” et la fin par “</html>”. Ces
  balises sont obligatoirement présentes dans tout fichier HTML.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             35
✴<head>...</head>
  L’en-tête du document se trouve entre les balises “<head>” et “</head>”. On va y
  retrouver toutes sortes d’informations sur la page web comme son auteur, une
  description courte de son contenu, une liste de mots clés en rapport avec la page, et
  surtout, le titre de la page, qui est un des éléments très importants pour un bon
  référencement. c’est aussi à cet endroit que seront placées les balises permettant de
  faire la liaison entre la page HTML et sa feuille de style CSS.

✴<body>...</body>
  Le corps du document se trouve lui entre les balises “<body>” et “</body>”. C’est à cet
  endroit que le contenu visuel de la page web sera mis en place, c’est-à-dire le menu,
  les textes, les liens, les images, ...


           c) Les balises à vérifier
Le but de ce mémoire n’étant absolument pas de faire du lecteur un expert en HTML, nous
nous contenterons d’apprendre à vérifier la présence des principales balises ainsi que leur
bonne utilisation.

✴Présence du “doctype”:
  Une fois le fichier HTML ouvert, la première chose à vérifier est que la ligne identifiant le
  langage HTML utilisé est bien présente. Dans le cas contraire, c’est un assez mauvais
  signe, cela peut par exemple signifier que le webmaster ne maîtrise pas du tout le
  langage HTML et qu’il utilise un éditeur de code sans trop savoir ce que cet éditeur fait.
  Cela devient très gênant lorsqu’il faut effectuer des modifications internes au code
  HTML afin de pouvoir le faire valider par le validateur du W3C ou bien encore si l’on
  veut par la suite optimiser le référencement d’une page précise du site.

✴Présence de la balise “<title>”:
  La balise “<title>” est très importante et doit obligatoirement être présente dans le code
  HTML (il arrive qu’elle soit absente de certains sites web!). Elle se situe dans l’en-tête
  de document, c’est-à-dire entre les balises “<head>” et “</head>. C’est elle qui va
  contenir le titre de la page web. Ce titre est ce que vous voyez tout en haut de votre
  fenêtre du navigateur, comme dans la capture d’écran suivante:




Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
             36
                  Capture de la page d’accueil du site de l’ESC Wesford:




  URL du site: http://www.wesford.fr .



  Si vous ouvrez le code HTML (voir p34           : “V.3)a)Ouverture du fichier HTML” ) de la
  page d’accueil du site de Wesford, vous pourrez vérifier la présence de la ligne
  suivante, spécifiant le titre de la page:
  <title>Wesford :: Ecole Superieure de commerce</title>
  Ce titre est très utile pour plusieurs raisons:

      ✓Premièrement pour le référencement, car l’internaute, lorsqu’il fait une recherche
       sur un moteur (Google, Yahoo,...), saisit un ou plusieurs mots clés. Le fait que ces
       mots clés soient présents ou non dans le titre d’une page web a une forte
       influence sur le positionnement de cette page dans les résultats donnés par le
       moteur de recherche. Ce titre, en plus de devoir être présent, doit être choisi avec
       pertinence en fonction du contenu de la page web pour ainsi refléter au maximum
       l’information présente dans ce contenu et favoriser le référencement de la page.

      ✓Une des fonctions de votre navigateur permet d’obtenir un historique des plus
       récents sites que vous avez visité (cette fonction se nomme simplement
       “Historique”). Ce dernier vous présente les pages web dans l’ordre de vos visites,
       de la plus récente à la plus ancienne. La liste des pages est établie grâce au titre
       de chacune. Celles ne comportant pas de titre sont donc difficilement identifiables
       par l’internaute.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            37
       ✓Enfin, le fait que le titre de page apparaisse en haut de la fenêtre de votre
        navigateur, est un élément supplémentaire permettant d’améliorer l’ergonomie de
        votre site web, à condition bien sûr que le contenu de ce titre soit formulé dans
        cette optique. L’idéal pour une bonne utilisabilité est de retrouver le même style
        de formulation que celui utilisé dans la barre de navigation.
            (voir p28    : “V.2)c) Barre de navigation” )
            Le titre de page peut donc servir de repère à l’internaute, lui indiquant de façon
            rapide dans quelle page il se trouve et éventuellement de quelle rubrique provient
            cette page.


✴Utilisation de feuilles de style CSS*:
  Il est possible dans l’en-tête du document de se rendre compte si des feuilles de style
  sont utilisées ou non. Attention à ne pas conclure que leur présence signifie qu’elles
  sont utilisées de façon optimale, c’est-à-dire pour une séparation totale du contenu et
  de la mise en forme. Leur présence signifiera au minimum que le webmaster adopte
  une démarche de qualité à travers ses méthodes employées pour l’écriture du code et
  la mise en forme des éléments graphiques.
  La balise utilisée pour créer un lien entre le fichier HTML et la feuille de style est de la
  forme suivante:
  <link rel="stylesheet" type="text/css" media="all" href="...">
  Elle se situe entre les balises “<head>” et “</head>” dans le haut de la page HTML. Ne
  cherchez pas, dans un premier temps, à comprendre dans le détail le contenu de cette
  balise, le but ici est seulement de l’identifier et de contrôler sa présence.
  Toute balise commençant par “<link ...” et comportant les termes “rel=”stylesheet”” et
  “type="text/css"” est donc une balise faisant appel à une feuille de style. Il est possible
  de trouver plusieurs feuilles de style dans un même fichier HTML. Il pourra par exemple
  y en avoir une qui sera réservée aux écrans d’ordinateur (c’est le navigateur web qui
  détectera le style de support concerné), et une autre qui sera réservée aux écrans de
  téléphones portables ou PDA*.



              d) Vérifier l’absence de frames
Pour rappel, l’utilisation des frames permet de diviser la page affichée par un navigateur
en plusieurs zones ou fenêtres indépendantes les unes des autres. Les frames,
développées par Netscape sont apparues avec la version 3.0 du HTML. Leur utilisation est
aujourd’hui fortement déconseillée et de moins en moins supportée par les navigateurs
web récents.
(voir p 6       : “II.2)b) L’utilisation des frames” )




Mickaël FLOCARD                         Mémoire de Maîtrise - Wesford 2004/05   
        38
Ouvrez le fichier HTML comme indiqué précédemment. Repérez la fin de l’en-tête de
document, signalé par la balise “</head>”. Habituellement vous devriez retrouver à cet
endroit la balise marquant le début du corps de document, c’est-à-dire la balise “<body>”.
Si des frames sont utilisées vous vous en rendrez compte en remarquant que la balise
“<body>” sera remplacée par la balise “<frameset>”. La structure de la page HTML sera
donc de la forme suivante:

     <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     <html>
          <head>
          </head>
          <frameset>
          </frameset>
     </html>


            e) Vérifier l’absence de tableaux
La méthode qui a été la plus utilisée pour améliorer le design et la mise en page des sites
est sans doute celle d’utiliser les tableaux comme élément de mise en page. Or la balise
“<table>” doit être réservée à ce pour quoi elle a été conçue, c’est-à-dire à présenter des
données tabulaires et non de la mise en page. D’autres balises HTML permettent de
mettre en page et de positionner correctement les différents éléments d’une page, il s’agit
des balises “<div>”.
La refonte des sites web déjà existants mais dont la structure est uniquement basée sur
les tableaux représente un travail considérable et laborieux. De plus, l’utilisation des
tableaux pour la mise en page compromet l’accessibilité des sites non seulement à toute
personne handicapée utilisant un matériel alternatif pour accéder aux pages web mais
aussi aux utilisateurs de téléphones cellulaires pour l’accès au web.
Pour vérifier que les tableaux sont utilisés à bon escient dans une page web il faut dans
un premier temps analyser le contenu de la page sur la fenêtre du navigateur. Examinez
pour cela toute l’information présente et déterminez si certains éléments sont de réels
tableaux. S’il y en a dans la page que vous êtes en train d’analyser, alors cherchez une
page web du même site dans laquelle il n’y aurait aucun tableau.
Une fois que vous avez réussi à trouver une page qui ne devrait pas contenir de tableaux,
ouvrez le fichier HTML de cette page comme indiqué précédemment. Reportez-vous au
corps du fichier, c’est-à-dire entre les balises “<”body”> et “</body>”. Maintenant
recherchez la présence de la balise “<table>”, c’est elle qui caractérise le début d’une
déclaration de tableau. Si vous ne la trouvez, c’est bon signe (excepté bien sûr si vous
rencontrez la balise “<frameset>”), dans le cas contraire cela veut dire le code HTML a été
utilisé de façon détourné pour permettre de placer les éléments de la page sans difficulté,
et cela signifie aussi que la qualité du code HTML de ce site web est à revoir entièrement.
(voir p 7    : “II.2)a) L’utilisation des tableaux” )



Mickaël FLOCARD                      Mémoire de Maîtrise - Wesford 2004/05   
        39
VI. Valorisation de la qualité: justification et argumentation


     1) Introduction
Concevoir des sites web de qualité et dotés d’une certaine éthique de par leur accessibilité
à tous semble être, à première vue, le meilleur choix pour tout prestataire web. Or, on
constate assez rapidement en naviguant sur la toile que cette catégorie de sites web est
très minoritaire, y compris dans les services publics qui sont pourtant les plus susceptibles
de se sentir concernés par cette notion d’accessibilité.
Quelle peut être la raison de ce constat? Il est difficile de croire que les agences web n’ont
aujourd’hui aucune connaissance des actions du W3C et de la possibilité d’acquérir de
nouvelles méthodes de travail permettant une meilleur équité des solutions web et surtout
un grand pas en avant vers l’uniformisation d’internet.
Il semblerait plus judicieux de pencher vers une méconnaissance des technologies web de
la part des différents entrepreneurs ou autres services publics. En effet le web est devenu
un outil incontournable de notre société, mais il a émergé à une telle vitesse que la
majorité des gens l’utilisent sans vraiment en comprendre le fonctionnement. Comment ne
pas accepter le fait qu’un chef d’entreprise ou encore un responsable de communication
au sein d’un organisme public n’aient pas la moindre idée sur ce qu’ils vont devoir exiger
auprès d’un prestataire web, sur ce qu’ils vont devoir stipuler de façon précise dans le
cahier des charges ?
L’objectif d’un prestataire web fournissant des solutions de qualité va donc être de
surmonter une méconnaissance des particularités de son métier de la part de son client.
De telles compétences peuvent apparaître aujourd’hui comme un avantage concurrentiel,
mais il est évident qu’elles seront dans quelques années des conditions nécessaires à la
survie de tout prestataire web.
Le défi actuel de tout prestataire axé sur la qualité est donc d’être reconnu auprès de la
clientèle comme étant à même de fournir des solutions de qualité supérieure à celles des
autres prestataires.
Les points qui suivent peuvent servir de base pour l’argumentation et la valorisation d‘une
démarche de qualité dans la conception de sites web:
   • Pérennité des sites
   • Amélioration des ventes
   • Diminution des coûts de mise à jour
   • Maîtrise des dépenses en bande passante
   • Maîtrise des coûts de développement
   • Le point de vue légal




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             40
     2) Pérennité des sites

          a) Par l’utilisation des feuilles de style

 Le respect des standards et l’utilisation de feuilles de style CSS* permettent une
 séparation totale du contenu et de la mise en forme des documents web. Le travail du
 graphiste est donc uniquement stocké dans la ou les feuilles de style CSS du site web.
 De ce fait, si pour une quelconque raison, la charte graphique d’un site web doit être
 entièrement modifiée alors que le contenu doit rester le même, il suffira de faire
 intervenir un graphiste uniquement sur la nouvelle feuille de style. Le site web peut donc
 garder la même structure et le même contenu (qui pourra lui aussi être évolutif, mais de
 façon indépendante) au fil du temps et suivre ainsi l’évolution de la charte graphique liée
 à la marque, à l’entreprise ou encore au service public concerné.

          b) A travers l’évolution des navigateurs

 Internet Explorer perd de plus en plus de terrain face aux autres navigateurs, en
 particulier Firefox. La version 6 d’Internet Explorer supporte les standards de façon
 correcte, mais Microsoft ne peut continuer à faire évoluer son navigateur sans prendre
 de plus en plus en compte les standards du W3C s’il veut garder son leadership. Les
 navigateurs alternatifs tel que Firefox ou Safari (uniquement sur Mac) respectent déjà
 beaucoup mieux les standards et prennent chaque année plus de parts de marché à
 Internet Explorer. Cette guerre des navigateurs vers un meilleur support de la qualité
 web ne peut que confirmer le fait qu’il est désormais primordial de développer des sites
 web respectant les standards afin d’en assurer leur pérennité avec toutes les futures
 versions des navigateurs actuels, ainsi qu’avec tous les navigateurs qui seront amenés à
 être développés.

                  Internet Explorer, évolution des parts de marché

                       Internet Explorer       Les autres navigateurs
                         90%

                         68%

                         45%

                         23%

                          0%
                                  2002     2003    2004     2005

                               source: “W3 Schools”
          Page web: http://www.w3schools.com/browsers/browsers_stats.asp


Mickaël FLOCARD                  Mémoire de Maîtrise - Wesford 2004/05   
            41
             c) Par une meilleur interopérabilité
Les sites web conçus en respectant les standards du W3C sont des sites consultables sur
diverses plates-formes. Non seulement l’internaute peut accéder au site quel que soit le
navigateur web qu’il utilise, mais de plus, de tels documents ont la particularité de jouir
d’une portabilité vers tous les nouveaux terminaux d’accès tels que les assistants
numériques et téléphones portables.
(voir p20     : “IV.5) Interopérabilité” )


             d) Face à l’évolution des modes d’accès
Le monde des Technologies de l’Information et de la Communication (TIC) est en
perpétuelle évolution. Les modes d’accès à l’information sont de plus en plus nombreux et
deviennent disponibles au plus grand nombre. Le seul moyen de continuer à avancer sur
des bases solides afin de supporter un nombre croissant de sources d’informations et de
supports d’accès à ces informations est que chaque acteur se développe en suivant les
mêmes règles et protocoles, donc en respectant les standards du W3C établis par des
groupes de travail auxquels environ 500 entreprises et organismes, acteurs des TIC dans
le monde, participent. Pour une meilleur anticipation des différents médias et supports
matériels à venir, les solutions en développement ou amenées à être développées ont
grand intérêt à suivre les recommandations émises par le W3C pour une meilleur
intégration en cas d’évolution des standards et pour une meilleur pérennité.



     3) Amélioration des ventes

✴La conception réussie d’un site de vente en ligne en ce qui concerne son ergonomie et
 son utilisabilité conditionne le comportement de l’utilisateur et sa satisfaction. Un site
 dans lequel il prendra plaisir à naviguer et dans lequel il trouvera sans difficulté
 l’information ou le produit recherché est un des sites qu’il sera susceptible de visiter
 régulièrement.
 (voir p26     : “V.2) Quelques points de contrôle d’une ergonomie correcte” )

✴Plus l’internaute accède aisément à la page du produit recherché, plus les chances qu’il
 conclue son achat sont importantes. Travailler sur la qualité contraint le webmaster à
 respecter une logique dans la structure du site et de son contenu, ce qui favorise non
 seulement un meilleur classement de l’information mais aussi une bonne cohérence des
 différentes rubriques et sous-rubriques. Plus l’organisation du site sera efficace et
 évidente pour l’internaute et plus il sera guidé de façon naturelle vers le produit qu’il
 recherche.




Mickaël FLOCARD                      Mémoire de Maîtrise - Wesford 2004/05   
        42
✴L’accès à un nouveau public et à un élargissement de sa clientèle est un des points
 intéressants de la qualité web pour toute entreprise possédant un site de vente en ligne.
 Toutes les différentes étapes nécessaires à l’objectif d’un but précis, celui de trouver un
 produit et de pouvoir le commander, peuvent à présent être réalisées par tout internaute
 atteint d’un handicap, qu’il soit léger ou important, grâce à un niveau suffisant
 d’accessibilité. Cette solution permettant l’accès à tous satisfait non seulement
 l’entreprise qui élargie ainsi son nombre de clients potentiels mais aussi et surtout les
 utilisateurs atteints de handicap qui ont enfin la possibilité de se comporter en tant que
 consommateur, possédant le choix d’acheter ou non un produit sur le web, sans qu’une
 quelconque technologie propriétaire ou mal intégrée vienne entraver leur démarche en
 rendant très difficile voir impossible tout achat sur internet.
 (voir p16    : “IV.4) Accessibilité” )



     4) Des coûts de mise à jour moindres

✴Faire un site tout en images, comme nous l’avons vu, pose des problèmes de mise à
 jour dans le sens où toute partie textuelle qui serait directement intégrée à une image
 devra être retravaillée au niveau de l’image si des mises à jour du contenu sont
 nécessaires. Alors que dans un site web correctement conçu, toute modification du texte
 se fait au niveau du code HTML et ne demande que quelques minutes. Une retouche
 d’image prend toujours plus de temps qu’un changement de contenu textuel.
  (voir p12    : “III.3) Les inconvénients d’un site tout en image” )


✴De plus, l’utilisation de textes et non d’images permet éventuellement au prestataire de
 fournir une solution de mise à jour du contenu au client, ce qui à terme restreint le
 nombre de sollicitations du prestataire et donc diminue les coûts. Cette mise à jour
 s’effectue en générale via une interface web réservée à l’administration du site, le “back-
 office*”.

✴Toute mise à jour en ce qui concerne l’aspect graphique se fait directement sur la ou les
 feuilles de style CSS. Seule l’intervention du graphiste est nécessaire car il est
 normalement inutile de modifier le code HTML, et donc aucune intervention du
 développeur ne doit être sollicitée à ce niveau. Ce qui auparavant nécessitait un travail
 collaboratif du designer et du développeur jouit aujourd’hui d’une certaine indépendance
 de l’un envers l’autre et ce grâce à une séparation totale du contenu et de la mise en
 forme des documents web.




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
          43
     5) Des dépenses en bande passante maîtrisées

✴La bande passante a un coût. Elle correspond au débit d’informations transférées entre
 le serveur web* et les différents postes clients, c’est-à-dire les ordinateurs des
 internautes. Chaque fois qu’un internaute visite une page d’un site web, il fait un appel
 au serveur qui héberge le site. A chaque appel, donc à chaque fois qu’un internaute
 charge cette même page sur son navigateur, tous les éléments la constituant (fichier
 html, photos et images, son, etc.) sont aussi chargés et donc augmentent d’autant la
 quantité d’informations transférées. Pour un site web ayant une faible fréquentation, il
 est rare que la bande passante autorisée par l’hébergeur du site soit dépassée. Par
 contre lorsqu’un site devient assez populaire, c’est-à-dire plusieurs milliers de visiteurs
 par mois, alors les dépassements de bande passante, s’ils ont lieu, sont facturés au
 propriétaire du site. Sachant que la bande passante utilisée pour la consultation d’une
 page web se calcule par le poids de cette dernière multiplié par le nombre de fois qu’un
 internaute fait un appel au serveur pour charger cette page, alors on comprend vite que
 plus les pages composant un site web sont lourdes et plus la bande passante
 consommée est importante.
 L’utilisation des feuilles de style CSS* permet de réduire le poids d’une page web de 25
 à 50% (source: “Openweb, http://openweb.eu.org/articles/pourquoi_standards/” ) en
 évitant toutes les répétitions de code servant à la présentation du document.



     6) En ce qui concerne les coûts de développement

✴Respecter les standards sur des projets web importants permet de prévoir toute rotation
 du personnel rattaché au développement d’un site web.
 En effet les sites conçus jusqu’à maintenant possédaient un code HTML* très complexe
 à déchiffrer pour une personne qui devait soit reprendre un projet en cours soit être
 affecté à la maintenance d’un site web déjà existant. Le webmaster qui à l’origine avait
 développé le code HTML ne respectait aucune règle concernant l’utilisation des balises
 et autres attributs* disponibles, l’objectif étant uniquement de parvenir à la mise en page
 voulue sur l’écran. Donc, tant que ce même webmaster suivait ce projet, cela ne posait
 pas trop de problème, par contre le jour ou une personne devait prendre sa place, il lui
 fallait de nombreuses heures de travail consacrées uniquement à comprendre comment
 son prédécesseur avait utilisé le code pour arriver à ses fins.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            44
✴La séparation totale du contenu et de la mise en forme, une fois de plus, permet de
 gagner du temps lors du développement d’un site web, notamment pour des sites à
 contenu conséquent. Il est possible de commencer par développer toute la partie
 structure et contenu du site pour au final ne travailler que sur l’aspect graphique du site.
 Contrairement à l’ancienne méthode où les éléments graphiques étaient répétés et
 incorporés à chacune des pages HTML*, il suffit maintenant de déclarer dans la CSS* le
 style rattaché par exemple aux liens hypertextes* pour qu’il se répercute dans chaque
 page HTML, et ce à chaque fois que le code rencontré sera celui attribué à un lien
 hypertexte. Par la même occasion, un temps important sera économisé si l’on veut par
 exemple modifier plus tard la couleur de ces liens. Une seule modification dans la feuille
 de style se répercutera sur tous les liens hypertextes du site.

✴Des surcoûts liés à l’obtention d’un site web de qualité sont totalement injustifiés,
 excepté pour l’obtention des plus hauts niveaux d’accessibilité, “double-A” et “triple-A”.
 (voir p22    : “IV.1)a) Les logos du W3C” )

 Tout prestataire web ayant acquis une expérience suffisante dans la conception de sites
 web de qualité ne prend pas plus de temps pour développer un site qu’un autre
 prestataire, bien au contraire, il est possible que son travail soit plus efficace, notamment
 grâce à l’utilisation des feuilles de style CSS. Il ne serait donc pas normal qu’un
 prestataire web tente de justifier un surcoût de son travail par rapport à d’autres en
 raison de l’obtention de cette qualité.
 En revanche, pour l’obtention du respect des recommandations concernant
 l’accessibilité des sites et ce pour les deux niveaux les plus élevés, le travail du
 prestataire sera plus conséquent. Les “guidelines*” (WCAG) sont en fait une liste de
 recommandations à appliquer page par page, élément par élément. On dénombre
 environ une centaine de points à vérifier pour le niveau “triple-A”. Ce travail, basé sur un
 site respectant initialement les standards HTML, prend beaucoup de temps et peut donc
 justifier un surcoût de la prestation.




     7) D’un point de vue légal

✴En février 2005, la France à enfin pris des mesures légales concernant l’accessibilité des
 sites web publics. La loi n°2005-102 basée sur l’anti-discrimination des personnes
 handicapées, nommée ”Loi sur l'égalité des droits et des chances, la participation et la
 citoyenneté des personnes handicapées”, stipule dans l’article 47 que “les délais de
 mise en conformité des sites existant ne peuvent dépasser trois ans”. L’accessibilité des
 services en ligne de l’état devient donc obligatoire, rejoignant ainsi les pays anglo-
 saxons ainsi que d’autres pays européens.
 (voir annexe 1 p58     : “ Article 47 de la loi n°2005-102”).



Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            45
✴Le DDA (Disability Discrimination Act) qui est en vigueur en Angleterre oblige tous les
 sites web à ne pas faire de discrimination basée sur le handicap, et donc impose leur
 accessibilité (qu'ils soient commerciaux, publics, privés, ou même simplement
 informatifs). Bien entendu, tous les sites ne sont pas encore accessibles, mais il existe
 un cadre légal que les utilisateurs peuvent utiliser pour un recours en justice.
 L'Angleterre est en avance sur le point de l'accessibilité par rapport à d'autres pays, mais
 en ce qui concerne l'Union Européenne, un texte doit être transposé dans les différents
 pays, qui s'attache en premier lieu aux sites publics, mais il est fort probable que ce texte
 sera transposé pour tous les sites web. Les jugements sont pour l'instant assez rares,
 mais il y a eu le cas du site web des Jeux Olympiques de Sydney (source: http://
 www.contenu.nu/socog.html) pour lequel il a été obligatoire d'apporter une certaine
 accessibilité. Pour les Etats-Unis d'Amérique, il existe la section 508 qui s'applique à
 l'accessibilité des sites publics.

✴Tant que les outils de développement web et les anciennes versions de HTML ne
 permettaient pas de rendre un site accessible, le problème juridique n’était pas
 réellement d’actualité. Il ne viendrait pas à l’idée par exemple de rendre les émissions de
 radio obligatoirement accessibles aux personnes atteintes de surdité. Mais, maintenant
 que toutes les technologies sont disponibles et largement répandues (plus de 99% des
 gens qui naviguent sur le réseau possèdent des logiciels adéquats) pour pouvoir fournir
 du contenu web accessibles aux personnes handicapées, les gouvernements ne
 peuvent que prendre des décisions allant dans ce sens, pour une meilleur équité et pour
 un accès universel à l’information présente sur le web.

✴Le gouvernement français à de son côté montré ses motivations par les différentes
 décisions prises ces dernières années.
 (voir Annexe 4 p61       : “ Propositions suite au rapport de Julien Perben” )
 Avant cette dernière loi du 11 février 2005, nous pouvons citer le Comité Interministériel
 pour la Société de l'Information (CISI) qui a annoncé, le 10 juillet 2003, dans la mesure
 2.6 : “ l'accessibilité de l'information numérique publique aux handicapés sera rendue
 obligatoire dans le cadre de la révision de la loi de 1975 sur le handicap. Un partenariat
 entre les sites Web publics et l'association BrailleNet (www.braillenet.org), pour le label
 AccessiWeb, est créé” (voir la page web: http://www.recherche.gouv.fr/cisi/2003/). C’est
 ainsi que les 92 critères Accessiweb ont été mis en place courant octobre 2003 et par
 une collaboration entre l'Agence pour le Développement de l'Administration Electronique
 (ADAE)  et l’association BrailleNet.
 (voir p24     : “V.1)b) Les logos du label “Accessiweb” )




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             46
VII. Conclusion

L’environnement internet tel que nous le connaissons aujourd’hui est en pleine évolution,
recherchant une stabilité par la mise en place de normes permettant l’obtention d’un contenu
le plus homogène possible, accessible à tous et ce par tout matériel d’accès disponible.
Des concepts que l’on peut considérer comme innovants tels que la séparation du contenu
et de la mise en page, sont encore difficilement perçus et acceptés par les différents acteurs
du développement web. Ils sont pourtant la base essentielle de toute démarche orientée
vers la qualité et l’accessibilité du contenu. Une meilleur reconnaissance des normes
établies par le W3C* passera avant tout par la mise en pratique de cette qualité web au sein
des différents services publics. Toute entreprise désire obtenir une solution de qualité, mais
en ce qui concerne internet très peu sont aujourd’hui capable de déterminer ce qu’est
exactement un site web de qualité.
Le problème d’une évaluation correcte d’un site ou d’un prestataire web se pose lorsque
toute entreprise, organisme public ou bien encore toute association souhaite faire appel à un
prestataire pour une réalisation web. Sur quoi se baser pour juger de son
professionnalisme ? De quelle façon établir un cahier des charges complet et pertinent ?
Ces différentes questions mettent en évidence le fait qu’il est nécessaire que la personne
ayant la responsabilité de choisir un prestataire web prenne dans un premier temps
connaissance des divers aspects techniques permettant d’apprécier la qualité d’un site et
donc la crédibilité de son concepteur. Les notions de respect des standards,
d’interopérabilité, d’ergonomie, d’utilisabilité, et d’accessibilité doivent être perçues et
assimilées de façon significative, afin de pouvoir les aborder, voire les exiger, lors de
l’établissement du cahier des charges.
Comprendre ce que représente la qualité sur le web requiert une démarche d’apprentissage
volontaire de la part de toute personne non experte du web. Loin d’être insurmontable, cet
apprentissage peut pourtant sembler long et fastidieux à première vue. On comprendra
facilement que tout internaute n’envisage pas d’effectuer cette démarche. En revanche, les
personnes directement concernées par des projets web n’ont plus vraiment le choix si
l’objectif du site est à terme de fournir un contenu de qualité aux internautes.
La qualité web, pour qu’elle soit recevable et souhaitée par un client, doit être pourvue de
sens, de raison d’être. Que ce soit dans le milieu industriel ou dans le domaine du
management, le recours à l’optimisation de la qualité s’est toujours fait dans un but précis,
celui d’améliorer l’existant, de le rendre plus stable, doté d’un meilleur fonctionnement mais
aussi plus compétitif (en terme de coûts, d’efficacité, ...). On retrouve sensiblement la même
approche lorsqu’il s’agit d’argumenter sur la raison d’être de la qualité sur le web. Cette
dernière joue un rôle prépondérant dans la pérennité des sites, dans l’optimisation des
divers coûts, et dans l’amélioration de l’expérience utilisateur. Elle est de plus une condition
nécessaire à l’obtention d’une accessibilité universelle au contenu, accessibilité qui devrait
dans les prochaines années être mise en place dans la totalité des sites web des services
publiques Français, mais aussi dans la majorité des pays concernés par les technologies de
l’information et de la communication.

Mickaël FLOCARD                    Mémoire de Maîtrise - Wesford 2004/05   
              47
                                  GLOSSAIRE

✴ Accesskey:
  Une “accesskey” pourrait se traduire en Français par “touche d’accès rapide” ou encore
  par “raccourci clavier”. Elle permet à un internaute de se rendre directement à des
  endroits spécifiques d’une page web, en appuyant simplement sur une touche du
  clavier.

✴ ADSL:
  L’ADSL, “Asymmetric Digital Subscriber Line”, se traduit par “Réseau de Raccordement
  Numérique Asymétrique” en Français. L’ADSL donne un accès à internet à partir des
  lignes téléphoniques existantes. Cette technologie permet d'augmenter les capacités de
  transmission des lignes téléphoniques afin que les données numériques puissent
  transiter plus rapidement.

✴ Attributs HTML:
  Une balise HTML* peut posséder un ou plusieurs attributs permettant de compléter
  l’information déjà donnée par la balise utilisée. Par exemple, pour la balise utilisée pour
  positionner une image dans le contenu, il est important d’utiliser l’attribut “alt” car il offre
  un équivalent texte à l’image, nécessaire pour les internautes ne pouvant pas voir cette
  image.

✴ Back-office:
  Contrairement au Front-office qui désigne l’interface visible par l’internaute dans un site
  web commercial, le back-office est lui entièrement réservé aux personnes chargées de
  mettre à jour le contenu du site, de la base de données, ...
  Il est consultable en ligne, souvent à partir d’un nom d’administrateur et de son code
  d’accès.

✴ Balise HTML:
  Dans le langage HTML*, on utilise des balises permettant de définir les divers éléments
  d’une page web comme les titres, les paragraphes, ...
  Ces balises commencent par le signe “inférieur à” (<) et se terminent par le signe
  “supérieur à” (>).
  Pour le titre de page on utilise la balise “<title>”.

✴ C++:
  Langage de programmation permettant de faire de la programmation orientée objet, le
  C++ est une amélioration de l’ancien langage C. Le C++ est devenu au cours des
  années 1990 un des langages les plus utilisés de l’industrie informatique, notamment
  pour le développement d’applications graphiques.




Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
               48
✴ Connexion haut débit:
  L’ADSL* est aussi appelée connexion à haut débit car elle permet un débit important de
  transfert d’informations, en comparaison avec une connexion bas débit ou RTC.


✴ Favoris:
  Ce sont des raccourcis que l’on intègre à son navigateur web*. Lorsque que l’on
  consulte un site assez fréquemment, il est plus pratique de placer son URL* dans les
  favoris du navigateur pour éviter d’avoir à utiliser un moteur de recherche à chaque fois
  que l’on veut se rendre sur ce site.

✴ Flash:
  Flash est un logiciel d’animation appartenant à la société Macromedia*. Il est utilisé
  pour créer aussi bien des graphismes animés que des jeux, grâce à sa faculté de créer
  des animations vectorielles interactives suffisamment légères pour le web. Le
  fonctionnement de Flash nécessite la présence d’un composant sur le navigateur de
  l’internaute, le plug-in* “Flash player”.

✴ HTML:
  C’est le langage à balise le plus utilisé pour décrire les pages web. Il permet entre autre
  de créer des liens entre les différentes pages de la toile, aussi appelés des hyperliens.
  En Anglais, HTML signifie “HyperText Markup Language”.

✴ JAVA:
  JAVA est un langage de programmation orienté objet créé par Sun Microsystems et
  officiellement présenté le 23 mai 1995.

✴ Lien hypertexte:
  Apparue avec le langage HTML, la notion de lien hypertexte permet, en cliquant sur un
  mot ou une suite de mots, d’aller lire un texte se rapportant au thème ou sujet que l’on
  est en train de lire. Ce lien hypertexte donne accès à l’internaute soit à une autre page
  du même site, soit à un autre endroit de la page en cours, soit à une page d’un site
  différent.

✴ Mac OS X:
  C’est la version la plus récente du système d’exploitation* MAC OS de la société Apple.

✴ Macromédia:
  Macromédia est une entreprise très connue pour ses outils de publication et surtout
  pour sa technologie Flash*. Macromédia a été rachetée au cours du 1er semestre 2005
  par Adobe (Photoshop, Acrobat Reader, PDF,...), permettant ainsi à ce dernier d’investir
  le domaine de la création numérique et de se positionner sur un des secteurs
  stratégiques du web.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             49
✴ Navigateur internet:
  C’est un logiciel qui permet de naviguer sur le web depuis son ordinateur et par
  l’intermédiaire d’une connexion à internet. Le plus répandu est actuellement “Internet
  Explorer” (de Microsoft), ensuite viennent des navigateurs tels que “FireFox” (de
  Mozilla) ou encore Safari (de Apple).

  Capture d’écran du navigateur FireFox:




✴ PDA:
  “Assistant personnel” en Français ou “Portable Digital Assistant” en Anglais, un PDA est
  un petit appareil pourvu d’un écran tactile ou d’un clavier (ou les deux), utilisé
  essentiellement pour ses fonctions d’agenda, de bloc-notes et de répertoire
  téléphonique. Les évolutions technologiques ont donné aux PDA des fonctionnalités
  multimédias (lecteur mp3, vidéo, connexion à internet, ...).

  Exemples de PDA:




Mickaël FLOCARD                  Mémoire de Maîtrise - Wesford 2004/05   
           50
✴ PDF:
  Format de document de la société Adobe, le PDF (“Portable Document Format” en
  Anglais) est un format portable donc universel. Il nécessite l’installation d’Acrobat
  Reader qui est aujourd’hui installé par défaut sur toutes les machines récentes.

✴ Plug-in:
  Un plug-in est un composant, un module, que l’on installe sur son ordinateur afin
  d’étendre les fonctionnalités de son navigateur*, pour lui donner la possibilité de lire des
  vidéos sur une page web ou encore des animations graphiques interactives.
  Exemples de plug-in: QuickTime, Flash Player, Acrobat Reader.

✴ Pop-up:
  Le terme “pop-up” est utilisé pour définir les petites fenêtres s’ouvrant automatiquement
  ou volontairement par dessus une page déjà existante de votre navigateur web*. Elle
  contiennent généralement soit une publicité, soit une image en grand format, soit des
  informations supplémentaires sur un élément de la page web qui était ouverte.

✴ QuickTime:
  QuickTime est un kit de développement multimédia développé par la société Apple,
  compatible avec les PC et extrêmement répandu. Il permet de gérer toutes les données
  multimédia fonctionnant sur internet. Le format vidéo de QuickTime, qui sert de base à
  une partie de la norme MPEG-4, est particulièrement répandu sur le web.

✴ Scroll:
  Le “scroll” ou barre de défilement est le rectangle situé sur le côté droit de la fenêtre de
  chaque navigateur web*, et dont la principale utilité est de faire défiler le contenu de la
  page web chaque fois que ce dernier est plus important que la taille de la fenêtre
  ouverte.

✴ Serveur web:
  C’est, de façon simple, un ordinateur classique (mais sans écran car il devient inutile)
  sur lequel fonctionne un logiciel respectant le protocole de communication HTTP,
  développé pour le World Wide Web. Lorsque qu’un internaute effectue une requête
  depuis son navigateur* web (http://www....), alors cette requête est reçue par un serveur
  web (celui qui héberge le site ou la page web demandée), qui à son tour renvoie la
  page web demandée vers l’ordinateur de l’internaute.

✴ Système d’exploitation:
  Le système d’exploitation (OS pour “Operating System” en Anglais) est un ensemble
  d’applications installé sur une machine et qui permet de pouvoir utiliser cet ordinateur
  ainsi que tous ses périphériques. Windows 2000, Windows XP et Mac OS X sont par
  exemple des systèmes d’exploitation.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
             51
✴ URL:
  L’URL (“Uniform Ressource Locator” en Anglais) est la ligne de texte que vous voyez
  sur le haut de la fenêtre de votre navigateur* lorsque vous faîtes par exemple appel à
  un site web. Elle permet de retrouver des ressources sur internet.

✴ WCAG:
  Les “Web Content Accessibility Guidelines” sont les directives émises par le W3C en ce
  qui concerne l’accessibilité des sites web aux personnes handicapées. Elles expliquent
  comment rendre le contenu des pages accessible.

✴ WAI:
  “Web Accessibility Initiative” est un projet du W3C destiné à permettre aux handicapés
  une utilisation efficace du web.

✴ Windows:
  Windows est le système d’exploitation* développé par Microsoft. Ses différentes
  versions (Windows 98, Windows 2000, Windows XP, ...) équipent la majeur partie du
  parc informatique mondial.

✴ Windows media:
  Windows Media est un format audio/video développé par Microsoft spécialement pour
  le web. Il utilise la norme MPEG-4. Ce format est lisible sur les systèmes d’exploitation*
  Mac OS* et Microsoft Windows*, mais en aucune façon sur des systèmes libres comme
  Linux.




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
            52
                            BIBLIOGRAPHIE

                                    LES LIVRES:

• “Graphisme et ergonomie des sites web”
    • Auteur: Cristina Baroca
    • Editeur: Dunod
    • Collection: Planète internet
     • Page web: http://www.dunod.com/pages/ouvrages/ficheouvrage.asp?id=46525

• “Plan qualité du logiciel et des services internet”
    • Auteur: Dominique Vauquier
    • Editeur: Afnor
    • Collection: Ouvrage

• “ Internet, clefs pour la lisibilité. Se former aux nouvelles exigences de l’hypermédia”
    • Auteur: Guy Barrier
    • Editeur: ESF
    • Collection: Formation permanente
     • Page web: http://www.esf-editeur.fr/dev/boutique/e-docs/00/00/00/AA/document_livre.md




                                 SUR INTERNET:
I. Introduction

II. Le web et son évolution
       1) Historique du web
•   http://www.webuniversum.net/webmaster/html/html-hist.html
•   http://www.orvinfait.fr/internet/autre_maniere_de_penser.html
•   http://www.orvinfait.fr/internet/langage_description_page.html
•   http://www.orvinfait.fr/internet/hypertexte.html
•   http://www.orvinfait.fr/internet/web.html
•   http://www.orvinfait.fr/internet/w3c.html
•   http://www.gonthier.ch/informatique/historiqueweb.html
•   http://www.cyberclub.qc.ca/conf/02/his_www.htm
•   http://www.cyberclub.qc.ca/conf/09/page02.htm



Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
                53
       2) Les technologies utilisées pour la création de pages web
•   http://www.w3.org/Style/
•   http://www.openweb.eu.org/articles/finir_cadres/
•   http://www.macromedia.com/fr/devnet/flash/
•   http://www.aeronet-referencement.fr/referencement/referencement-flash/Flash-reference
    ment.asp
       3) L’art de la présentation ramené à l’essentiel: le contenu
• http://cerig.efpg.inpg.fr/dossier/feuilles-de-style/page01.htm
• http://armorance.free.fr/valastuc/fds1.htm
       4) Mise en place des standards par le W3C
• http://www.w3.org/Consortium/
• http://www.openweb.eu.org/articles/navigateurs_alternatifs
• http://www.uzine.net/article1401.html

III. Le graphisme, élément prédominant dans l’appréciation
       1) Comportement critique de l’internaute “non éduqué”

       2) L’aspect visuel à l’origine d’une “critique passive”

       3) Les inconvénients d’un site “tout en image”
• http://www.computing.dundee.ac.uk/projects/dmag/resources/design_articles/accessible
  flash.asp
• http://www.lergonome.org/pages/detail_articles.php?indice=5
• http://www.openweb.eu.org/articles/interview_ned_baldessin/
• http://www.la-grange.net/w3c/wcag1/wai-pageauth.html#gl-provide-equivalents

IV. Qu’entend-t-on par “qualité web”
       1) Introduction

       2) Respect des standards du W3C
• http://www.la-grange.net/w3c/wcag1/wai-pageauth.html#gl-structure-presentation
       3) Ergonomie et utilisabilité
•   http://www.dicodunet.com/definitions/creation-web/utilisabilite.htm
•   http://www.01net.com/article/152850.html
•   http://www.temesis.com/article/userexpcle_fr.html
•   http://www.ergoweb.ca/utilisabilite.html
•   http://www.veblog.com/fr/2000/0816-utilisabilite-regles.html
•   http://www.ergolab.net/
•   http://www.lergonome.org/pages/detail_articles.php?indice=8
•   http://www.ergoweb.ca/criteres.html#feedback


Mickaël FLOCARD                     Mémoire de Maîtrise - Wesford 2004/05   
      54
       4) Accessibilité
• http://w3qc.org/docs/accessibilite.html
• http://www.w3.org/WAI/
• http://www.braillenet.org/colloques/policies/burger_paper.html


       5) Interopérabilité

• http://xmlfr.org/actualites/decid/010131-0002
• http://www.clubic.com/actualite-17356-le-w3c-s-occupe-du-web-mobile-de-demain.html
• http://xmlfr.org/actualites/decid/021128-0001

V. Quelques repères pour mieux apprécier la qualité
       1) Des points de repère simples
•   http://www.w3.org/Consortium/Legal/logo-usage-20000308.html
•   http://www.w3.org/WAI/WCAG1-Conformance
•   http://www.braillenet.org/
•   http://www.accessiweb.org/
•   http://www.section508.gov/
       2) Quelques points de contrôle d’une ergonomie correcte
•   http://www.lergonome.org/pages/detail_articles.php?indice=8
•   http://www.lergonome.org/pages/detail_articles.php?indice=24
•   http://www.veblog.com/fr/2000/0816-utilisabilite-regles.html
•   http://www.veblog.com/fr/2002/0304-temps-chargement.html
•   http://www.ergoweb.ca/criteres.html
• http://www.journaldunet.com/cc/02_equipement/equip_hautdebit_fr.shtml
•   http://www.insee.fr/fr/ffc/ficdoc_frame.asp?doc_id=1377
•   http://www.netalya.com/fr/Article2.asp?CLE=85
•   http://www.zdnet.fr/builder/web_design/conception_site/0,39021086,39152247-2,00.htm
•   http://www.w3schools.com/browsers/browsers_stats.asp
       3) D’un point de vue plus technique
• http://docs.mandragor.org/files/Web_standards/Openweb_fr/XHTML/toi_comprendre_mo
  i.html
• http://perso.wanadoo.fr/coin.des.experts/reponses/faq9_64.html
• http://www.la-grange.net/w3c/html4.01/
• http://www.la-grange.net/w3c/html4.01/struct/global.html
• http://www.cybercodeur.net/weblog/articles/art_20030426.php
• http://www.zdnet.fr/builder/programmation/technologies_web/0,39021000,39142327,00.htm




Mickaël FLOCARD                   Mémoire de Maîtrise - Wesford 2004/05   
               55
VI. Valorisation de la qualité: justification et argumentation
     1) Introduction

     2) Pérennité des sites
• http://www.w3schools.com/browsers/browsers_stats.asp
• http://www.openweb.eu.org/articles/navigateurs_alternatifs/
     3) Amélioration des ventes

     4) Des coûts de mise à jour moindres

     5) Des dépenses en bande passante maîtrisées

     6) En ce qui concerne les coûts de développement
• http://www.openweb.eu.org/articles/interview_ned_baldessin/
• http://openweb.eu.org/articles/pourquoi_standards/
     7) D’un point de vue légal
• http://www.disability.gov.uk/index.html
• http://www.recherche.gouv.fr/cisi/2003/
• Article 47 de la loi n°2005-102:
  http://www.legifrance.gouv.fr/WAspad/UnTexteDeJorf?numjo=SANX0300217L
• http://www.contenu.nu/socog.html

VII.Conclusion




                                      AUTRE:

Rapport:

   Rapport d’étude sur l’accessibilité de l’internet/intranet aux personnes handicapées

   Date: Décembre 2003

   Rédacteur: Julien Perben

   Page web: http://www.internet.gouv.fr/article.php3?id_article=1406




Mickaël FLOCARD                  Mémoire de Maîtrise - Wesford 2004/05   
           56
                  ANNEXES




Mickaël FLOCARD   Mémoire de Maîtrise - Wesford 2004/05   
   57
                   Annexe 1: Article 47 de la loi n°2005-102
Page web: http://www.legifrance.gouv.fr/WAspad/UnTexteDeJorf?numjo=SANX0300217L




Mickaël FLOCARD              Mémoire de Maîtrise - Wesford 2004/05   
     58
       Annexe 2: Un exemple des recommandations du W3C, la balise “<title>”
            Page web: http://www.w3.org/TR/html4/struct/global.html#h-7.4.2




Mickaël FLOCARD                 Mémoire de Maîtrise - Wesford 2004/05   
     59
                  Annexe 3: Une des recommandations des WCAG*
    Page web: http://www.w3.org/TR/WAI-WEBCONTENT/#gl-structure-presentation




Mickaël FLOCARD               Mémoire de Maîtrise - Wesford 2004/05   
        60
     Annexe 4: Propositions au gouvernement suite au rapport de Julien Perben
                                 Date: 20 janvier 2003
           Page web: http://www.internet.gouv.fr/rubrique.php3?id_rubrique=1




Mickaël FLOCARD                 Mémoire de Maîtrise - Wesford 2004/05   
       61
                  Annexe 4 - suite




Mickaël FLOCARD   Mémoire de Maîtrise - Wesford 2004/05   
   62
                    Licences Creative Commons
Quelle est la qualification juridique des documents-type Creative Commons ?

Les documents Creative Commons sont des contrats-type qui permettent à l’auteur de
communiquer au public les conditions d’utilisation de son œuvre.
Ce sont des offres ou pollicitations, l’offre étant définie comme la « manifestation de volonté
(…) par laquelle une personne propose à une ou plusieurs autres (déterminées ou
indéterminées) la conclusion d’un contrat à certaines conditions » (1).
On peut qualifier ces offres de contrats à exécution successive et de concession de droit
d’usage. Elles sont fournies à titre d’information gratuitement par Creative Commons et
n’impliquent aucun transfert des droits de propriété intellectuelle (2). Elles ne peuvent donc
pas être qualifiées de vente ou de cession.
La qualification de prêt à usage ou de commodat adresse les biens qui doivent être restitués,
ce qui n’a guère de sens dans le cas de biens immatériels.
Le louage de chose incorporelle ou licence (location d’un meuble incorporel en droit de la
propriété intellectuelle) est défini à l’article 1709 du Code Civil comme «un contrat par
lequel l'une des parties s'oblige à faire jouir l'autre d'une chose pendant un certain temps, et
moyennant un certain prix que celle-ci s'oblige de lui payer ». Le prix à payer n’entraîne ici
aucune rémunération, mais les obligations qui pèsent sur l’Acceptant laissent à penser que la
personne qui offre une œuvre sous de telles conditions en retire des avantages.
Le respect de la destination et l’usage de la chose louée en bon père de famille fait partie des
règles communes aux baux des maisons et des biens ruraux.
La qualification de licence, sous-catégorie de contrats, est traditionnellement réservée à la
propriété industrielle (licence de brevet ou de marque) et aux logiciels, et n’est pas employée
en propriété littéraire et artistique. Cependant, ce terme est communément utilisé pour
nommer les Creative Commons licenses, sous l'influence du terme américain et du concept de
"licences libres" : licence GNU GPL, Licence Art Libre...
La nouveauté de ce type d’offre peut enfin amener à la qualification de contrat innommé.


Quelle est la validité des licences Creative Commons au regard du formalisme
français des contrats de droit d’auteur ?


Le formalisme des contrats de cession de droits de propriété littéraire et artistique (CPI L.
131-3) peut s’appliquer aux licences ou autorisations d’utilisation (3). Celles-ci doivent
décrire de manière précise le domaine d'exploitation, soit l’étendue, la destination, le lieu et la
durée des droits concédés.
L’article 3 des licences Creative Commons énumère l’étendue des droits proposés :
« la reproduction de l’œuvre seule ou incorporée dans une œuvre dite collective, comme une
publication périodique, une anthologie ou une encyclopédie », au sens de l’article L. 121.8 du
CPI, voire modifiée en vue de former certaines « œuvres dites dérivées : traductions, les
arrangements musicaux, les adaptations théâtrales, littéraires ou cinématographiques, les
enregistrements sonores, les reproductions par un art ou un procédé quelconque, les résumés,
la distribution d’exemplaires ou d’enregistrements » desdites œuvres, au sens du CPI, article
L. 122-4, seconde phrase.
La durée (toute la durée légale de protection de l’Œuvre, telle qu’elle est définie aux articles
L. 123, L. 132-19, L. 211-4…) et l’étendue (le monde entier) sont également identifiées.

Quant à la destination, elle est clairement repérable dans l’intention de l’auteur de contribuer
à un fonds commun en autorisant certaines utilisations gratuites de son œuvre.
La cession des droits de reproduction et de représentation à titre gratuit est permise à l’article
L. 122-7 du CPI.
On précisera que les sous-licences sont explicitement interdites dans les documents Creative
Commons, être titulaire d’un droit d’usage ne confère pas au bénéficiaire d’une licence
Creative Commons le droit de céder ces droits. Le bénéficiaire ne pourra distribuer l'oeuvre
ou la communiquer au public que sous les mêmes conditions sous lesquelles il l'a reçue.
Le terme « bénéficiaire » et non pas le terme « licencié » a été retenu pour désigner dans la
traduction française la personne qui accepte l’offre. Ce choix marque une volonté de
confirmer cette interdiction et peut ainsi favoriser ainsi le consentement éclairé de l’acceptant.

L’article 3 de la version originale prévoit que « Les droits mentionnés ci-dessus peuvent être
exercés sur tous les supports, médias, procédés techniques et formats, qu’ils soient connus
aujourd’hui ou mis au point dans le futur. »
L’article L. 131-6 accepte « la clause d'une cession qui tend à conférer le droit d'exploiter
l'oeuvre sous une forme non prévisible ou non prévue à la date du contrat. ». Elle « doit être
expresse », ce qui est le cas dans la version originale des licences. Mais étant donné qu’elle
doit également « stipuler une participation corrélative aux profits d'exploitation », la phrase a
été écartée de la version française, à l’instar de la solution retenue par les traducteurs
allemands conformément à l’article 31.4 de la loi allemande sur le droit d’auteur de 1965, plus
stricte, qui interdit l’exploitation sous une forme non prévisible.

Si les cessions peuvent être consenties à titre gratuit, l’article L131-3 du CPI prévoit que les
adaptations audiovisuelles doivent prévoir une rémunération.
Cependant, la jurisprudence (4) a admis la validité d’une cession des droits d’adaptation
audiovisuelle même si aucune rémunération n’était stipulée, la contrepartie étant fournie par
la publicité faite à l’ouvrage, œuvre préexistante. L’intention de l’auteur d’obtenir une
diffusion et une distribution de son oeuvre sous Creative Commons plus large peut être
interprétée comme le souhait d'une plus grande notoriété grâce aux copies et aux diffusions
qu'effectueront les Acceptants, sans exiger une exploitation conforme aux règles spécifiques
d’un contrat d’édition, ni être lié par un contrat d'exclusivité avec un producteur.


L’autorisation d’adaptation audiovisuelle ne doit-elle pas figurer dans un contrat écrit distinct
de celui qui autorise les autres actes ?
D’après l’article L113-4, « l’œuvre composite est la propriété de l’auteur qui l’a réalisée,
sous réserve des droits de l’auteur de l’œuvre préexistante ».
L’article L131-4 alinéa 3 stipule que « les cessions portant sur les droits d’adaptation
audiovisuelle doivent faire l’objet d’un contrat écrit sur un document distinct du contrat
relatif à l’édition proprement dite de l’œuvre imprimée ». On peut se demander si le choix de
l’option qui autorise les modifications ne contraindrait pas à recourir à deux contrats Creative
Commons séparées, de manière à respecter cette disposition qui vise à protéger l’auteur en lui
faisant prendre conscience du fait qu’il s’agit de deux actes de cession bien différents.
La réponse est non car les licences Creative Commons ne sont pas assimilables à des contrats
d’édition au sens de l’article L132-1 du CPI : elles ne prévoient pas d’obligation pour le
bénéficiaire correspondant à la charge pour l’éditeur d’assurer la publication et la diffusion
des exemplaires dont la fabrication est autorisée.


Quelle est la validité des offres Creative Commons vis-à-vis du droit général des
obligations ?


L’absence de signature n’est pas le signe d’une absence de consentement ou d’information sur
l’objet et la nature de l’engagement contractuel. Il est en effet obligatoire d’accompagner
toute reproduction ou communication de l’œuvre d’une copie ou d’un lien vers le texte
Creative Commons qui la gouverne. Il est précisé dans l’objet du contrat que l’exercice sur
l’œuvre de tout droit proposé dans ladite offre vaut acceptation tacite de celle-ci, à l’image
des licences d’utilisation de logiciels qui prennent effet à l’ouverture de l’emballage du disque
d’installation. On peut inférer de l’article 1985 du Code Civil relatif au mandat que le
commencement de l’exécution du contrat proposé par le destinataire de l’offre « révèle » son
acceptation (5).
La personne qui propose de contracter, l’auteur au sens de l’article 113 du CPI, garantit dans
l’article 5a qu’elle a bien obtenu tous les droits nécessaires sur l’œuvre pour être en mesure
d’autoriser l’exercice des droits conférés par l’offre. Elle s’engage à ne pas transmettre une
œuvre constitutive de contrefaçon ou d’atteinte à tout autre droit de tiers (autres titulaires de
droits ou sociétés de gestion collective qui auraient pu être mandatées, ou tout autre tiers), et à
permettre une jouissance paisible à ceux qui en accepteront les termes.
Cependant, la version originale 2.0 des textes Creative Commons (notre travail de traduction
et d’adaptation portait jusqu’en mai 2004 sur la version originale 1.0) prévoit que cette clause
de garantie deviendra optionnelle. Une telle exclusion de garantie pourrait être jugée sans
valeur en cas de dommage. La responsabilité délictuelle étant d’ordre public, elle aura
vocation à s’appliquer par défaut, même sans mention explicite : la responsabilité de l’offrant
est alors définie par la législation applicable.
Enfin, proposer des textes en langue française n’est pas seulement plus commode pour les
utilisateurs français, mais répond également à l’impératif d’utiliser la langue française dans le
cadre de relations avec des salariés ou des consommateurs (6) dans un contexte professionnel
privé ou public.


Les contrats Creative Commons sont-ils compatibles avec le droit moral, norme
impérative ?




Droit à la paternité


N’est-il pas obligatoire de choisir l’option Paternité ? (On notera que l’option Paternité
devient obligatoire à partir de la version 2.0.)
On pourrait en effet penser que l’option Non Attribution, qui n’imposait pas d’indiquer la
paternité de l’œuvre, ne pouvait pas être choisie en droit français car le droit à la paternité,
prérogative de droit moral, est inaliénable. La même question est soulevée par l’article 4.a qui
permet à l’Offrant de demander à l’Acceptant de retirer de l’Œuvre dite Collective ou Dérivée
toute référence au dit Offrant.
Effectivement, un contrat qui imposerait à l’auteur de renoncer définitivement à son droit au
nom, en échange d’une contrepartie financière ou non, serait nul. La jurisprudence relative
aux contrats dits de « nègre » où l’auteur réel écrit un ouvrage pour autrui, et s’engage à
renoncer à être identifié comme auteur auprès du public, est stable : l’auteur réel pourra
toujours se faire reconnaître comme auteur (7).
Les documents Creative Commons n’imposent pas une renonciation définitive, mais
permettent une renonciation provisoire et une clarification (8). L’auteur pourra toujours faire
reconnaître sa paternité.
En revanche, ce droit à l’anonymat ne doit pas donner lieu à de fausses attributions de
paternité, notamment dans le cas où l’utilisateur-auteur indiquerait un autre nom que le sien,
ou s’approprierait indûment la paternité d’une œuvre. Le principe général étant la
présomption de titularité au bénéfice de celui sous le nom duquel est divulguée l’œuvre, le
système Creative Commons ne permet pas plus que le cas général d’authentifier la paternité
des œuvres. La paternité indiquée dans une offre Creative Commons reste soumise à la bonne
foi des utilisateurs.




Droit au respect


Autoriser à l’avance les modifications n’équivaut pas à aliéner le droit au respect. Le droit
d’adaptation, traditionnellement cédé à l’avance, n’implique pas d’autoriser les modifications
qui porteraient atteinte à l’intégrité de l’œuvre ou à l’honneur et la réputation de son auteur.
L’auteur qui aurait mis à disposition son œuvre sous une offre Creative Commons autorisant
les modifications et la création d’œuvres dites dérivées, se réserve toujours la possibilité d’un
recours fondé sur droit au respect, en cas d’utilisation ou de dénaturation de son œuvre telle
qu’elles lui porteraient préjudice.




Droit de retrait


Le droit de retrait, lui aussi d’ordre public, pourra toujours être exercé, même si le parcours de
l’œuvre rend son application encore plus difficile sur les réseaux. Celui qui propose l’offre de
mise à disposition se réserve à tout moment le droit de proposer l’œuvre à des conditions
différentes ou d’en cesser la diffusion (article 7.b), dans le respect des offres précédemment
consenties. L’auteur qui met fin au contrat Creative Commons devra respecter la bonne foi (9)
des personnes qui auront dans l’intervalle appliqué le contrat qu’il proposait.




Droit de divulgation
Le titulaire des droits sur l’œuvre conserve le contrôle du moment et des conditions de sa
divulgation et de sa communication au public, non pour s’assurer de la réservation des droits
exclusifs, mais pour rendre l’œuvre libre de certains droits.
Certains pourraient se demander si la condition de Partage à l’Identique des Conditions
Initiales ou ShareAlike ne constitue pas une atteinte au droit de divulgation de la personne
qui, ayant accepté une œuvre sous de telles conditions contractuelles, la modifie en apportant
une contribution originale, et acquiert elle-même le statut d’auteur de la nouvelle œuvre dite
dérivée.
Le nouvel auteur conserve ses prérogatives et décide du moment de la divulgation de la
nouvelle œuvre. Il ne lui est pas interdit de la divulguer sous des conditions différentes, mais
c’est à la condition d’obtenir une autorisation écrite de la part de l’auteur de l’œuvre
préexistante, comme dans le système juridique classique, hors Creative Commons.

Le contrôle de l’utilisation après divulgation en vertu des options Partage des Conditions
Initiales à l’Identique (Share Alike) et Pas d’Utilisation Commerciale (Non Commercial)
n’est-il pas incompatible avec le principe d’épuisement des droits ?

L’épuisement du droit de distribution prévu en droit communautaire établit qu’une fois
l’original de l’œuvre ou sa copie mise en circulation sur le territoire communautaire avec le
consentement du titulaire de ce droit, par exemple après la première vente, il ne peut plus
exercer ledit droit. Le titulaire ne peut donc exercer ce droit de propriété intellectuelle qu’une
seule fois, il ne peut pas l’exercer à nouveau dans un autre Etat-membre. L’épuisement ne
concerne que la distribution physique d’exemplaires matériels, de supports, à l’exclusion des
services en ligne et des copies licites en découlant (Directive 2001/29/CE sur l’harmonisation
de certains aspects du droit d’auteur et des droits voisins dans la société de l’information,
article 4.2 et considérant 29). Le titulaire conserve ses autres droits patrimoniaux.
L’article 2 des contrats Creative Commons stipule bien qu’ils s’appliquent sans préjudice du
droit applicable, et ne visent donc en aucun cas à restreindre ce type de prérogatives. On peut
toutefois se demander si le fait de restreindre les conditions d’utilisation après la première
mise à disposition respecte l’épuisement.
Tout d’abord, les options Partage des Conditions Initiales à l’Identique (Share Alike) et Pas
d’Utilisation Commerciale (Non Commercial) ne conduisent pas à interdire formellement
toute modification qui ne serait pas proposée aux mêmes conditions ou toute utilisation
commerciale, ce qui reviendrait à imposer des conditions de distribution. Elles se contentent
simplement de réserver les droits non proposés, qui continuent à requérir l’autorisation du
titulaire des droits, à l’instar du droit d’auteur classique.
Enfin, on peut rappeler que la notion d’épuisement est utilisée en droit communautaire à des
fins de régulation économique. Elle est utile dans les situations où un ayant-droit abuse de son
monopole pour affecter le commerce et la concurrence en interdisant la commercialisation ou
en imposant des restrictions quantitatives à l’importation ou des mesures d’effet équivalent.
Les objectifs du Traité de Rome sont de lutter contre le cloisonnement du marché intérieur et
les abus de position dominante. Sont visées d’un côté les entraves à la libre circulation des
marchandises constitutives d’obstacles à la commercialisation sur le territoire national de
produits régulièrement mis en circulation sur le territoire d’un autre Etat membre, et de l’autre
la faculté de contrôler les actes ultérieurs de commercialisation et d’interdire les
réimportations. Certaines restrictions ont d’ailleurs été admises par la Cour de Justice des
Communautés Européennes ; ainsi, l’arrêt Cinéthèque (10) valide comme conforme au droit
communautaire la loi française sur la chronologie des médias (11) qui impose un délai entre
l’exploitation des films en salle et la vente ou la location de supports.
Quelle sera la loi applicable en cas de conflit ?

Il n’y a pas de clause déterminant la loi applicable et la juridiction compétente dans les
contrats Creative Commons. Les règles de droit international privé prévalent, et, pour choisir
la loi applicable, le juge saisi déterminera le lieu d’exécution de la prestation caractéristique
du contrat, ou le lieu du dommage ou du dépôt de la plainte.
Les contrats Creative Commons prévoient à l’article 8c que si un article s’avère invalide ou
inapplicable au regard de la loi en vigueur, cela n’entraîne pas l’inapplicabilité ou la nullité
des autres dispositions, l’article en question devant être interprété de manière à le rendre
valide et applicable.
Les clauses abusives sont réputées non écrites si le contrat conduit à établir des rapports
déséquilibrés entre les droits et obligations entre un professionnel et un consommateur (12).
Un raisonnement a fortiori permet de déduire que les offres Creative Commons satisfont ces
exigences, ainsi que les exigences de prudence et d’information.
Un auteur peut se retourner contre la personne qui utilise son œuvre sans respecter les
conditions qui lui sont attachées. L’auteur qui estimerait qu’il y a eu atteinte à ses
prérogatives patrimoniales pourrait toujours demander au juge une révision du contrat.
Le bénéficiaire du contrat pourrait également se retourner contre le donneur de contrat qui a
transmis une œuvre contrefaisante.



Notes

1. Dir. Gérard Cornu, Vocabulaire Juridique Association Henri Capitant, PUF Quadrige 4ème
éd. 2003.

2. Voir Christophe Caron, Les licences de logiciels dites « libres » à l’épreuve du droit
d’auteur français, Dalloz 2003, n° 23, p. 1556 et Melanie Clément-Fontaine, La licence GPL,
mémoire de DEA, Université de Montpellier, 1999. http://crao.net/gpl/
Contra en faveur de la qualification de cession, Cyril Rojinsky et Vincent Grynbaum, Les
licences libres et le droit français, Propriétés Intellectuelles, juillet 2002/4, p. 28.

3. Cass.1ère civ. 23/01/2001, Communication Commerce Electronique avril 2001 & A. et H.-
J. Lucas, Traité de la Propriété Littéraire et Artistique, Litec, 2ème éd. 2001, n° 482.

4. CA Paris, 1re ch. B, 21-09-1990 : Jurisdata n. 023403, in Lucas, Traité de la Propriété
Littéraire et Artistique, note 280.

5. Dir. Michel Vivant, Lamy Droit de l’Informatique et des réseaux, par. 875.

6. Loi n° 94-665 du 4 août 1994 relative à l'emploi de la langue française dite loi Toubon.

7. Cour de cassation, Civ.1, 4 avril 1991, affaire Béart, Revue Internationale du Droit
d'Auteur, octobre 1991, p. 125 (cassation de l’arrêt d’appel ayant admis que l’auteur de
thèmes musicaux renonce, par contrat, à être identifié comme tel auprès du public).

8. Hubert Guillaud, http://lists.ibiblio.org/pipermail/cc-fr/2004-January/000039.html
9. Comportement loyal que requiert notamment l’exécution d’une obligation (Vocabulaire
Capitant, op cit)

10. Arrêt de la CJCE du 11 juillet 1985, Cinéthèque SA et autres contre Fédération nationale
des cinémas français, Aff. jointes 60/84 et 61/84, Rec. 1985 p. 2605.

11. Loi n°82-652 du 29/07/1982 sur la communication audiovisuelle, JORF du 20/07/1982, p.
2431, article 89.

12. L132-1 Code de la Consommation

				
fredoche25 fredoche25
About