Même si de nombreux développeurs Web travaillent en fonction des standards Web, certaines entreprises hésitent encore à investir dans des sites Internet normalisés si elles n’ont pas de raison concrète. Dans le but d’aider les développeurs intéressés à être les défenseurs des standards Web, cet article regroupe des arguments et des informations sur les standards en un seul document et explique ces standards en fonction de leur impact sur le monde des affaires. Après avoir survolé ce que sont les standards Web et comment ils sont utilisés, cet article démontre clairement qu’adopter des standards peu améliorer de nombreux aspects d’un site Web, tel que: la bande passante utilisée, le temps de téléchargement, offrir une fondation à l’accessibilité, l’indépendance par rapport au matériel et le processus d’assurance qualité. Cet article réfute plusieurs mythes négatifs sur les standards Web et présente des stratégies pour les respecter. Cet article pose aussi des fondations pour de futures recherches de MACCAWS sur les bénéfices commerciaux des standards Web.

Statut de ce document

Ce document est un document de travail. Si vous avez des révisions, des commentaires, des suggestions ou des réactions, veuillez contacter le groupe de recherche MACCAWS.

MACCAWS est redevable aux collaborateurs et aux réviseurs pour leurs idées et leur participation enthousiaste.

Contenu

Introduction

Vous développez un site Web? Peut-être êtes-vous déjà propriétaire de plusieurs sites ou encore peut-être êtes-vous impliqués dans le processus de création, de développement ou de maintenance d’un site Web. Si vous ne connaissez pas encore les normes, peut-être devriez-vous d’abord consulter notre abécédaire sur les normes.

L’usage des standards est fondamental lors du développement de sites Internet. Dans cet article, nous allons:

• expliquer pourquoi il est dans le meilleur intérêt de votre entreprise d’implanter les standards Web;
• tracer les étapes que vous pouvez suivre dans le but de respecter les normes et les intégrer dans votre processus;
• présenter des concepts qui ne sont ni techniques ni propriétaires et les appliquer à n’importe quel type de site Web, peu importe leur taille, fonctions et complexité.

Les standards et le Web

Les standards ont été créées pour assurer des produits de qualité et sécuritaires et ce, pour presque tous les types de produits ainsi que pour beaucoup des procédures que nous rencontrons dans la vie quotidienne. Par exemple, dans beaucoup de pays, la norme veut qu’un feu rouge signifie « arrêt », qu’un feu orange signifie « attention » et qu’un feu vert signifie « avancez ». Ces règles normalisées aident à s’assurer que tous les véhicules peuvent se déplacer en toute sécurité peu importe le type d’automobile, qui la conduit ou sa destination. Sans des feux de circulation normalisés, la conduite serait encore plus chaotique que la moyenne des embouteillages de l’heure de pointe. De la même manière que toutes les normes existantes servent à indiquer comment construire et utiliser des produits et des procédures, les standards Web définissent comment chacune des technologies associées au Web doit opérer dans le but d’offrir une plate-forme solide et stable.

Les standards les plus utilisés

Le HTML, le XHTML et le CSS sont trois des normes généralement acceptées sur le Web de nos jours. Dans cette section nous allons explorer les origines et la nature du développement de ces spécifications. Vous pouvez sauter cette section, mais nous vous recommandons de prendre un peu de temps pour développer une compréhension de ces technologies et devenir familier avec leur histoire.

Le langage HTML (HyperText Markup Language) et le langage XHTML (eXtensible HyperText Markup Language)

Le HTML est un langage de balisage pour les documents Web. En évoluant, le HTML est devenu une spécification pour décrire la structure de documents. Le HTML offre une façon de créer des documents avec des éléments tels que des en-têtes, des paragraphes, des tableaux, des acronymes et des citations. Une autre technologie, les feuilles de style en cascade (CSS – Cascading Style Sheets), prend en charge la présentation (le look) des documents.

Il n’y aura plus de nouvelle spécification HTML. Le HTML 4.01 est la dernière norme HTML et elle est maintenant supplantée par le XHTML. Créer des documents en XHTML n’est pas tellement différent de créer des document en HTML, toutefois, le XHTML offre de grand bénéfices commerciaux en particulier pour des applications complexes. Comme le XHTML 1.0 est une redéfinition du HTML selon les règles du XML, c’est à la fois du HTML et du XML. Ce qui signifie que le XHTML peu prendre avantage de l’adoption quasi généralisée du HTML et de la capacité de manipuler de l’information du XML.

Les feuilles de style en cascade (CSS)

Le CSS a été développé pour offrir une méthode simple pour définir la présentation d’un site Web. Alors que le HTML définit la structure, le CSS est responsable de l’aspect d’un site. En utilisant les CSS, un développeur Web peut définir les éléments de présentation (la mise en page, les polices de caractère, les couleurs, etc.), indépendamment du balisage du contenu Web. Le style peut ainsi être défini dans un document complètement séparé que plusieurs pages Web peuvent réutiliser. Un développeur Web peut changer les couleurs et la mise en page en changeant uniquement la (ou les) feuille(s) de style sans avoir besoin de modifier chaque document affecté. Cette capacité d’affecter beaucoup de pages et même la mise en page d’un site en changeant seulement quelques lignes de code rend le CSS si précieux.

Le CSS a l’avantage de permettre différents styles selon le média, incluant:

• fureteurs,
• impression,
• agendas électroniques,
• téléphones cellulaires et
• médias sans fil.

Le CSS offre la capacité de rendre des pages Web adéquates à différents types d’appareils sans avoir à créer de nouvelles pages HTML.

Autres standards Web

Le HTML et le CSS ne sont que la pointe de l’iceberg en ce qui concerne les standards Web couramment utilisées. Beaucoup d’autres normes interviennent à différents niveaux de l’infrastructure du Web et d’Internet. Par exemple, le HTTP (HyperText Transfer Protocol) est une norme qui travaille en arrière plan, dictant la manière dont le contenu Web est servi sur Internet. Même si vous n’avez pas forcément besoin d’être familier avec ces autres spécifications, c’est une bonne idée d’avoir une idée générale des autres standards Web importantes pour les avoir dans votre trousse à outil et être ainsi mieux équipé si vous en avez besoin dans des projets futurs.

