HTML (HyperText Markup Language) est le langage de balisage standard pour créer des pages web. Il structure le contenu sémantiquement pour que les navigateurs l'affichent de façon cohérente sur tous appareils.

Concepts fondamentaux

Balisage, pas programmation

HTML décrit la structure, pas la logique. Pas de variables, boucles, fonctions. Il utilise des éléments (balises) pour étiqueter types de contenu : titres, paragraphes, liens, images, listes, tableaux, formulaires, sections.

Anatomie d'un élément

<nom_balise attribut="valeur">Contenu</nom_balise>

• Balise ouvrante : `

  `

• Attributs : `class="intro" id="first" lang="fr"`
• Contenu : Texte, éléments imbriqués, ou vide
• Balise fermante : `
  ` (éléments vides comme ``, `
  `, `` s'auto-ferment : ``)

Structure document essentielle

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Titre Page</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header><h1>Titre Site</h1></header>
<main>
<article>
<h2>Titre Article</h2>
<p>Texte paragraphe.</p>
</article>
</main>
<footer>© 2024</footer>
</body>
</html>

Catégories d'éléments clés

Structure sémantique (HTML5)

• <header>, <footer>, <main>, <section>, <article>, <aside>, <nav> – structure significative pour accessibilité/SEO

Contenu textuel

• Titres : `

  `–`

  ` (hiérarchie importante)

• Paragraphes : `

  `

• Accentuation : `` (gras/sémantique), `` (italique/sémantique)
• Listes : `
  `/`
  `/`
  1. `, `

     `/`

     `/`

     `

  2. Citations : `

     `, ``, ``

  Médias & Intégrations

  • Images : `` (alt obligatoire)
  • Vidéo : `
  • Audio : `
  • Iframe : `