Passer au XHTML
Noter ce cours : 
Le XHTML commence à être de plus en plus utilisé par les concepteurs de sites qui se rendent compte des avantages de ce principe de conception de pages Web. Vous avez créé vous aussi un site qui n'est pas conçu en XHTML et souhaiteriez franchir le cap ?
Deux possibilités s'offrent à vous :
- Votre site a été codé correctement en HTML, et, dans ce cas, le passage au XHTML ne sera qu'une formalité.
- Votre site a été mal codé (par un éditeur WYSIWYG comme FrontPage par exemple) et dans ce cas, il se peut que le passage au XHTML nécessite de tout refaire.
La plupart des sites conçus il y a longtemps nécessitent un recodage complet. Le passage au XHTML procure de nombreux avantages. Pour ceux qui n'hésitent plus à franchir le cap, voici les quelques règles de base qui vous feront passer au XHTML strict sans grandes encombres.
- Fermer correctement les balises :
Afin d'être correctement interprété (et aussi pour respecter la syntaxe du XHTML), il convient de fermer correctement et dans l'ordre toutes les balises ouvertes. Voici plusieurs exemples :- Syntaxe invalide :
<p>Ceci est un paragraphe. - Syntaxe valide :
<p>Ceci est un paragraphe.</p>
- Syntaxe invalide :
<p><em>Ceci est un paragraphe.</p></em> - Syntaxe valide :
<p><em>Ceci est un paragraphe.</em></p>
- Le saut de ligne : <br />
- Les images : <img src="image.jpg" alt="" />
- Les champs de formulaire de type input : <input type="text" />
- Les balises meta : <meta name="description" content="description ici" />
- Syntaxe invalide :
- Respecter la casse :
Il était autrefois conseillé d'écrire ses balises HTML en majuscules pour "séparer" le code de la mise en forme. En XHTML, langage sensible à la casse, ceci n'est plus valable. Toutes les balises et le nom des attributs doivent être écrits en minuscules.- Syntaxe invalide :
<P>Ceci est un paragraphe.</P> - Syntaxe valide :
<p>Ceci est un paragraphe.</p>
- Syntaxe invalide :
- Les attributs :
Toutes les valeurs des attributs doivent être entourées de guillemets doubles.- Syntaxe invalide :
<p class=truc>Ceci est un paragraphe.</p> - Syntaxe valide :
<p class="truc">Ceci est un paragraphe.</p>
- Syntaxe invalide :
<input type="text" checked /> - Syntaxe valide :
<input type="text" checked="checked" />
- Syntaxe invalide :
- Les url et le javascript
Les URL contenant le caractère & doivent suivre une écriture correcte et être remplacés par leurs entités HTML :- Syntaxe invalide :
<a href="page.php?variable1=valeur&variable2=valeur"> - Syntaxe valide :
<a href="page.php?variable1=valeur&variable2=valeur">
- Syntaxe invalide :
<script language="javascript"> - Syntaxe valide :
<script type="text/javascript">
- Syntaxe invalide :
- Le doctype
Le doctype définit le type de votre document XHTML. Il est désormais obligatoire et doit être placé tout en haut de votre page XHTML. Le doctype à privilégier est celui de l'XHTML strict qui tolère moins les aléas de codage d'un site Web, et permet donc de coder plus rigoureusement. Il existe cependant trois doctypes :- Le doctype XHTML Strict, celui à utiliser de préférence (qui ne tolère plus les balises dépréciées en XHTML comme <u>, <i>...) :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> - Le doctype XHTML Transitional, qui tolère les balises dépréciées en XHTML comme <u>, <i>... :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> - Le doctype XHTML Frameset, qui permet l'utilisation des cadres :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
- Le doctype XHTML Strict, celui à utiliser de préférence (qui ne tolère plus les balises dépréciées en XHTML comme <u>, <i>...) :