Code source minimal d’une page XHTML 1.0

13 juillet 2009 | Catégorie: (X)HTML

Introduction

Il vous est peut-être déjà arrivé de vous retrouver dans le cas où, en voulant coder votre page XHTML, vous n'aviez pas le code minimal de base pour pouvoir commencer... J'ai rassemblé tout ce qui peut être utile pour bien démarrer sa page.

Le code source

<?xml version="1.0" encoding="utf-8"?>
<!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" lang="fr">
<head>
	<title>Document sans nom</title>
	
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta name="description" content="" />
	<meta name="keywords" content="" />
	<meta name="author" content="" />
	
	<link href="/favicon.ico" rel="icon" type="image/x-icon" />
	<link href="css.css" rel="stylesheet" media="screen" type="text/css" />
	<style type="text/css">
	<!--
		/* votre code CSS */
	-->
	</style>

	<script src="js.js" type="text/javascript"></script>
	<script type="text/javascript">
	<!--
		// votre code JavaScript
	//-->
	</script>
</head>
<body>
	<p>Votre contenu</p>
</body>
</html>

Le code ci-dessus peut se décomposer en plusieurs parties:

  1. Tout d'abord la balise XML, conseillée par le W3C lorsque vous codez en XHTML, cette ligne indique que vous écrivez selon la norme XML et que votre page doit être encodée en UTF-8, cette ligne change le type MIME de votre fichier en text/xml. Toutefois se présence provoque des bugs sur IE6.
  2. Ensuite, vient le doctype, là vous avez le choix entre : 
    <!-- XHTML 1.0 - Strict -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!-- XHTML 1.0 - Transitional -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!-- XHTML 1.0 - Frameset -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
  3. Le titre de la page
  4. Les deux premiers meta-tags sont recommandés par le W3C, toutesfois faites attention à ce que l'encodage de l'éditeur de texte corresponde à l'encodage indiqué dans le charset
  5. Ensuite j'ai rajouté des meta-tags utiles pour les moteurs de recherche, ils sont facultatifs
  6. La première balise <link> indique le chemin vers la favicon
  7. La seconde indique celui vers le fichier CSS
  8. vous pouvez aussi taper directement votre code entre les balises <script>
  9. Enfin la balise script, permet de joindre un fichier JavaScript (par exemple un framework js)...
  10. ... et/ou vous pouvez taper directement votre code entre les balises <script>
  11. Pour terminer, vous pouvez écrire votre structure xhtml entre les balises <body>

Ce code est valide : Validateur W3C

4 commentaires pour cet article

  1. Guy Arbus, le 7 novembre 2010 à 15h 15m

    Bonjour,

    Une info toujours très utile car il est très difficile de mémoriser un doctype particulier. Une fois qu’il est en place, ça va tout seul ensuite.

    A mettre en favoris pour une productivité augmentée, merci pour cet article !

    Amicalement,

    Guy.

  2. gilles, le 13 avril 2011 à 20h 18m

    Bonjour Lucas

    je suis tombé sur ton site en faisant une recherche parce que je m’étonne que des pages web commencent par une déclaration xml : «  »

    Je ne savais pas ça : « Tout d’abord la balise XML, conseillée par le W3C lorsque vous codez en XHTML »

    Je suis développeur web et je n’ai jamais fait ça. J’ai demandé à des collègues, qui ne connaissaient pas non plus.

    Comment as tu appris ça ? Sais-tu où je peux trouver une information là-dessus. Je n’y arrive pas avec mes recherches.

    Merci pour ta lecture et ta réponse
    ;)

  3. Lucas, le 9 septembre 2011 à 16h 31m

    Bonjour Gilles,

    Désolé pour le retard. Le site est un peu à l’abandon, j’attends de trouver un peu de temps pour le refaire sous Sf2.

    Pour le balise xml, j’ai trouvé l’info sur cette page http://www.w3.org/TR/xhtml1/

    « An XML declaration is not required in all XML documents; however XHTML document authors are strongly encouraged to use XML declarations in all their documents. Such a declaration is required when the character encoding of the document is other than the default UTF-8 or UTF-16 and no encoding was determined by a higher-level protocol… »

    Personnellement, je ne mets jamais cette ligne et j’essaie de plus en plus d’utiliser le framework HTML5 Boilerplate dans mes développements web.

    Merci pour ton commentaire.
    Lucas

  4. Gilles, le 9 septembre 2011 à 19h 59m

    Merci pour ce retour. Je n’utilise pas (encore) html5 boilerplate, mais je vais m’y pencher plus.

Laissez un commentaire