Parmi les autres normes couramment utilisées, il y a le modèle DOM (Document Object Model) et le ECMAScript (JavaScript normalisé).

La famille XML

Vous avez probablement déjà entendu parler du XML (eXtensible Markup Language), une norme qui est au coeur d’une grande famille de technologies reliées. Celle-ci inclus :

• XSL (eXtensible Stylesheet Language) — une famille de recommandations qui décrivent comment un document XML doit être rendu. Facilite aussi la transformation de documents XML vers d’autres formats;
• RSS (« Really Simple Syndication », « RDF Site Summary » ou « Rich Site Summary ») — un série de formats servant à publier des nouvelles ainsi que des sites Web. Toutes les normes RSS utilisées sont du XML. Le RSS 1.0 est aussi du RDF;
• SVG (Scalable Vector Graphics) et SMIL (Synchronized Multimedia Integration Language) — normes multimédia et graphiques. L’utilisation du SVG conjointement au DOM équivaut à Flash; par contre, le SVG est accessible et a une solide structure sémantique. Le SMIL est un langage qui permet de combiner du contenu audio, vidéo, des images et du texte pour construire des présentations multimédia;
• XForms — une méthode pour créer des formulaires sur le Web qui permet de définir séparément les fonctionnalités et la présentation du formulaire. Avec sa définition en XML, la mise en page d’un formulaire particulier peut être configurée différemment; ce dernier peut, entre autres, avoir l’air un formulaire XHTML classique.

Le XML est aussi une méthode pour implémenter le RDF (Resource Description Framework), un cadre d’application servant à décrire les relations entre différentes ressources utilisant des vocabulaires spécifiques (« ontologies »). Le RDF permet d’utiliser des modèles de connaissance courants pour mieux intégrer l’information dans le but de la réutiliser.

Accessibilité

En plus des technologies Web, il existe aussi des normes pour assurer que les sites Web et les outils servant à les créer répondent à d’autres critères tels que l’accessibilité et l’internationalisation.

Des directives pour l’accessibilité existent pour les sites Web et pour les agents utilisateurs. Le tableau suivant résume ces directives et les types de systèmes ou logiciels auxquels elles s’appliquent :

Internationalisation

Alors que les normes d’accessibilité existent pour assurer à tous l’usage du Web, les efforts d’internationalisation visent à assurer que tous puissent utiliser Internet dans leur langue maternelle.

Les concepts et les projets importants des efforts d’internationalisation comprennent :

• Les différents langages ont, depuis fort longtemps, un encodage qui leur est propre. Ainsi, il était impossible d’utiliser des documents multilingues et la communication entre des systèmes parlant différentes langues n’était pas transparente. Largement adopté, unicode est une norme décrivant l’encodage de caractères et ce, pour toutes les langues. Des organismes tels que ISO et le W3C produisent un cadre d’application pour l’internationalisation, comprenant des directives pour son implantation au niveau de l’infrastructure elle-même.

• Ceci tient compte d’éléments tels que :

  • le texte bidirectionnel,
  • l’annotation ruby (annotation de caractères pour clarifier la prononciation, souvent utilisée dans les textes idéographiques tels que le japonais),
  • la mise en forme des nombres

• Les éléments de localisation tiennent compte de problèmes tels que :

  • la sensibilité culturelle dans les images et le texte
  • des formulaires flexibles permettant l’usage de différentes conventions pour les adresses et les noms
  • les sensibilités politiques

Organismes normalisateurs

Le World Wide Web Consortium (W3C) établit beaucoup des standards Web en vigueur de nos jours. Ce consortium a été fondé en 1994 par Tim Berner-Lee conjointement avec le MIT, le CERN, DARPA, et la Commission européenne. Les membres sont des manufacturiers de logiciels et de matériel, des gouvernements, des organismes de normalisation, des fournisseurs de contenu et des laboratoires de recherche. Les spécifications techniques, recommandations et autres missives pour le Web sont produits suite à un consensus des membres et des échanges avec le public par le biais de forums et de groupes de discussions. Le W3C a pour mission et but d’encourager une vision du Web ouverte, confiante, interopérable, décentralisée, universellement accessible et indépendante de tout manufacturier.

Il existe d’autres organismes normalisateurs, parmi ceux-ci :

Quelques mythes répandus

Les normes ne semblent pas très excitantes, créatives ou à la fine pointe de la technologie. En fait, le mot lui-même semble sous-entendre des restrictions et un manque de flexibilité. C’est dommage que de telles connotations soient associées au mot, car ces idées ne pourraient être plus loin de la vérité.

Abordons ces mythes un par un. Ensuite, nous étudierons les bénéfices pratiques reliés à l’usage de standards Web dans vos projets de développement.

Mythe nº 1: Les normes rendent votre site Web « laid et ennuyant »

L’usage des normes n’affectera pas nécessairement l’aspect et la convivialité de votre site. Prétendre que les normes rendent votre site « laid et ennuyant » revient à dire que la norme spécifiant la composition du béton peut affecter l’aspect d’un bâtiment – une affirmation que nous savons tous fausse; la spécification de la composition du béton assure que la solidité de la structure d’un bâtiment, ensuite, il est possible de décorer et de meubler comme nous l’entendons.

Si un bâtiment est bien conçu, il sera attrayant peu importe le type de béton utilisé pour le construire. Par contre, si le béton est de piètre qualité et ne répond pas aux normes, le bâtiment risque l’instabilité et l’effondrement. Le même scénario s’applique aux standards Web — elles n’interfèrent pas avec l’aspect ou les fonctionnalités d’un site Web. Si un site est laid et ennuyant, c’est parce que le design du site a été mal conçu.

Le site CSS Zen Garden présente des designs en CSS attrayants. Le site Web Standards Awards présente des beaux sites réels développés selon les normes.

Les normes ne s’appliquent pas qu’au code, il y a aussi des normes pour le visuel d’un site Web. Des normes ont été développées pour l’animation et les graphiques. Par exemple : le SVG (Scalable Vector Graphics), le SMIL (Syncronised Multimedia Integration Language), et le PNG (Portable Network Graphics).

Mythe nº 2: Respecter les normes augmente le temps de développement

