XHTML
XHTML est un langage de balisage. C'est un langage informatique dont les commandes sont signalées par des chevrons : < >
Une page web est composées de différents éléments, du texte, des images, des sons, des vidéos, des animations... des tableaux, des liens etc.
Le langage XHTML sert donc à expliquer au navigateur ce que sont les informations envoyées, est-ce une adresse d'image, les dimensions d'affichage, un paragraphe, un titre...
XHTML et les balises
quelques exemples :
- <p></p> signifie au navigateur que tout le texte qui se trouve entre balise ouvrante et balise fermante constitue un paragraphe.
- <em></em> signifie au navigateur que tout le texte qui se trouve entre balise ouvrante et balise fermante doit être écrit avec emphase.
- <h1></h1> signifie au navigateur que tout le texte qui se trouve entre balise ouvrante et balise fermante constitue un titre de niveau 1.
- <table></table> signifie au navigateur que tout le texte qui se trouve entre balise ouvrante et balise fermante constitue un tableau.
Première question :
Comment fait-on pour écrire < et > en XHTML ? ➢ on utilise des entités on écrira < pour < et > pour > • un troisième caractère est réservé en XHTML : & il faudra donc écrire & • les choses se compliquent un peu lorsqu'on voudra écrire & comment empêcher le navigateur d'écrire & ? il suffit d'écrire &amp;
Première remarque :
Non seulement toute balise ouverte doit être fermée, mais elle doit aussi être fermée correctement :
➢ on écrit : <h1>mon titre</h1>
<p>mon paragraphe</p>
• on n'écrit surtout pas :
<h1>mon titre<p>mon paragraphe</h1></p>
Seconde remarque :
Une balise peut en contenir une ou des autres qui peuvent elle-mêmes… vous me suivez.
Mais cela doit avoir un sens !
➢ on écrit :<p>mon paragraphe avec un <em>gros</em> mot.</p>
• on n'écrit surtout pas :
<h1>mon titre<p>mon paragraphe</p></h1>
un paragraphe dans un titre cela n'a aucun sens.
Troisième et dernière remarque :
Un fichier XHTML, comme tout fichier XML, doit être entièrement compris dans une balise. ➢ ce fichier XML est bien formé : <balise><balise></balise></balise> • ce fichier XML n'est pas bien formé : <balise></balise><balise></balise>
C'est tout. Et si tout cela semble encore bien obscur, cela deviendra vite très clair après quelques exercices simples
gabarit XHTML
Voyons à présent à quoi ressemble un document XHTML très simple,
au premier coup d'œil cela peut sembler compliqué, nous allons voir à quel point les choses sont simples.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" /> <title>ma première page d'essai</title> <meta name="author" content="moi" /> <meta http-equiv="Content-Language" content="fr" /> <link rel="stylesheet" type="text/css" href="style.css" media="screen" /> </head> <body> <h1>Mon première titre</h1> <p>Mon premier paragraphe</p> <!-- attention les liens ci dessous ne fonctionnent pas pour une page locale --> cette page est valide : <a href="http://validator.w3.org/check/referer" title="Vérifier la validité de cette page">XHTML</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="Vérifier la validité de la feuille de styles"> CSS</a> </body> </html>
Le document entier est contenu dans une balise <html></html>
Il est ensuite divisé en deux parties :
l'en-tête <head></head> et
et le corps du document <body></body>.
La partie head (l'en-tête) contient des informations utiles au navigateur (ou à d'autres utilisateurs, les robots d'indexation…)
mais ne sera pas affichée .
La partie body (le corps) contient ce qui doit être affiché par le navigateur.
Pour construire tout un site internet, il suffit d'écrire un seul document de base qui sera ensuite copié pour créer toutes les pages, la déclaration XHTML ne changera pas, la partie Head variera peu (le titre et éventuellement d'autres informations complémentaires, comme la date de création, une description…), seule une partie de Body, le contenu, sera à éditer pour chaque page.
Pour de plus amples informations sur les balises HTML et Head se reporter à XHTML:structure.
Pour une liste complète des balises XHTML se reporter à XHTML:balises
Pour une liste complète des attributs XHTML se reporter à XHTML:attributs
Mais il est temps de passer à présent à la pratique : XHTML:ma première page.
