Vous êtes ici :  Accueil    Formations online    Webmaster pro
  Niveau 1    XHTML    Introduction

Introduction au XHTML

Arrivé à la version 4 du HTML, le W3C - l'organisme responsable de la "normalisation" du langage de base employé par le Web - s'est rendu compte que les balises et attributs de son idiome préféré ne seront plus longtemps suffisants pour diriger les tâches futures de l'Internet. C'est qu'à la fin 2002, seulement 25 pour cent des internautes utiliseront encore un navigateur "classique" pour visualiser des pages sur un écran "classique" d'ordinateur. On pense que 75 pour cent des futurs surfers préféreront des supports alternatifs tels que les téléphones portables, les téléviseurs, les ordinateurs de voiture etc. Nous aurons donc besoin non seulement de navigateurs adaptés à ces nouveaux supports, mais aussi de langages adéquats.
 
L'idée, toutefois, d'être obligés de programmer ses futurs sites en, peut-être, quatre ou cinq langages différents - un pour chaque support - a tout pour effrayer un Webmaster déjà surmené. Il est vrai que personne n'a jamais demandé leur avis aux créateurs des sites... mais l'expérience a déjà établi la règle : plus efficace le travail des Webmasters, plus grand le nombre des sites valables sur le Net. Les membres du W3C ont donc compris qu'il est nécessaire de mettre à leur disposition un idiome assez flexible pour être accepté par tous les supports modernes.
 
C'est pourquoi, le 26 janvier 2000, ils ont lancé un tel langage, le XHTML 1.0 qui, enfin, a créé le "pont" si recherché qui mène de "l'ancien" Web au réseau "étendu" de l'avenir. Comme l'indique son nom, la nouvelle création est une sorte de "mélange" réussi du HTML et du XLM, associant les vertus des deux. Le HTML, pourrait-on dire, a donné son vocabulaire, le XML a offert sa syntaxe...

XHTML, une version moderne du HTML ?

Le HTML, le HyperText Markup Language, consiste dans un certain nombre d'éléments - de marqueurs - dont l'ensemble forme la base de l'idiome. Pour ajouter un élément à cet ensemble, il est donc nécessaire de "réformer" sa structure entière ce qui, chaque fois, entraîne le besoin d'une nouvelle génération de navigateurs, oblige les internautes de se procurer des mises à jour ...

Le XML, par contre, l'eXtensible Markup Language, a l'avantage d'être plus "souple" déjà dans sa base. Non seulement qu'il permet aux programmeurs de déclarer leurs propres balises, il est évidemment aussi ouvert à tout nouvel élément introduit du côté "officiel".

Finalement, le XHTML, l'eXtensible HyperText Markup Language, a combiné ces deux idiomes au point de disposer d'un vocabulaire aussi facile que celui du HTML mais, en même temps, de pouvoir profiter du "talent" du XML de s'adapter aux exigences de la technique future sans qu'il soit nécessaire de modifier sa structure de base pour chaque nouvelle invention.

Ceux qui maîtrisent le HTML - complété par une bonne connaissance de la technique des CSS - ne rencontreront alors aucune difficulté et apprendront le nouveau langage sans aucun problème.
 
Les études du XHTML ont également l'avantage de fournir au programmeur une base solide lui permettant d'accéder plus facilement aux autres applications fondées sur XML comme, par exemple, le SMIL ou le WML. - Bien qu'il y ait un tout petit "défaut"...
 
Lorsque les créateurs des navigateurs se sont aperçus du nombre de plus en plus important de Webmasters qui ont appris leur HTML "sur le tas" et qui, par conséquent, sont souvent loin de se tenir aux règles fixées par le W3C, ils ont tout fait pour que les fautes des "Webmasters amateurs" ne se remarquent pas. C'est pourquoi certains navigateurs sont même capables d'interpréter un code dont la syntaxe n'est pas du tout correcte...
 
Le XHTML, malgré sa souplesse, n'est par contre jamais prêt à "pardonner" la moindre faute de frappe, de syntaxe ou les "produits" de pure inattention.

	qui, bien qu'il ait gardé bon nombre de ses anciens principes, est devenu beaucoup plus strict ;
	plus souple en ce qui concerne les commandes et prêt à recueillir toute sorte de nouvel élément ;
	capable de communiquer avec tous les nouveaux supports à la fois ;
	adaptable aux techniques et supports futurs ;
	aussi facile à apprendre et à employer que le HTML "classique".

Et n'oublions surtout pas un autre avantage très appréciable du XHTML : déjà la génération présente de navigateurs est capable de le comprendre...

Le XHTML face au HTML

Si, maintenant, nous prenons la décision de transformer nos pages HTML en pages XHTML ou, alternativement, de programmer directement en XHTML, nous disposons d'un avantage non négligeable : grâce à notre formation HTML, nous possédons déjà des connaissances parfaites des balises et attributs. Nous n'avons donc pas besoin de repartir à zéro. - Comme le XHTML se sert pratiquement des mêmes éléments que le HTML, nous pouvons nous servir de ce que nous maîtrisons depuis longtemps - nous n'avons qu'à l'adapter à l'écriture XML.
 
Toutefois, nous avons déjà appris que le XHTML - au contraire du HTML - fait partie de la "famille" des langages XML. Il est donc logique que, malgré toute affinité entre les deux techniques, on trouve toujours certaines différences entre une page rédigée en HTML et un code écrit en XHTML. Prenons, par exemple, les lignes suivantes. Bien que, dans les deux cas, les navigateurs affichent des résultats identiques, les codes n'ont pas tout à fait la même apparence.

	que toutes les instructions (balises, attributs, etc.) du code XHTML sont rédigées en minuscules.