Les développeurs Web expérimentés qui n’ont pas l’habitude de coder selon les normes peuvent avoir besoin de temps pour prendre de nouvelles habitudes et développer selon de nouveaux paradigmes. Toutefois, selon l’habileté du développeur Web, l’usage de normes peut réduire le temps de développement :

• Un site Web répondant aux normes peu être développé beaucoup plus rapidement et sera plus facile à maintenir si vous utilisez des normes de balisage qui interagissent bien avec les feuilles de style (CSS).
• Vous ne devrez produire qu’une seule version de votre site. Vous n’aurez plus besoin d’offrir des gabarits pour l’impression, des détecteurs de fureteur ou différents gabarits pour différents fureteurs.
• Si vous utilisez des outils de développement tels que Dreamweaver ou FrontPage, vous devrez prendre un peu de temps pour les configurer dans le but de produire des pages répondant aux normes. Des instructions sur la méthode à suivre sont disponibles. Quelques heures suffiront pour suivre toutes les étapes qui sont assez simples. Vous aurez des résultats quasi-immédiats!
• Il est moins long de vérifier du code normalisé car il existe des outils automatiques pour faire la validation.
• Lorsque de nouveaux développeurs rejoindront votre équipe, ils ne devront pas apprendre les particularités et inconsistances créées par d’ancien développeurs.

Mythe nº 3: Tous les usagers de mon site utilisent Internet Explorer de toute manière

Les fureteurs changent

Bien qu’Internet Explorer soit le fureteur le plus utilisé en ce moment, il pourrait ne pas le rester. Fin mai 2003, Microsoft a annoncé qu’elle arrêtait le développement de versions gratuites et autonome d’Internet Explorer. En juillet 2003, la fondation Mozilla était créée pour faciliter le développement de son fureteur libre (open source), à la même époque, le développement de Netscape était arrêté par AOL. Il y a d’autres fureteurs disponibles gratuitement sur le marché, les plus connus sont Mozilla, Opera, Safari et Konqueror. Toujours est-il que les usagers sont libres de choisir le fureteur qu’ils veulent utiliser; ainsi, il faut penser en fonction de la flexibilité offerte par le respect des normes.

Les autres « fureteurs » qui visitent votre site

En plus des visiteurs qui utilisent un ordinateur personnel, vous pouvez avoir d’autres dont vous n’êtes pas conscients, comme des robots de moteurs de recherche (spider). En général, les moteurs de recherche utilisent des logiciels automatiques appelés « robots » qui cherchent dans le texte de votre site (crawling) dans le but de mettre à jour leurs bases de données. Si votre site n’est pas accessible aux robots, il sera difficile à trouver via les engins de recherche.

Déployer votre site en fonction des normes vous assure que votre contenu est disponible, peu importe l’outil utilisé pour y accéder. De plus, ceci vous évite d’avoir à prévoir une infrastructure séparée pour les technologies émergeantes comme les téléphones cellulaires ou les assistants numériques personnels (PDA).

Enfermement du fureteur

Si vous construisez un site pour un Intranet ou un réseau fermé, développer selon les normes permet de vous assurer que vous n’êtes pas liés à une version particulière d’un fureteur et des technologies qui y sont supportées. Imaginez le cas suivant :

1. L’environnement de travail de votre entreprise utilise IE 4.
2. Tout l’intranet est construit en fonction d’IE 4. Uniquement.
3. L’Intranet prend de l’expansion et, année après année, département après département, des pages sont ajoutées.
4. Deux ans plus tard, votre entreprise décide d’implanter Mozilla.
5. Vous passez les six mois suivant à recoder votre site pour qu’il soit indépendant du fureteur.

Beaucoup de travail aurait pu être évité si votre Intranet avait été construit en fonction des normes dès le départ. Les normes sont conçues pour fonctionner avec n’importe quel fureteur ou dispositif; si vous développez votre Intranet en fonction des normes, vous n’aurez pas à passer du temps à le reconstruire.

Mythe nº 4: L’aspect n’est pas le même sur tous les fureteurs

En fait, ce mythe n’en est pas un — il est même tout à fait vrai. Ce qui est plutôt le mythe, c’est que beaucoup de développeurs Web croient qu’un site devrait être identique sur tous les fureteurs.

Les sites conçu pour « être identique » vont avoir différents problèmes: ils manqueront de flexibilité et seront inutilisables pour une partie de votre public cible. Lorsqu’un usager visite un site, il peut :

• utiliser la plate-forme de son choix,
• utiliser le fureteur de son choix,
• être handicapé visuel et avoir besoin d’une police de caractère plus grande ou avoir des difficultés physiques à utiliser une souri,
• utiliser un téléphone cellulaire ou un PDA qui ne peut servir des sites graphiquement lourds.

Construite des sites en fonction de mise en page basées sur les feuilles de style signifie laisser le fureteur faire tout le travail — peu importe la plate-forme ou l’équipement utilisé. L’utilisation des feuilles de style à leur plein potentiel vous permet de créer une version de votre contenu Web tout en permettant aux différents équipements et aux usagers d’utiliser le style qui leur convient le mieux. Si vous tentez de rendre votre site parfaitement identique pour tous, vous risquez de rendre la visite impossible ou désagréable pour certaines personnes.

Les avantages des standards Web

Voyons maintenant quels sont les avantages d’adopter les standards Web. En incorporant les normes dans vos projets, vous pouvez :

• baisser vos coûts de développement,
• baisser vos coûts de mise à jour,
• augmenter le nombre de vos visiteurs,
• baisser vous coûts d’hébergement,
• améliorer le profil de votre entreprise.

Pour tirer pleinement profit de tous ces avantages, servez-vous des standards Web au maximum et des méthodes de mise en page basées sur les feuilles de style.

Réduire les coûts lors du développement

Lors du développement initial

Selon la méthode traditionnelle de construction d’un site Web, changer des éléments de présentation (couleurs, polices de caractère ou même la mise en page) nécessitait de modifier chaque page pour appliquer les changements, ceci pouvait aussi impliquer de changer des centaines d’images servant à créer de l’espace ou d’autres éléments graphique du site. Le prototypage et le changement de design au milieu du développement devient beaucoup plus simple lorsque le contenu et le style son complètement séparés et qu’une mise en page basée sur les feuilles de style est utilisée.

