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

Soyez le premier à laisser un commentaire !

Laissez un commentaire