Au contraire du HTML dont la technique accepte un "mélange" de majuscules et minuscules - bien qu'un tel mélange soit contre la norme du W3C - le XML et le XHTML distinguent strictement ces caractères. Tandis qu'une faute de frappe du genre <Table...> au lieu de <TABLE...> est tolérée par la plupart des navigateurs HTML, le XHTML la considérerait comme instruction "fautive" qui, par conséquent, serait carrément "sautée" par ses browsers.

	que le code XHTML contient l'instruction <?xml...?>.
Cette instruction communique au navigateur qu'il a affaire à un document de la famille XML. Pour le moment, elle n'est pas encore reconnue par les navigateurs, mais son emploi est déjà recommandé par le W3C.

	que, dans le code XHTML, l'élément <!DOCTYPE... > est la seule ligne qui contient du code rédigé en majuscules.
Cet élément identifie le document comme page rédigée dans un langage faisant partie de la "famille" XML. Il fait partie des normes fixées par le W3C dans une sorte de "papiers de base", les DTDs (document type definition). La partie <...//EN"...> indique que la "définition du type de document" (DTD) employée par notre code est rédigée en anglais.   Le contenu d'une DTD peut être comparé aux normes définies par le W3C dans ses différentes versions du HTML, par exemple le HTML 4.01, la dernière version qui a été appliquée - avec la différence qu'il n'y a qu'un seul HTML 4.01, tandis que chaque document XML - ou, dans notre cas, XHTML - peut disposer de sa propre DTD. Plus tard, nous apprendrons à rédiger nos propres DTDs "individuelles".

Car n'oublions pas que l'atout le plus fascinant du XML reste la possibilité de pouvoir créer ses propres marqueurs et, de cette façon, élargir les facultés du HTML. Pour que les marqueurs que nous créons soient reconnus, nous les plaçons dans la DTD qui "gouverne" notre page.

Note : Une DTD comporte tous les éléments de syntaxe qui peuvent être employés dans le code du document - c'est-à-dire qu'elle décide, de quels marqueurs, attributs etc. nous avons le droit de nous servir et de quelle manière ils doivent être interprétés par les navigateurs. Nous disposons de DTDs prédéfinies, mais nous pouvons aussi les rédiger nous-mêmes.

	que la balise <html> de notre code XHTML dispose de trois attributs inconnus par le langage HTML :
xmlns dont nous aurons besoin au moment où nous créerons nos propres marqueurs. L'attribut sera traité dans le cadre du chapitre XML de cette formation du XHTML.   xml:lang="en" avertit le navigateur que la page doit été traitée en tant que document XML. La valeur "en" indique que les balises sur cette page sont rédigées en langue anglaise. - Actuellement, cet attribut ne dispose encore que d'une seule valeur, c'est-à-dire de "en". Mais à l'avenir, nous pourrons compter sur la possibilité d'écrire nos marqueurs aussi dans d'autres langues, par exemple en français.   lang="en" fournit au navigateur l'information que les balises sont rédigées en langue anglaise sans, pour autant, lui indiquer s'il est confronté à une page en HTML, XML ou autre.

Attention : Si, au cours de ce processus, il trouve un seul caractère qui ne correspond pas aux normes ou si, pire, l'auteur de la page avait oublié d'introduire l'appel de l'URL dans son code, l'affichage correct est loin d'être garanti.

Les DTDs prédéfinies

La version 1.0 du XHTML, fixée en forme de plusieurs DTDs prédéfinies, peut être considérée comme une sorte de "transformation" du HTML 4 en document XML/XHTML. Ce système de "transformation" nous permet d'utiliser les balises et attributs dont nous nous servons déjà depuis le début de notre formation. Mais il nous épargne surtout la tâche de rédiger nous-mêmes nos DTDs - c'est-à-dire de définir chaque marqueur que nous employons dans une page. Ainsi, la technique des DTDs nous offre la possibilité bien appréciable de créer nos propres éléments. Toutefois, grâce aux documents prédéfinis, nous ne sommes pas obligés de nous consacrer à cette tâche sans raison majeure.

La nouvelle version XHTML 1.1

Pourtant, malgré toutes ses vertus, la nouvelle version a aussi un désavantage - bien que ,par un programmeur habile, il puisse être transformé en avantage. C'est qu'elle empêche l'emploi d'un bon nombre de facultés qui, jusqu'à lors, nous ont été proposées par nos navigateurs. Mais en exploitant la possibilité d'établir des documents personnalisés - c'est-à-dire d'écrire nos propres DTDs - nos chances de créer une page intéressante sont finalement plus grandes qu'auparavant.

Le code XHTML : ce qui le distingue du HTML

(7) À certaines balises, le XHTML a attribué des règles spéciales assez strictes :
	Deux couples <a>...</a> ne doivent jamais être imbriqués
	Deux couples <form>...</form> ne doivent jamais être imbriqués
	Deux couples <label>...</label> ne doivent jamais être imbriqués
	Il est interdit de placer les balises <button>, <fieldset>, <form>, <iframe>, <input>, <isindex>, <label>, <select> ou <textarea> entre les marqueurs <button> et </button>
	Il est interdit de placer les balises <big>, <img />, <object>, <small>, <sub> ou <sup> entre les marqueurs <pre> et </pre>