Les standards Web ont été créées pour séparer le contenu de la présentation d’un site. Ainsi, changer l’un n’a aucun impact sur l’autre. Lorsque vous changez ou ajoutez du contenu, vos développeurs Web n’ont pas besoin de modifier la présentation; et, réciproquement, pour changer l’aspect du site, ils peuvent simplement modifier les éléments de présentation dans les feuilles de style.

La confusion et le manque d’organisation liés aux différentes pratiques de programmation dans les grandes équipes de développement seront minimisés lorsque tous les développeurs doivent utiliser les mêmes normes.

Lors de modifications graphiques

Si vous utilisez une mise en page basée sur des feuilles de style et les standards Web les changements d’aspects de votre site peuvent s’avérer aussi simples que de développer quelques nouvelles feuilles de style plutôt que de modifier le balisage de chaque page.

Ainsi, il n’est plus nécessaire d’utiliser un système de gabarits ou un système de gestion de contenu coûteux pour changer les éléments de présentation d’un site. Que vous changiez la police ou la mise en page d’un site, si le contenu et la présentation sont séparés, vous pouvez changer une feuille de style pour changer toutes les pages de votre site.

Dans le processus de développement à long terme de votre site, vous constaterez qu’en utilisant les normes vos projets seront moins dépendants des habitudes spécifiques de chaque développeur. Ainsi, les futurs développements effectués par des développeurs conscients des normes seront plus rapides et efficaces.

Réduire les coûts lors de l’entretien

Le code bien conçu et respectant les normes est concis, clair et précis. Pour le développeur Web moyen, cela signifie qu’il sauvera beaucoup de temps lors de la mise à jour ou du changement de contenu.

• Les mises en page basées sur les feuilles de style permettent aux développeurs d’ajouter des fonctionnalités ou de modifier la mise en page sans voir à modifier séparément chaque page.
• Les changements de couleurs ou de polices seront rapidement faits sur tout le site — sans interférence avec le contenu.
• Il sera plus facile de faire des mises à jour de votre site pour profiter de nouvelles normes, d’amélioration ou de changements dans les fureteurs si toute l’information sur la présentation du site et dans un seul document.

L’usage des normes vous permet de vous assurer que votre site Web a une flexibilité lui permettant de grandir et de changer facilement.

Réduire les coûts au jour le jour

Peu importe sa taille, tout élément transféré a un coût. Selon votre service d’hébergement, peut-être payez-vous pour chaque élément que vos usagers téléchargent. En réduisant au minimum l’information inutile envoyée par votre site les coûts de maintien de votre site seront, eux aussi, diminués.

• En étant brèves et claires, les pages normalisées vont réduire de manière considérable vos coûts de bande passante. Des études de cas montrent que l’utilisation de mise en page basée sur les feuilles de style, et la séparation du contenu et de la présentation peuvent réduire le poids d’une page de 25 % à 50 %. De plus, l’expérience des usagers sera améliorée puisque les pages légères chargent plus rapidement.
• Avec des feuilles de styles utilisées par toutes les pages de votre site, l’information sera téléchargée une seule fois par usager grâce à la mémoire cache du serveur et du fureteur.

Ces deux facteurs contribuent à épargner sur la bande passante, ce qui signifie que les coûts associés à votre site seront réduits, simplement en utilisant les avantages des technologies existantes.

Augmenter votre public

Si votre site rencontre les directives et normes d’accessibilité et d’internationalisation, votre site sera automatiquement disponible à un public inattendu.

• En faisant des efforts pour rencontrer les normes d’internationalisation votre site pourra rejoindre et être utilisé par des gens partout dans le monde. Ces efforts signifie aussi que le jour où votre compagnie ouvrira des bureaux ailleurs sur la planète, vous n’aurez pas à refaire votre site simplement pour vous assurez que tout fonctionne correctement dans une autre langue.
• En vous assurant que votre site rencontre les directives d’accessibilité vous évitez peut-être de coûteuses poursuites judiciaires ou des plaintes dommageables. Mondialement, les législateurs ajoutent des clauses dans les lois sur les droits de l’homme ou créent des lois explicites qui garantissent l’accès (tel que la Section 508, ou le Disability Discrimaniation Act, etc.) En plus de répondre à des contraintes légales, avoir un site accessible signifie que vous ouvrez votre site à plus d’usagers; ainsi, vous ouvrez la porte à de plus grands bénéfices à long terme.

Améliorer votre image de marque, augmenter les bénéfices

Respecter les standards Web peut être bon pour votre image de marque. Peut-être vos coûts d’opération seront légèrement augmentés à court terme, mais votre image sera améliorée dans la communauté. En choisissant d’adopter les standards Web, vous dites à vos clients que vous :

• croyez que votre contenu doit être disponible à tous, peu importe la technologie choisie ;
• refusez de faire de la discrimination basée sur l’outil ou la méthode que l’usager utilise pour accéder au site — chaque expérience est importante pour vous ;
• vous assurez que votre site est accessible à tous et que votre entreprise et votre contenu sont ouverts à un public plus grand.

Respecter les standards Web est une bonne pratique et une preuve de conscience sociale, mais c’est aussi une façon d’ouvrir des opportunités à plus de clients loyaux, ce qui ne peut que vous avantager.

Parce que peu de compagnies sont conscientes des normes, ont pensé à leur impact ou ont investi les ressources pour étudier leurs bénéfices, il y a moyen pour vous et votre compagnie de saisir un réel avantage compétitif.

Les standards Web ont été créées dans le but d’être augmentées tout en tenant compte d’ajouts futurs. C’est une méthode solide et intelligente d’investir dans le futur car elles vous permettent de :

• créer des projets de développement Web qui peuvent s’élargir,
• éviter le risque d’être lié à une technologie propriétaire qui pourrait devenir désuète,
• adopter les meilleures pratiques,
• produire des sites Web accessibles à tous,
• produire des sites Web fonctionnels sur n’importe quel dispositif.

Saisissez la possibilité de dépasser vos compétiteurs et adoptez les standards Web!

Respecter les standards Web

Améliorer la mise en page de votre site avec les standards Web

