Structure de base d'un header HTML

Un document HTML est séparé en deux grandes parties :
  • l'en-tête (démarqué par les balises <header> et </header>).
  • le corps de la page (entre les balises <body> et </body>).
Le corps de la page contient l'ensemble des éléments visibles de celle-ci. L'en-tête, au contraire, n'est pas visible via un navigateur et fournit un ensemble d'éléments informant sur le contenu général de la page.
On retrouve également dans l'en-tête le doctype (déclaration du type et de la version de HTML utilisé), ainsi que de possible déclaration de fichiers CSS associés. Il s'agit là d'informations structurelles étant utiles au traitement du code de la page.

La balise title

La première balise que l'on ajoute dans l'en-tête est la balise title. Elle fournit un titre à la page, visible sur le navigateur (en général dans la barre de titre), mais aussi utile aux moteurs de recherche pour nommer la page.
Sa structure est la suivante :
<title>Tite de la page</title>

Les balises meta

Les balises métas sont très utiles pour bien référencer son site. Elles sont cependant plus complexes à rédiger. En conséquence les générateurs de sites web fournissent souvent une interface de configuration simple pour celles-ci.
On retrouve également divers générateurs de balises méta (cf. § références).
Le W3C (cf. § références) fournit les recommandations suivantes pour les balises meta du HTML version 4.01 :
Les méta possèdent un premier attribut correspondant à l'un des suivants :
  • name : donne le nom de la méta information (Author, date...).
  • http-equiv : définit le mot clé HTTP associé au contenu de l'élément content associé.
  • sheme : définit le nom du shéma qui doit être utiliser pour lire le contenu de l'élément content associé.
A coté de cet attribut doit se trouver un attribut content définissant le contenu associé au type. Il est possible, dans les balises utilisant l'attribut name, d'ajouter un attribut lang, définissant la langue correspondant à l'élément On peut ainsi donner la langue de l'auteur.
Voici quelques exemples de balises méta définissant le contenu :
  • <meta name="Author" lang="fr" content="Pierre Dupond">
  • <meta name="keywords" lang="en-us" content="SEO, search motors, google, yahoo, altavista, meta tags">
  • <meta name="copyright" content="© 2006 Epita">
  • <meta name="date" content="2006-06-18T08:49:37+00:00">
Les balises méta permettent également d'informer sur l'encodage de la page, sa date d'expiration ou de création de celle-ci. Ces informations sont très utiles aux moteurs de recherche, car elles permettent de faciliter la lecture du code, mais assure également la validité du contenu de la page dans le temps.
Voici quelques exemples de ces balises :
  • <meta http-equiv="Expires" content="Thu, 13 Jun 2006 23:59:59 GMT">
  • <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15>

Références

Voici quelques sites utiles pour s'informer ou utiliser les balises métas :
  • W3C : consortium émettant des recommandations pour l'ensemble des technologies du web, telles que le HTML ou le XML.
  • Meta tags generator : il s'agit d'un des nombreux générateurs de balise meta disponiblre sur le web