Séance 1

Objectifs

  • Comprendre les bases du fonctionnement du Web.

  • Différencier les différents langages de balisage.

  • Être capable de créer un dépôt et publier une première page en ligne.

MéthodeArborescence

Arborescence

Méthodeindex.html

1
<!DOCTYPE html>
2
<html lang="fr">
3
4
<head>
5
    <meta charset="UTF-8">
6
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
    <title>Mon Site</title>
8
</head>
9
10
<body>
11
    <!-- contenu de ma page -->
12
    <header>
13
        <h1>Bienvenue sur mon portfolio</h1>
14
    </header>
15
    <main>
16
        <p>Ceci est ma première page en HTML.</p>
17
    </main>
18
    <footer>
19
        <p>&copy; 2025 Mon Portfolio</p>
20
    </footer>
21
</body>
22
23
</html>
Cette première page contient les balises de base qu’on retrouve presque toujours :
  • <!DOCTYPE html> → version HTML5.
  • <html> → englobe toute la page.
  • <head> → infos techniques (titre, encodage, responsive).
  • <body> → contenu affiché.
    • <header> → en-tête.
    • <main> → contenu principal.
    • <footer> → pied de page.
C’est la structure minimale d’un site web moderne.
Exemple
Cliquez sur Run Pen

  See the Pen 
  Séance 1 by Vincent-Vanneste (@vincent-vanneste)
  on CodePen.




Séance 1