Les standards Web et le design Web sont reliés mais sont quand même fort indépendants l’un de l’autre. Un site Web qui n’est pas conforme aux normes peut le devenir sans affecter son aspect. D’un autre côté, respecter les normes peu vous donner une plus grande flexibilité de design en vous permettant de faire des mises en page qui seraient impossible avec des méthodes non conformes.

Méthode de mise en page	Avantages	Désavantages
Basée sur les tableaux	fonctionne de manière identique sur presque tout les fureteurs graphiques possible d’avoir une mise en page conforme aux normes HTML	la plupart des mises en page basées sur les tables ne sont pas conformes pas suffisamment flexible pour fonctionner sur tous les types de médias le contenu pourrait ne pas être accessible à certains usagers
Basée sur le CSS	le contenu est disponible peu importe le média ou la plate-forme les fichiers sont plus petits, la page télécharge plus rapidement nécessite moins de bande passante le développement et la mise à jour sont plus rapides plus simple de changer l’aspect du site et plus…	les usagers avec de plus vieux fureteurs pourraient ne pas avoir la même expérience et certaines feuilles de style pourraient ne pas être rendues correctement, les développeurs Web pourraient avoir à apprendre de nouvelles techniques de travail.

Mise en page basée sur des tableaux

La méthode de design traditionnelle de pages Web est connue par les développeurs Web expérimentés comme « la mise en page basée sur les tables ». En utilisant cette méthode, les éléments d’une page Web — les titres de page, les menus, les graphiques et le contenu — sont disposés dans des tableaux HTML.

Les avantages

Ce type de mise en page est utilisée depuis longtemps et fonctionne uniformément sur presque tous les fureteurs graphiques, un avantage indéniable; ainsi, vous pouvez vous attendre à une consistance d’aspect sur divers ordinateurs.

Il est possible d’avoir une mise en page basée sur des tableaux qui soit conforme aux normes.

Les désavantages

Compte tenu du peu de connaissance des développeurs Web et du manque de support des normes dans presque tous les outils de développement, la plupart de ces sites ne sont pas conformes aux normes.

Malheureusement, les mises en page basées sur des tableaux ne sont pas suffisamment flexibles pour fonctionner correctement sur tous les dispositifs. Les technologies sans fils et les technologies d’aide comme les lecteurs d’écran, ne peuvent rendre correctement les mises en page basées sur des tableaux. Ceci signifie que ces sites pourraient être désagréables à utiliser et inaccessible à une partie de la population.

Mise en page basée sur des feuilles de style

Les développeurs Web expérimentés construisent de plus en plus de sites Web sans utiliser de tableaux pour la mise en page. Ceci signifie que les développeurs Web utilisent le HTML ou le XHTML uniquement pour un balisage structurel et utilisent une ou plusieurs feuilles de style globale pour spécifier tous les éléments de présentation — incluant le positionnement du contenu.

Les avantages

Un des avantages de la mise en page basée sur des feuilles de style est sa flexibilité — le contenu sera accessible peu importe le type de fureteur utilisé. Ceci permet aux développeurs Web de construire des sites qui vont fonctionner sur un grand nombre de dispositifs plutôt que juste un ordinateur personnel.

Parmi les autres avantages

• fichiers plus petits et téléchargement des pages plus rapide,
• moins de bande passante utilisée,
• développement et entretient plus rapide,
• l’aspect peut être changé plus facilement,
• et plus…

Ces avantages sont expliqués en détails dans la section « les avantages des standards Web ».

Les désavantages

Le principal désavantage des mises en page basées sur les feuilles de style c’est que les anciens fureteurs ne sont pas toujours capables de rendre le design tel que conçu car la norme CSS en était encore à ses balbutiements lorsque ces derniers ont étés lancés. Si les normes sont utilisées correctement, les usagers qui voient un site dont la mise en page est basées sur le CSS vont quand même être capables d’accéder au contenu; ces usagers auront simplement une expérience visuelle différente. La plupart des fureteurs modernes comme Mozilla, Opera, Konqueror ou Safari n’ont aucun problème avec les mises en page basées sur des feuilles de style. Internet Explorer de Microsoft, qui est sans conteste le fureteur le plus répandu, est aussi capable de rendre presque toutes les mises en page CSS, malgré tout, même les versions les plus récentes ont de la difficulté à supporter complètement les feuilles de style. Nous avons déjà parlé de ceci dans la section sur les mythes : « L’aspect n’est pas le même sur tous les fureteurs ».

C’est aussi un désavantage que beaucoup de développeurs Web ne sont pas familiers avec les mises en page basées sur des feuilles de style. Du temps a été nécessaire pour que les fureteurs appliquent les normes correctement; ainsi, les développeurs Web qui ne connaissent pas la méthode doivent apprendre de nouvelles techniques pour assurer un comportement consistant dans divers fureteurs.

Choisir une méthode

Les deux méthodes peuvent être conformes aux normes, mais lorsque vous choisissez la norme et la méthode à utiliser, vous devez choisir celle qui vous offrira le plus d’avantages. Pour réellement profiter des avantages liés au respect des normes, nous vous recommandons de faire le grand saut et d’adopter la mise en page basée sur des feuilles de style étant donné que c’est la méthode qui vous apportera le plus de bénéfices dans le futur.

Choisir vos normes

Choisir une méthode de mise en page

Plus tôt, nous avons décrit les deux méthodes de développement principales utilisées par les développeurs Web : la méthode basée sur des tableaux qui utilise des tableaux HTML pour la mise en page et la méthode basée sur des feuilles de style pour la mise en page. La méthode basée sur des tableaux permet aux développeurs de tenir compte des fureteurs plus anciens en perdant en flexibilité pour gérer des appareils modernes tels que les téléphones ou les assistants personnels (PDA). La méthode de design basée sur des feuilles de style a l’avantage d’offrir une accessibilité et une interopérabilité de base, le compromis à faire est une expérience visuelle plus simple dans les plus vieux fureteurs.

XHTML ou HTML

