TUTORIEL ALGO/METHODES 
Dix raisons d'utiliser XHTML, les CSS et le DOM
Gain de temps, réduction de charge, accessibilité, lisibilité du code, mais aussi amélioration de l'expérience utilisateur sont notamment à la clé. (21/10/2004)
  Forum

Réagissez dans les forums de JDN Développeurs

Sans être la réponse à tous les problèmes (notamment le référencement dans les moteurs de recherche), le trio XHTML / CSS/ DOM - tous trois standards W3C - apporte son lot d'avantages. Nous avons voulu en lister dix, avec l'optique de l'intérêt pratique pour le développeur, son entreprise, et les internautes.

1) Gagner du temps en séparant le contenu de la présentation
L'usage de balises sémantiques liées à des règles CSS octroie un gain de temps significatif tant lors de la création d'un site Web que lors de sa refonte. Le double intérêt : respecter la logique du contenu, et ne travailler que sur une seule feuille de style pour l'ensemble des pages (même pour les sites en possédant des milliers). L'argument est encore valable (même d'autant plus) lors de la refonte graphique d'un site déjà conçu en XHTML+CSS : partant du principe que le contenu reste le même, le développeur n'a alors aucune raison de toucher aux fichiers XHTML.
L'exemple le plus probant reste le projet CSS Zen Garden, où à partir d'une page XHTML, des dizaines de designers ont créé des mises en forme très variées avec la seule feuille de style, et les fichiers d'images.

2) Réduire la charge du serveur
Le système de cache des navigateurs permet de conserver en mémoire une partie des fichiers téléchargés pour une première page, dispensant donc de les télécharger à nouveau. C'est vrai pour les images, mais également pour les fichiers CSS. En plaçant la mise en page d'un site dans un tel fichier, on allège non seulement ses pages XHTML, mais on obtient également une nette réduction de la charge sur le serveur (et de la bande passante utilisée), simplement car la mise en page n'est téléchargée qu'une fois, et ensuite disponible dans le cache. Les coûts liés à l'hébergement d'un site en sont d'autant abaissés.

3) Favoriser l'accessibilité
Tous les internautes n'ont pas une vision parfaite (voire pas de vision du tout), ni une connexion haut-débit, ni même un ordinateur (mais juste un assistant personnel, par exemple). Concevoir un site en respectant les spécifications XHTML et CSS permet d'obtenir un site plus accessible à ceux qui sont "différents".
Par exemple, le balisage sémantique est mieux compris par les lecteurs Braille, les designs CSS sont adaptés à l'augmentation de taille de police qu'un malvoyant est susceptible d'appliquer à un texte (si son navigateur le permet), un site reposant totalement sur CSS pour sa mise en page sera lisible depuis un téléphone portable sans page spéciale (là où un site construit avec des tableaux imbriqués ne sera lisible que via un navigateur classique).

4) Rendre le code plus lisible
Le XHTML utilise la cohérence de XML pour améliorer HTML. De son coté, CSS et le DOM favorisent l'exclusivité des balises sémantiques dans le code XHTML. En définitive, une page XHTML est bien plus lisible pour le développeur, et plus logique également, que la même page réalisée avec les techniques de 1999.

5) Améliorer l'expérience utilisateur
La refonte d'un site est grandement facilitée par les CSS, mais c'est oublier qu'elles permettent également de proposer plusieurs mises en page (ou plus simplement plusieurs tailles de police) à ses visiteurs. Ceux-ci ne sont donc plus prisonniers d'une mise en page, mais peuvent choisir la plus adaptée à leur usage… et même concevoir leur propre mise en page, appliquée via la fonctionnalité idoine de certains navigateurs.

6) Plus de versions imprimables spécifiques à prévoir
Il en est de même pour l'impression : il n'est plus nécessaire de créer une page à part, avec le contenu épuré, pour que l'internaute l'imprime, car les navigateurs modernes reconnaissent les règles CSS spécifiant la structure visuelle d'une page imprimée.

