HTML Introduction
HTML signifie HyperText Markup Language. C'est un langage de balisage utilisé pour créer des pages web et des applications pouvant être affichées sur Internet. Développé dans les années 1990, il combine l'hypertexte (qui définit les liens entre les pages web) et le balisage (qui définit la structure du contenu).
Les balises HTML sont utilisées pour définir les éléments HTML. Un élément HTML se compose généralement d'une balise de début et d'une balise de fin, avec le contenu inséré entre les deux. Les balises HTML servent à créer des documents HTML et à afficher leur contenu dans les navigateurs web. Parmi les balises HTML de base, on trouve <html>, <head>, <title>, <body>, <h1> à <h6>, <p>, <br>, <hr>, <ul>, <ol>, <li>, <a>, <img>, et bien d'autres.
Versions de HTML
Le HTML a été développé pour la première fois en 1990 par le physicien britannique Tim Berners-Lee. Depuis lors, de nombreuses versions du HTML ont vu le jour.
| Version | Année |
|---|---|
| HTML | 1991 |
| HTML+ | 1993 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML 1.0 | 2000 |
| HTML5 | 2012 |
Concepts de base du HTML
éléments, balises et attributs sont des concepts de base du HTML.
L'élément HTML est l'unité structurelle principale d'une page web. Les balises HTML sont utilisées pour définir les éléments HTML, et les attributs fournissent des informations supplémentaires sur ces éléments.
Balises HTML
Les balises HTML servent à structurer le contenu d'un site web (texte, hyperliens, images, médias, etc.). Les balises ne s'affichent pas dans les navigateurs ; elles se contentent d'« indiquer » aux navigateurs comment afficher le contenu de la page web.
Il existe plus de 100 balises en HTML, que vous pouvez retrouver dans notre tutoriel HTML.
Les balises HTML sont écrites entre crochets angulaires (par exemple <html>).
La plupart des balises HTML sont utilisées par paires, comme les balises <p> </p>. La première balise d'une paire est appelée balise de début (ou ouvrante), et la seconde est la balise de fin (ou fermante). Les informations sont écrites entre les balises ouvrante et fermante.
Cependant, il existe des balises sans paire, ou balises vides, qui n'ont qu'une balise ouvrante (par exemple, <img>).
Prenons un exemple.
Si vous devez définir un paragraphe (qui est un élément), vous devez utiliser la balise <p>. Le contenu du paragraphe doit être écrit entre les balises ouvrante (<p>) et fermante (</p>).
Exemple
Ceci est un paragraphe entre les balises ouvrante <p> et fermante </p>.
Attributs HTML
Les attributs HTML sont ajoutés à un élément HTML pour fournir des informations supplémentaires à son sujet. Par exemple, si vous définissez une image avec la balise <img>, vous pouvez utiliser les attributs src, height et width pour fournir respectivement des informations sur sa source, sa hauteur et sa largeur.
Structure d'un document HTML
La déclaration <!DOCTYPE html> spécifie la version du HTML utilisée dans le document. Chaque document HTML doit commencer par cette déclaration afin que les navigateurs puissent afficher la page conformément aux normes HTML.
Il existe plusieurs types de <!DOCTYPE> définis pour chaque version du HTML.
Tout le contenu de la page web est écrit entre les balises <html> </html>. L'élément <html> sert à informer les navigateurs qu'il s'agit d'un document HTML.
L'élément <head> contient des métadonnées (données sur le document HTML), l'encodage des caractères, le titre du document, les styles, etc. Ces données ne sont pas affichées aux visiteurs.
L'élément <title> affiche le titre du site web dans l'onglet du navigateur lors du chargement de la page. Le titre est écrit entre les balises <title> </title>.
L'élément <body> contient le contenu de la page web (texte, images, vidéos, etc.). Le contenu est écrit entre les balises <body> et </body>.
Les éléments de titre contiennent différents types d'en-têtes. Il existe six niveaux de titre - <h1>-<h6>, où <h1> est la balise la plus importante et <h6> la moins importante.
L'élément <p> contient des paragraphes de texte. Le contenu est écrit entre les balises <p> et </p>.
Exemple
Introduction au HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title of the document</title>
</head>
<body>
<h1>The most important heading.</h1>
<p>The first paragraph.</p>
<h2>Subheading</h2>
</body>
</html>Résultat
Pour commencer à écrire du code HTML pour votre site web, vous aurez besoin d'un éditeur. Nous parlerons des éditeurs HTML dans notre prochain chapitre.
Pratique
Qu'est-ce que le HTML et à quoi sert-il selon la page web donnée ?