Vous pouvez utiliser la méthode de mise en page basée sur des tableaux ou la méthode basée sur des feuilles de style pour faire des documents valides selon la norme XHTML 1.0 Strict ou le CSS. Étant donné qu’il n’y a plus aucun avantage à utiliser du HTML 4.01, nous vous suggérons de démarrer tous vos nouveaux projets en XHTML. Ceci vous permettra de gérer différentes version de XHTML dans le futur (par exemple, le XHTML pour les dispositifs mobiles) avec une grande facilité. Le XHTML est très proche du XML qui offre un éventail d’options pour gérer des données si votre contenu doit s’agrandir.

Certaines personnes pourraient dire qu’il n’y a pas de réel avantage à utiliser du XHTML car les fureteurs d’aujourd’hui ne supportent pas le XHTML différemment du HTML 4.01. Par contre, développer en XHTML est plus difficile que développer en HTML 4.01. Lorsque tous les fureteurs supporteront le XHTML correctement, vous n’aurez que de petits changements à effectuer sur votre serveur pour faire le saut.

Vous pouvez déjà servir du XHTML correctement aux clients qui le supportent. Voici comment [en].

Les lois sur l’accessibilité

Il est dans votre intérêt d’adopter les normes d’accessibilité, la plus répandue étant les Directives pour l’accessibilité aux contenus Web. Aux États-Unis, la norme définitive est la section 508 du Rehabilitation Act, mais dans d’autres pays, les lois changent. Au Royaume-Uni, la loi en vigueur est le Disability Discrimination Act. Prenez le temps de vérifier quelles sont les lois en vigueur chez-vous. C’est une bonne pratique de rendre votre site accessible: vous évitez ainsi des ennuis juridiques et vous ouvrez la porte à plus de clients.

Exigez le meilleur

Si vous sous-contractez ou que vous engagez des consultants pour construire votre site Web, faites des normes un élément essentiel de votre offre de service ou de votre cahier de charges :

• Assurez-vous de spécifier les normes à utiliser, ainsi que la version des normes requises — par exemple : vous pouvez exiger que le site utilise du XHTML 1.0 Strict, du CSS 2.0 et du SVG 1.1.
• L’accessibilité Web continue à attirer l’attention du public. Vous devriez exiger un site accessible conforme aux Directives pour l’accessibilité aux contenus Web et aux lois en vigueur chez-vous.
• Si votre site est international, assurez-vous qu’il puisse rejoindre tout le monde et exiger de votre fournisseur et de son équipe qu’ils produisent un site qui prend en considération l’internationalisation.

Vous avez le droit d’exiger ce que vous croyez le mieux pour votre entreprise autant dans le processus de développement que dans le produit fini; exigez le respect des normes.

Formez votre équipe

Selon les habilités et l’expérience de vos développeurs Web, ils peuvent ou non connaître les normes. Il est possible que vous ayez des commentaires cyniques ou de l’incompréhension lorsque vous parlerez des normes la première fois.

Les développeurs n’ont pas adopté les normes rapidement pour diverses raisons :

On ne leur a pas enseigné correctement

Le Web a grandit rapidement et sauvagement. Résultat, beaucoup de livres et de cours de design sont basés sur des pratiques dépassées et incorrectes dans le but de tirer profit du développement d’Internet. Ceci met sérieusement en jeu les capacités et connaissances des développeurs d’aujourd’hui.

Les développeurs Web ne savent peut-être pas que les choses changes et, s’ils ne font pas attention, leurs compétences seront vite dépassées si elles ne le sont pas déjà. Il est donc important que les membres de votre équipe soient formés sur les standards Web car ce sont eux qui vont s’assurer que vos sites soient efficaces. Vous devez former :

• l’équipe de développement,
• l’équipe de design,
• les gestionnaires de projet,
• l’équipe de mise à jour,
• l’équipe d’assurance qualité,
• les producteurs de contenu.

Les outils qu’ils utilisent ne produisent pas du code normalisé

Durant les années de croissance rapide, les manufacturiers d’outils de développement s’intéressaient plus à assurer leur part de marché qu’à générer des sites de qualité. Ainsi, beaucoup d’outils sont basés sur une fausse connaissance du HTML et des pratiques de développement dépassées. Si vos développeurs utilisent des outils non conformes aux normes, c’est compréhensible qu’ils n’aient jamais été exposés aux meilleures pratiques.

Vous pouvez trouver des outils qui vont vous aider vous et votre équipe à adopter les standards Web. La dernière version de Dreamweaver MX utilise le CSS à un degré assez élevé, permettant ainsi de faire des mises en page basées sur les feuilles de style assez facilement. Ça peut sembler complexe, mais la tâche la plus dure sera d’éduquer votre équipe et de leur fournir des outils permettant de générer du code normalisé.

« C’est trop difficile »

Beaucoup de développeurs Web ont appris à créer des sites selon une méthode et n’ont pas senti le besoin d’en changer car les fureteurs et les agents utilisateurs ont toujours étés très tolérant envers un code HTML non valide et mal structuré. Résultat, certains développeurs ne sont pas disposés à apprendre de nouvelles et meilleures méthodes pour créer des sites Web. Vous pourriez aussi faire face à un certain cynisme de la par de développeurs qui ont trouvé que le CSS était dur à utiliser car ils croient à la mise en page « au pixel près » (voir le Mythe nº 4). Un mauvais support des feuilles de style dans les anciens fureteurs a aussi découragé certain développeurs d’adopter des technologies normalisées. Toutefois, des fureteurs modernes comme Mozilla, Safari et Konqueror supportent correctement les normes. Les fureteurs, les outils de développement et les développeurs vont maintenant vers les normes.

Lorsque votre équipe sera formée et correctement équipée, vous pourrez utiliser certaines méthodes pour vous assurer que vos sites répondent continuellement aux standards Web.

Que faire pour des sites existants

Si vous avez déjà un site Web, nous vous suggérons une stratégie incrémentielle pour normaliser votre site.

Cette stratégie a été exposée et expliquée en détail dans un article intitulé « Web Standards Switch » sur le site d’assurance qualité du W3C.

Le changement vers un site normalisé peut être intégré dans votre processus d’assurance qualité en :

