Module 01 · Les fondamentaux

I. Découvrir le HTML

HTML donne une structure et un sens au contenu d’une page web. Dans cette première leçon, tu vas découvrir comment construire ton premier document.

Continuer : HTML avancé Retour à l’accueil

La structure d’un document HTML

Un document HTML contient des éléments qui indiquent au navigateur comment organiser le contenu.

<html> : contient toute la page.
<head> : contient les informations destinées au navigateur.
<body> : contient les éléments visibles de la page.

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ma première page</title>
    <link rel="stylesheet" href="Style.css">
</head>
<body>
    <h1>Bonjour</h1>
</body>
</html>

À retenir :

<head> contient les métadonnées ; <body> contient le contenu affiché.

Les balises les plus courantes

Les balises délimitent les éléments et décrivent leur rôle.

<h1> à <h6>

Les titres, du plus important au moins important.

<p>

Un paragraphe de texte.

<a>

Un lien vers une autre page ou un autre endroit.

<img>

Une image, avec une description dans alt.

<ul> et <ol>

Des listes non ordonnées ou numérotées.

<li>

Un élément de liste.

<strong>

Un contenu important.

<div>

Un conteneur générique pour regrouper du contenu.

<h2>Mon titre</h2>
<p>Voici un paragraphe.</p>
<a href="https://example.com">Visiter le site</a>

Les attributs

Les attributs ajoutent des informations à une balise. Ils s’écrivent dans la balise ouvrante, sous la forme nom="valeur".

id : identifiant unique d’un élément.
class : classe utilisable pour appliquer des styles à plusieurs éléments.
href : destination d’un lien.
src : chemin vers une image ou une ressource.
alt : description textuelle d’une image.

<p class="introduction" id="bienvenue">
    Bonjour et bienvenue !
</p>