Complément des cours en présentiel © Éric NÊME

Les balises HTML

1 - Utilité du langage HTML

Voici une définition de ce langage extraite de Wikipédia :

Le HyperText Markup Language, généralement abrégé HTML ou, dans sa dernière version, HTML5, est le langage de balisage conçu pour écrire les pages web. Il s'agit d'un format ouvert très utilisé en informatique.
Comme son nom l'indique, HTML permet d’écrire de l’hypertexte. Il permet aussi de structurer sémantiquement le texte, de créer des formulaires de saisie, d’inclure des ressources multimédias, dont des images, des vidéos et des programmes informatiques. Il a été conçu pour créer des documents interopérables avec des équipements informatiques variés ; l’accessibilité du web est ainsi accrue en supportant des équipements destinés aux handicapés[1].
HTML est souvent utilisé conjointement avec le langage de programmation JavaScript et des feuilles de style en cascade (CSS). Il est inspiré du Standard Generalized Markup Language (SGML).

2 - Le HTML un langage de balisage

De manière générale, tout langage est composé d'une grammaire (en informatique on parle de syntaxe) et d'un lexique.

2.1 - La syntaxe

2.1.1 Balise ouvrante, balise fermante

Le HTML a une syntaxe très simple et un lexique assez pauvre comparativement à d'autres langages, ce qui en fait un des langages informatiques les plus simples à appréhender.

Il permet de baliser un contenu dans le but de donner une signification compréhensible par la machine à un contenu (texte, images, vidéo, son) qui n'a aucun sens pour elle.
Ainsi, baliser un contenu, consiste à indiquer où commence et où se termine quelque chose tout en indiquant ce qu'est cette chose.
Les indicateurs de ces marques de début et de fin, que l'on appelle balises s'écrivent sous cette forme :

Le nom d'une balise ne s'invente pas (ce qui est le cas dans un autre langage de balisage très utilisé le XML). Il faut le choisir parmi les noms définis par le langage (le lexique).
Par exemple : <h1>Recette de la tarte au chocolat</h1>.
Le texte Recette de la tarte au chocolat étant délimité par la balise ouvrante <h1> et la balise fermante </h1> sera compris par la machine comme étant le titre principal (cf. la documentation (MDN) concernant les headers).

2.1.2 Balise à la fois ouvrante et fermante

Certaines balises sont qualifiées de balises à la fois ouvrantes et fermantes et s'écrivent de la manière suivante : <nom de la balise /> (notez le slash avant le chevron fermant ">").
Ces balises ne délimitent rien, elles sont porteuses d'une signification propre.
C'est le cas de la balise <br /> qui correspond à un retour à la ligne (break line). Il serait insensé d'entourer un texte d'une balise ouvrante <br> et d'une balise fermante </br>, car cela signifierait que le texte est un retour à la ligne !…
Il existe d'autres balises de ce type, comme les balises <img />, <meta />, <hr />, etc.

2.1.3 Le couple attribut/valeur(s)

Un couple attribut/valeur(s) permet d'apporter un complément d'information à une balise donnée.
Dans la documentation officielle sont indiqués, pour chaque balise, les attributs que l'on peut utiliser et leur rôle.
Par exemple, pour indiquer qu'un texte est un lien on utilise la balise <a>.
On pourrait écrire : Site de l'<a>université lyon 3</a> pour faire en sorte que le texte "université lyon 3" permette d'afficher une des pages web du site de l'université en cliquant dessus.
Toutefois, il manque une information importante pour rendre effectif ce lien, car votre navigateur est à ce stade incapable de connaître l'adresse de redirection.
Pour donner cette information, on fait appel à l'attribut href complété par la valeur correspondant à l'URL de la page à afficher.
On écrit alors : <a href="http://www.univ-lyon3.fr">université lyon 3</a>

De manière générale, on retiendra d'un couple attribut/valeur(s) que :

2.2 - Le lexique

Toute page d'un site web doit donc utiliser ces balises HTML et leurs éventuels couples attribut/valeur(s) pour décrire un contenu trop riche en significations (textes, images, vidéos, sons, etc.) pour la machine. Plus ce contenu est balisé de manière précise, mieux la machine pourra le diffuser, le relayer, le référencer et le manipuler.
Par exemple, ces balises vont permettre d'indiquer à la machine les niveaux de titres, les paragraphes, les liens, les images, les vidéos, les sons, les tableaux, les formulaires et leurs éléments constitutifs, les mots importants, les emphases, les abréviations, le titre d'œuvres, les citations, les sections, les articles, l'en-tête, le pied de page, les informations annexes, le contenu principal, les métadonnées, etc.

Un rédacteur pour le web doit donc analyser chaque élément d'information qu'il diffuse et choisir les balises les plus adaptées pour caractériser le plus finement possible le contenu.
Pour cela, il doit toujours se référer à la documentation officielle (MDN) pour choisir les balises adéquates.

3 - L'évolution du HTML

L'évolution de ce langage consiste principalement à modifier le lexique : créer de nouvelles balises, redéfinir des balises existantes et rendre obsolètes des balises devenues inutiles. Ceci pour affiner encore la compréhension par la machine du contenu.
Du côté de la syntaxe, peu d'évolution est attendue.