1. choisissant la norme à respecter, déterminant la stratégie à adopter pour rendre le site accessible, comment les principes d’internationalisation s’appliquent à votre site et n’importe quelle autre amélioration qui sera faite au site;
2. analyser votre site selon ces critères en utilisant le validateur de journal (Log Validator) — un outil développé par le W3C pour aider à améliorer les pages les plus vues sur un site;
3. réparant sur une base régulière les 10 pages les plus populaires du site en utilisant le validateur de journal. Ainsi, vous commencez par les 10 pages les plus populaires et, éventuellement, vous aurez corrigé tout votre site;
4. révisant votre processus régulièrement pour vous assurer que les pages sont convertie aux normes.

Ainsi, vous vous assurez que votre site répond aux normes de qualité que vous avez choisis de rencontrer.

Que faire pour de nouveaux sites

Si vous aller bientôt débuter un projet Web, vous avez la chance d’être en position de commencer à neuf — vous êtes en position idéale pour profiter des standards Web.

Faire des standards Web un requis pour votre site Internet.

Que vous développiez votre site à l’interne ou que vous sous contractiez le projet à l’externe, vous aller devoir spécifier clairement quelles normes rencontrer. L’article du groupe d’assurance qualité du W3C (W3C QA Group) a publié un article intitulé « acheter des sites Web répondants aux normes » qui comprend une table des requis spécifiques qui pourrait vous intéresser.

Ajouter la normalisation dans les requis de vos outils de gestion de contenu

Si vous projetez acheter un système de gestion de contenu (CMS), pensez à ajouter la normalisation dans votre liste de requis. Si vous avez déjà acheté un CMS, informez-vous sur des modules à ajouter ou les modifications à apporter pour créer du code normalisé.

Assurez-vous que les processus sont en place pour que votre site reste normalisé

Maintenez la normalisation lors de chaque étape de développement de votre site — le design, le développement, les phases de tests et l’entretient. Assurez-vous que les outils utilisés par les développeurs et les contributeurs au site son capables de créer et de maintenir un site répondant aux normes que vous avez choisies. Par exemple, les créateurs de contenu utilisant un CMS devraient contribuer aux pages normalisées. Par contre, peut-être n’ont-ils pas un contrôle direct sur le CMS; ceci signifie que ce dernier doit être conçu pour produire du code répondant aux normes.

Il est important de dépasser les requis initiaux pour planifier les processus qui assureront que votre site reste normalisé dans le futur. C’est la seule manière de récolter les avantages des standards Web.

Convertir les sites Web en développement

Si vous avez déjà un site en développement, peut-être sera-t-il un peu plus complexe de changer les requis. Lorsque des changements sont demandés, il faut toujours considérer des coûts et des délais supplémentaires. N’oubliez pas qu’utiliser les standards Web est une manière d’épargner de l’argent à long terme. Intégrer les normes dans votre projet maintenant peut sembler contre-productif parce que vos fournisseurs peuvent vous pénaliser si vous n’aviez pas spécifié ces normes dans vos exigences d’origine, ou ça peut donner l’impression de rajouter du temps au projet, mais, souvenez-vous : à long terme, les réductions de coûts vont peser plus dans la balance que les ressources initiales que vous avez dû dépenser pour améliorer le processus. Cela peu aussi vous aider à répondre aux lois sur l’accessibilité et vous épargner ainsi des coûts légaux pour un site non conforme. Dans le but de faire un changement permanent pour le mieux, intégrez dans votre projet de développement Web des processus qui supportent l’implantation de normes.

Si vous êtes :

• au début de votre développement — comme par exemple à l’étape de l’analyse de faisabilité — ajoutez les standards Web maintenant. C’est bien connu dans le monde du développement logiciel : plus un changement est introduit tradivement, plus cher il coût. Intégrer les standards Web dans vos processus le plus tôt possible vous épargnera de l’argent et des ressources lorsque votre projet prendra de la maturité.

• au milieu de votre projet, par exemple si du développement a déjà était fait, et qu’il y a déjà une partie du design de complété, assurez-vous que tout ce qui se fait à partir de maintenant réponde aux normes. En même temps, peut-être arriverez-vous à introduire des processus qui amélioreront des parties du site qui ne répondent pas encore aux normes.

• presque à la fin, l’idéal serait similaire à que faire pour des sites existants. Introduisez les processus pour assurer la normalisation lors de votre phase d’assurance qualité et faites des normes un élément important de la phase d’entretien. Ainsi, les nouveaux contenus répondront aux standards Web.

Peu importe l’étape à laquelle vous êtes dans un projet déjà existant, il y a de grands avantages à adopter les standards Web.

Assurance qualité et validation

Qu’est-ce que la validation?

La validation est le processus par lequel vous vérifiez vos pages Web. C’est une méthode solide et simple de s’assurer qu’un site Internet est en bonne voie de répondre aux normes. Comme le HTML et le CSS sont des langages formels, valider signifier vérifier le HTML et le CSS de votre site selon des grammaires formelles (appelées des définitions de type de document ou DTD — Document Type Definitions) — un peu comme vous vérifiez l’orthographe et la grammaire dans les courriels que vous envoyez. Il existe différents types de validation, mais dans le contexte de ce document, nous n’explorerons que la validation HTML et CSS.

Les outils servant à valider des pages Web sont connus sous le nom de validateurs. Ces validateurs sont disponibles gratuitement sur le site du W3C. Ceux-ci peuvent vérifier chaque page individuellement. Il y a d’autre validateurs (qu’il faut acheter) qui peuvent vérifier un site complet. Toutefois, les plus à jour sont ceux du W3C.

Le W3C héberge des validateurs HTML et CSS qui sont mis à jour en fonction des normes au fur et à mesure qu’elles sont développées. Vous pouvez les trouver aux adresses suivantes :

La validation fait partie de l’assurance qualité efficace

Des problèmes tels que des comportements inattendus dans certains fureteurs ou d’étranges problèmes de mise en page peuvent survenir uniquement parce que le HTML ou le CSS contient des erreurs. Valider vos pages pour trouver et corriger ces erreurs peut améliorer la présentation de votre site sur les différents agents utilisateurs.

La validation est :