7) Anticiper sur le futur
Un site valide XHTML+CSS sera lisible par tous les futurs systèmes (PC/Mac/Linux, PDA, téléphone, montre…), et tous les navigateurs modernes. Les navigateurs ne respectant pas les standards sont au contraire un pari plus aléatoire.

8) Faire plaisir aux moteurs de recherche
Les moteurs de recherches préfèrent le code "propre" et valide au code mal conçu : Google et les autres grands moteurs prennent en compte les balises sémantiques dans leur indexation. Ainsi, une entête encadrée par <h1> sera privilégiée par rapport à un <font size="14">…

9) L'apprentissage est facile
XHTML (dans son "incarnation" Transitionnal) est très proche de HTML : les "mauvaises habitudes" seront d'autant plus rapidement perdues que leur application paraît moins logique. La spécification CSS reprend et étend les terminologies des balises visuelles HTML : polices, positions, couleurs... Les bases de CSS sont de surcroît simples à apprendre.

De plus, le DOM rend la programmation JavaScript plus simple : le développeur n'a plus à travailler par rapport au support JS d'un navigateur donné à l'exclusion des autres, ou par rapport à une poignée de navigateurs. Il lui suffit de travailler par rapport au standard DOM. Son travail devient donc plus aisé et plus efficace (syntaxe pointée, méthode logiques). Pourquoi se refuser de bonnes habitudes et un site moderne ?

10) S'ouvrir à de nouveaux visiteurs
Les sites modernes fonctionnent correctement avec les anciens navigateurs : si le design n'est pas à 100% respecté au pixel près, le site reste accessible à tous et surtout le contenu est lisible sur tous les systèmes. Il est démontré que les utilisateurs sont d'abord intéressés par le contenu, non les images ou la mise en page (voir la récente "heatmap" publiée par la Poynter Institute). Pourtant de nombreux sites continuent de concevoir leur balisage à destination avant tout des anciens navigateurs (ou d'un seul navigateur). Il se laissent alors enfermer par un groupe d'utilisateurs, quand en respectant les standards ils pourraient en satisfaire de nombreux autres (probablement plus).

Bilan & conclusion
Comme nous l'avons déjà dit, Netscape 4 et IE 4 disparaissent, et sont largement dépassés par FireFox/Mozilla, Opera, Safari, IE6 et les autres navigateurs modernes… Netscape était il n'y a pas si longtemps que ça LE navigateur pour lequel il fallait développer. Il a ensuite était supplanté par IE. Combien de temps son hégémonie (du moins sur Windows…) durera-t-elle ? Une entreprise doit-elle baser ses efforts sur un site à destination d'un navigateur/système d'exploitation, ou à tous les navigateurs modernes, quel que soit le système d'exploitation ?

Les anciens navigateurs peuvent lire les pages en XHTML, et les navigateurs modernes sont conçus pour mieux comprendre et gérer les pages répondants aux standards actuels (hors IE6, qui comporte encore certaines lacunes regrettables coté CSS). Il est donc plus logique à long terme de créer dès maintenant des sites compatibles (à commencer par retirer les balises obsolètes comme FONT) avec tous les navigateurs modernes et à venir…

  Forum

Réagissez dans les forums de JDN Développeurs

Bien sûr nombre d'obstacles peuvent retarder, et même empêcher, la réalisation ou la refonte d'un site Web selon les standards W3C. Chaque cas est différent, et requiert une attention particulière. Il est ainsi très difficile de transformer un site de plusieurs centaines de pages non dynamiques en XHTML+CSS : l'existence d'un modèle de page peut faciliter la transition, mais sûrement pas la rendre automatique. De même, si chaque page est créée par des rédacteurs plutôt que des techniciens, le risque d'invalider les pages est décuplé.

 
Xavier Borderie, JDN Développeurs
 
Accueil | Haut de page
 
 





Quand achetez-vous le plus en ligne ?
Du lundi au vendredi
Le samedi
Le dimanche

Tous les sondages