 Vous ètes webmaster amateur, ou vous avez été webmaster professionnel il y a de cela quelques années, vous vous demandez pourquoi passer au xhtml/css alors que les navigateurs sont toujours capables de comprendre le bon vieux html? Pourquoi passer au xhtml/css alors que le langage html est plus simple et moins exigeant dans sa structure globale? Et enfin, la question qui revient souvent (et on se demande pourquoi) pourquoi remplacer nos fameux tableaux par des divisions?
Genèse de l'évolution des langages
Le html, tout comme le xhtml est un langage à balises (qui servent à marquer le contenu de la page: ex; pour des paragraphes, on utilise la balise <p>, pour le "corps" de la page on utilise la balise <body>). La grande différence entre ces deux langages demeurent dans la souplesse et la flexibilité de leurs codes. En effet, le html se démarque par sa grande souplesse: une balise <p> ouverte peut ne pas être refermée; le nom des balises n'est pas sensible à la casse (on peut mélanger les majuscules et les minuscules) -pour ne citer que ces exemples là.
Par contre le xhtml est beaucoup plus exigeant que son prédécesseur. L'une des grandes différences résulte dans l'objectif principal du xhtml: définir un code simple, clair, détaillé et accessible à toutes personnes. Pour ce faire, le xhtml n'est pas aussi "brouillon" que le html; on ne peut se permettre par exemple de ne pas fermer une balise sans générer des erreurs lors des étapes de validation du code (exemple de validateur); Le xhtml n'admet pas non plus le mélange des majuscules et des minuscules (le codage se fait en minuscule; et aussi le xhtml n'a tout son sens lorsque son code principal est séparé des codes de "marquage visuel" (couleur, positionnement, polices, tailles de polices...) dans un autre fichier: le fichier CSS
Vous en déduisez donc que le html a donné un langage plus complexe, et qui de surcroît ne se charge "normalement" pas de la gestion de certains paramètres. Pourquoi normalement? Parce qu'il n'est pas rare de voir dans du code xhtml les paramètres css insérés directement dans les balises concernées. Ceci n'est évidemment pas conseillé puisqu'il réduit à néant les grands avantages du xhtml/css. Mais par contre, si vous codez en xhtml avec un fichier css distinct, la mise à jour (que ce soit du contenu ou encore des images et graphiques) est beaucoup plus simple, car du coup, votre code xhtml est beaucoup plus clair (étant allégé au profit du css) et à partir d'un seul fichier css vous pourrez changer toutes les polices du site par exemple, ou encore toutes vos couleurs ou image d'arrière plan.
Pour finir il faut savoir qu'une page réalisée en xhtml/css avec des balises utiles et des div est beaucoup moins lourde que celle réalisée avec des tableaux; la première est plus intuitive et son référencement dans les moteurs de recherche plus facilitée.
Faut-il remplacer les tableaux par les div?
Il faut tout d'abord expliquer que les tableaux n'étaient pas à la base (et ne sont toujours pas) des outils destinés à réaliser une mise en page. Les tableaux servent à ranger des données comme des feuilles excel, des données de statistiques... Les incroyables possibilités qu'ils offrent concernant la mise en page, et leur inflexibilité quelque soit le navigateur utilisé, ont fait des tableaux des outils longtemps utilisés dans le monde du web. Cependant, depuis quelques années, le World Wide Web Consortium (W3C) qui se charge de définir les règles à suivre pour la création des sites "intelligents" a plutôt recommandé l'usage des balises qu'il faut là où il faut, et au cas échéant l'utilisation des divisions
C'est là que réside toute la valeur du xhtml. l'usage d'une balise de titre (h1, h2, h3...) pour écrire un titre, ou encore la fermeture des balises dites "vides" comme celle des images <img src="/nom_de_l_image" alt="" /> autrefois restée ouverte en html; bref l'usage qu'il faut là où il faut.
Il ne s'agit donc plus de commencer un site en créant un tableau et en y insérant des images ou du texte, non; il s'agit d'insérer des balises directement, de leur appliquer un style en css, et si besoin (pour les balises pour lesquelles on ne peut appliquer un style) créer des divisions pour les positionner (lire les excellents tutoriels sur le positionnement d'Alsacréation ou de openweb)
Vous aurez donc compris que les tableaux n'ont pas à être systématiquement remplacé par des div, (cette quête peut être dans certains cas, pour les débutants un vrai casse tête, les positionnements n'étant pas aussi intuitif que ceux des tableaux). Une étape à ne jamais sauter pendant la création des pages en xhtml et css: toujours vérifier le rendu sur tous les navigateurs que vous pourrez vous procurer, (internet explorer 7 -au moins; cette version est la plus répandue-; firefox; chrome; safari; opéra) et corriger les éventuels bugs.
Le xhtml et les cms
Lorsque vous créez un template en xhtml pour un cms (par exemple joomla) vous avez toujours tendance à penser que ce template conviendra quelque soit les modules à installer. Toujours prendre garde à ne pas oublier que certains modules, créés en xhtml aussi, possède des attributs margin et padding qui pourraient désorganiser un alignement strict de divisions. Ce qui peut causer une déformation de votre template selon que vous avez tel ou tel module.
Solution: ne pas paniquer, jetez un coup d'oeil au fichier css dudit module et effacer les attributs margin ou padding (ou plutôt réduire la valeur), au bon endroit!!!!
( 521 lecteurs) |