• la méthode la plus simple et la moins chère de faire un contrôle de qualité sur le HTML et le CSS de votre site Web ;
• une manière efficace de détecter l’erreur humaine ;
• une méthode pour faire un contrôle intermittent du travail de votre équipe pour vous assurer de la qualité de leur HTML et CSS ;
• une façon de repérer autant les erreurs habituelles que les erreurs inhabituelle dans le HTML et le CSS — un peu comme passer une lettre dans un vérificateur d’orthographe ;
• la méthode la plus simple pour vous assurez que vos pages Web répondent aux normes en utilisant des outils automatiques ;
• un outil reconnu pour son efficacité à pointer les erreurs dans vos gabarits. Si vous détectez et corrigez une erreur dans vos gabarits, vous êtes en bonne voie d’améliorer la qualité générale de votre site.

La validation épargne temps et tracas

La validation offre une manière solide d’investiguer des problèmes dans un design. En passant vos pages au validateur, vous pouvez déterminer rapidement quels sont les problèmes en isolant la ligne qui ne répond pas aux normes. Bien que les validateurs ne trouvent pas toutes les erreurs, ils vont pointer vers les plus criantes, vous permettant d’utiliser votre temps à régler de réels problèmes plutôt que de simples erreurs.

Comprendre les résultats du validateur

Si vous n’avez jamais utilisé les validateurs du W3C, leurs résultats peuvent sembler incompréhensibles. Comme il s’agit uniquement d’un outil automatique, un validateur rapporte tous les problèmes qu’il trouve et offre une explication. Après avoir réglé le premier problème et re-validé la page, peut-être que le nombre d’erreurs aura grandement diminué. Chaque erreur crée un effet domino et ajoute ainsi d’autres erreurs. Après avoir utilisé le validateur quelques fois, vous serez familier avec ses messages qui décrivent les erreurs les plus communes.

Dompter les outils pour produire des pages qui respectent les normes

Les éditeurs « WYSIWYG » (What You See Is What You Get) tels que FrontPage, Dreamweaver ou GoLive permettent aux usagers de créer facilement et rapidement des sites Web. En général, ces outils sont programmés pour générer du HTML ou du CSS propriétaire ne respectant pas les normes — à moins d’apporter quelques modifications et changements aux préférences. En faisant quelques configurations, la plupart de ces outils peuvent être ajustés pour produire des pages normalisées. Dans la plupart des applications, vous pouvez ajuster les configurations dans le menu « Préférences » (ou l’équivalent) pour produire du code répondant aux normes. Dans les cas où ceci ne serait pas suffisant, des outils de tierces partis tels que HTML Tidy et le kit d’accessibilité de Lift sont disponible, soit en version autonome, soit comme plugiciel.

Dreamweaver MX peut facillement être configuré pour générer des pages normalisées. Vous pouvez aussi forcer Dreamweaver 4 à produire des pages Web répondants aux normes. Bien que FrontPage 2000 et FrontPage 2002 puissent aussi êtres configurés pour générer du code normalisé, ils sont plus difficiles à configurer que Dreamweaver MX. Vous pouvez aussi considérer utiliser Mozilla Composer qui produit des pages Web conforme par défaut et qui est disponible gratuitement sur le site http://www.mozilla.org.

Annexe

Le langage HTML (HyperText Markup Language) et le langage XHTML (eXtensible HyperText Markup Language)

Depuis les débuts du Web, il y a eu plusieurs version de HTML, mais, généralement, il y a encore 3 versions utilisées en développement WEb: le HTML 3.2, le HTML 4 et le XHTML 1.

Le HTML 3.2 a été crée dans le but d’englober les pratiques HTML des développeurs en 1996. Il remplace le HTML 2.0 qui était la pratique commune en 1994.

Le HTML 4.0 a été lancé en 1997 et, en 1998, il a été révisé et quelques corrections mineures ont été apportées sous le nom de HTML 4.01. La version finale du HTML 4.01 a été lancée en décembre 1999.

Avec le HTML 4.0 et 4.01 de nouvelles approches de design Web, incluant une certaine emphase sur l’accessibilité, l’internationalisation, un rendu des pages plus rapide dans les fureteurs et un meilleur support pour la séparation de la présentation et de la structure grâce aux feuilles de style ont vu le jour.

Lancé en janvier 2000, le XHTML 1.0 est une famille de langages de balisage qui reformulent le HTML comme une application du XML 1.0 (eXtensible Markup Language). En faisant le pont entre des versions précédentes du HTML et du XML, le XHTML est en mesure d’exploiter toute la richesse des technologies XML tout en gardant la capacité du HTML de présenter des documents dans les fureteurs actuels. Le XHTML 1.1 a été lancé en mai 2001 avec peu de changement dans le but d’établir les bases pour éventuellement agrandir la famille des types de documents XHTML.

Il y a peu de différences techniques entre le développement en XHTML 1.0 et en HTML 4.01. La différence majeure est un requis cosmétique: le balisage doit être bien formé en accord avec du XML valide. Ainsi, il est plus simple pour des développeurs produisant déjà du HTML 4.01 valide de débuter en XHTML 1.0.

Le XHTML 2.0 est en développement et ouvre la voie aux documents avec un balisage purement structurel, laissant les éléments de présentation aux feuilles de style. Le XHTML 2.0 sera mieux intégré avec les technologies XML; certaines sections du (X)HTML pourraient devenir désuètes ou être omises pour laisser plus de place aux technologies XML ayant les mêmes capacités. Le développement du XHTML 2.0 en est encore à ses balbutiements, et beaucoup d’éléments de la norme n’ont pas encore étés définis.

Remerciements

Un grand merci à :

L’équipe de MACCAWS : Tara Cleveland, Tony Crockford, Tom Dell’Aringa, Char James-Tanny, Rebecca Milot-Bradford, Dunstan Orchard, Ranjan, Francis Storr, Stephen Taylor, et Stephanie Troeth.

Relecture : Stephanie Booth, Garrett Coakley, Maciej Ceglowski, Gordon Cleveland, Karl Dubost, Emma Jane Hogbin, Holly Marie Koltz, Ethan Marcotte, Judah McAuley, Rebecca Tierney-Hynes, et Olivier Thereaux.

Générique

Ce document a été compilé par Stephanie Troeth et rédigé par Tara Cleveland et Rebecca Milot-Bradford.

Traduction

L’équipe de W3Québec : Chantal Ide (traduction), Normand Lamoureux (relecture) et Denis Boudreau (relecture).