HTML est fondamentalement un langage très simple, dans lequel des balises (tag) définissent un élément et ses propriétés. En HTML, ces balises sont les signes inférieur et supérieur (comme dans <TITLE>).
Une balise définit unélément: un objet, texte ou autre, encadré par une balise d’ouverture et une balise de fermeture. Cette dernière est identique à la balise d’ouverture, à ceci près qu’une barre oblique (slash) est placée entre l e caractère inférieur et le nom de l’élément. Entre les deux balises est placé lecontenu:
<TITLE>Titre</TITLE>
Ici, l’élément est TITLE, la balise d’ouverture <TITLE>, le contenu Titreet la balise de fermeture </TITLE>.
Certains éléments peuvent exceptionnellement être présents dans un document sans balise :<HEAD> etHEAD sont tous les deux valides.
Les éléments dépourvus de contenu portent le nom d’éléments vides. Si cette absence de contenu est liée à la définition de l’élément, celui-ci est également dépourvu de balise de fermeture : un tel élément accomplit quelque chose, puis s’arrête, devenant superflu dans le code. Un saut de ligne(BR) est un tel élément vide : une fois le saut de ligne effectué, il n’y a plus rien à faire. Vous rencontrerez par la suite d’autres éléments vides.
XHTML
XHTML impose que tout élément possède une balise de fermeture. Il existe toutefois une notation particulière signalant en XTML un élément vide :
<br />
ou
<img src="image.jpg" alt="image" />
Cette construction est à préférer à<BR></BR>, autorisée par XML, mais qui provoque des résultats inattendus avec certains agents utilisateurs.
Un élément n’est pas une balise !
Certaines personnes font référence aux éléments comme à des balises (par exemple, « la balise P »). Souvenez-vous que l’élémentPest une chose et que la balise<P>en est une autre. Par exemple, l’élémentHEAD est toujours présent, même si les balises ouvrante<HEAD>et fermante
</HEAD> peuvent être absentes du document.
Les éléments se répartissent en deux catégories principales : les blocs et les lignes, qui équivalent réciproquement aux styles paragraphe et caractère d’un traitement de texte. Un élément de type bloc crée un nouveau bloc (texte ou graphique), générant le plus souvent un saut de ligne ou de paragraphe lors de son ouverture et/ou de sa fermeture. Le plus classique des éléments de type bloc est le paragraphe de texte, mais il en existe bien d’autres, comme vous le verrez.
En revanche, un élément ligne ne provoque pas de saut de ligne ou de paragraphe et n’affecte pas la totalité du bloc. C’est le cas des éléments modifiant la police, les couleurs, etc. Quelques très rares éléments peuvent être à la fois de type bloc et de type ligne.
Tout élément peut posséder des éléments enfants imbriqués. Il porte alors le nom d’élément parent :
<H1>Ceci est le titre <B>important</B></H1>
Ici, un élémentB (gras) est imbriqué dans l’élément parentH1 (en-tête de niveau 1). Le contenu de l’élément H1 est Ceci est le titre
<B>important</B>, celui de l’élément Best important.
Les éléments peuvent posséder des propriétés associées, appelées attributs, qui peuvent eux-mêmes posséder des valeurs (par défaut, ou encore définies par l’auteur ou par un script). Les couples attribut/valeur apparaissent avant le caractère > final de la balise ouvrante d’un élément. Un nombre quelconque de couples attribut/valeur (autorisés), séparés par des espaces, peuvent apparaître dans la balise ouvrante d’un élément. Ils peuvent survenir dans n’importe quel ordre :
<IMG src="image.gif">
Les attributs sont obligatoires pour certains éléments.
Sensibilité à la casse
Les éléments HTML et leurs attributs ne sont pas sensibles à la casse.
Si théoriquement vous n’avez donc pas à vous préoccuper de la bonne utilisation de majuscules et de minuscules dans vos balises, sauf pour les noms de fichiers, d’après la spécification, les noms de balise doivent toujours être écrits en majuscules et les attributs en minuscules.
En général, mieux vaut toujours placer la valeur d’un attribut entre guillemets, même si HTML tolère leur absence lorsqu’il s’agit d’une valeur numérique (contrairement à XTML). Cette valeur placée entre guillemets doit être considérée comme sensible à la casse. Cette sensibilité à la casse des valeurs d’attributs peut provenir du navigateur (exceptionnellement) ou du serveur (très fréquemment). Ainsi, une telle faute de casse peut passer inaperçue localement, mais être flagrante une fois le site publié.
XHTML
En revanche, XHTML est sensible à la casse : la spécification recommande d’écrire tous les noms d’éléments et d’attributs en minuscules. Pour XML, <li>et<LI>sont des balises différentes. Un soin particulier doit en outre être apporté au respect de la casse des valeurs des attributs.
Le Tableau 1.1 montre la structure d’un élément, illustrée de quelques exemples. Une balise HTML comporte toujours les signes<>.
Tableau 1.1 : Structure d’un élément HTML
Composant Description Exemple
< Balise ouvrante de la balise
d’ouverture <
ELEMENT Nom de l’élément A
Attribut Propriété de cet élément. Parfois obligatoire pour certains éléments.
href
Valeur Valeur de l’attribut, précédée d’un signe égal et normalement placée entre guillemets.
="http://www.
microapplication.fr"
> Balise fermante de la balise
d’ouverture >
Tableau 1.1 : Structure d’un élément HTML
Composant Description Exemple
Contenu Contenu de l’élément (pas pour tous les éléments).
MicroApplication
</ELEMENT> Balise de fermeture (parfois
facultative). </A>
Toute page HTML est composée, après la ligne de déclaration du DTD, d’un élément racine HTMLqui comprend deux éléments enfants :
j L’en-tête (HEAD) comprend des données non-affichées par le navigateur, servant à sa configuration ou présentes au bénéfice de l’auteur, du lecteur ou d’autres intervenants.
j Le corps (BODY) contient les données qui seront affichées, encadrées par des balises spécifiant leur structure.
Une page HTML se présente donc fondamentalement comme suit :
<!DOCTYPE ...>
Nous reviendrons bien sûr plus en détail par la suite sur cette structure.
1.5. Résumé
j HTML est un langage conçu par le CERN au début des années 1990. Fondé sur SGML (Standard Generalized Markup Language), il a connu plusieurs évolutions avant de parvenir à la spécification actuelle HTML 4.01.
j HTML sépare désormais efficacement la structure de la présentation. Les éléments et attributs de présentation HTML sont de plus en plus remplacés par d’autres mécanismes, en particulier les feuilles de style.
j XML (eXtensible Markup Language), CSS (Cascading Style Sheet) et DOM (Document Object Model) sont autant de technologies
apparentées désormais intégrées ou exploitées en tout ou partie à et par HTML.
j XHTML représente la future génération de HTML. La spécification actuelle est XHTML 1.0.
j HTML est un langage dans lequel desbalises (tag) définissent un élément et ses propriétés. En HTML, ces balises sont les signes inférieur et supérieur (<>). Une balise définit un élémentencadré par une balise d’ouverture et une balise de fermeture. Le contenu figure entre ces deux balises.
j Il existe deux catégories principales d’éléments : les blocs et les lignes. Un élément de type bloc crée un nouveau bloc, générant le plus souvent un saut de ligne ou de paragraphe lors de son ouverture et/ou de sa fermeture. En revanche, un élément ligne ne provoque pas de saut de ligne ou de paragraphe et n’affecte pas la totalité du bloc de texte.
j Les éléments peuvent posséder des propriétés associées, ou attributs, dotées de valeurs. Les couples attribut/valeur apparaissent avant le caractère > final de la balise ouvrante d’un élément. Les attributs sont obligatoires pour certains éléments.