Formation HTML

Leçon 1 • Configuration de votre environnement de développement

Guide l'installation d'un éditeur de code et des outils de développement du navigateur. Les apprenants repartent avec une configuration locale prête pour la programmation pratique.

Leçon 2 • Comment fonctionne le Web

Couvre la communication client-serveur, les navigateurs et les bases du HTTP. Fournit le contexte expliquant pourquoi la structure HTML est importante dans la livraison web.

Leçon 3 • Ce qu'est le HTML et ce qu'il fait

Définit le HTML comme un langage de balisage et explique sa relation avec le CSS et le JavaScript. Ancre les apprenants dans la responsabilité spécifique du HTML : la structure du contenu.

Leçon 1 • En-têtes, paragraphes et éléments de texte

Couvre h1–h6, p, br, hr, strong, em et les éléments en ligne associés. Les apprenants structurent un contenu textuel lisible avec des choix sémantiques corrects.

Leçon 2 • Balises, éléments et attributs

Explique les balises ouvrantes et fermantes, les éléments auto-fermants et la syntaxe des attributs. Construit le modèle mental que les apprenants appliquent à chaque élément tout au long du cours.

Leçon 3 • Listes : ordonnées, non ordonnées et de description

Enseigne les éléments ul, ol, li, dl, dt et dd avec un imbrication correcte. Les apprenants choisissent le type de liste approprié en fonction du sens du contenu.

Leçon 1 • Balises Meta essentielles

Couvre les balises meta charset, viewport, description et author. Les apprenants configurent les métadonnées minimales requises pour chaque page qu'ils publient.

Leçon 2 • Métadonnées Open Graph et sociales

Introduit les balises meta Open Graph et Twitter Card pour des aperçus sociaux enrichis. Les apprenants configurent les métadonnées qui contrôlent l'apparence des pages lorsqu'elles sont partagées.

Leçon 3 • Liaison des ressources externes

Enseigne l'élément link pour les feuilles de style, les icônes et le préchargement des ressources. Les apprenants connectent correctement les fichiers CSS et les favicons en utilisant rel et href.

Leçon 1 • Intégration d'images

Enseigne l'élément img, les attributs src, alt, width et height. Les apprenants intègrent des images accessibles avec des chemins corrects et un texte alternatif significatif.

Leçon 2 • Figures et légendes

Introduit figure et figcaption pour regrouper sémantiquement les images avec un texte descriptif. Renforce les principes HTML sémantiques introduits au chapitre 2.

Leçon 3 • Hyperliens avec l'élément Ancre

Couvre l'élément a, les attributs href, target et rel pour les liens internes et externes. Les apprenants mettent en œuvre la navigation entre les pages et vers des sites externes.

Leçon 1 • Tableaux accessibles et sémantiques

Applique les rôles ARIA et les modèles de résumé pour améliorer l'accessibilité des tableaux. Renforce le principe selon lequel la structure HTML communique le sens à tous les utilisateurs.

Leçon 2 • Fusion de lignes et de colonnes

Enseigne les attributs colspan et rowspan pour les dispositions de données complexes. Les apprenants fusionnent des cellules sans casser la structure du tableau ou l'accessibilité.

Leçon 3 • Structure de base d'un tableau

Introduit les éléments table, tr, td et th pour créer des lignes et des colonnes. Les apprenants construisent un tableau de données simple à partir de zéro.

Leçon 1 • Types d'entrée et contrôles de texte

Enseigne les types d'entrée text, email, password, number, date et autres. Les apprenants sélectionnent le type correct pour déclencher les claviers et la validation appropriés.

Leçon 2 • Contrôles de sélection : cases à cocher, boutons radio et listes déroulantes

Couvre les éléments checkbox, radio, select, option et optgroup. Les apprenants mettent en œuvre des choix groupés avec des attributs name et value corrects.

Leçon 3 • Étiquettes, ensembles de champs et formulaires accessibles

Enseigne les éléments label, fieldset et legend pour associer les contrôles aux descriptions. Les apprenants construisent des formulaires entièrement opérationnels au clavier et par lecteur d'écran.

Leçon 4 • Validation de formulaire HTML5

Couvre les attributs required, pattern, min, max et minlength pour la validation côté client. Les apprenants réduisent les soumissions invalides sans écrire de JavaScript.

Leçon 1 • Éléments de repère au niveau de la page

Couvre les éléments header, nav, main, aside, footer et section ainsi que leur utilisation correcte. Les apprenants cartographient une mise en page de page complète dans les régions de repère appropriées.

Leçon 2 • Pourquoi la sémantique est importante

Explique comment les éléments sémantiques communiquent le sens aux navigateurs, aux moteurs de recherche et aux technologies d'assistance. Motive le passage d'un balisage lourd en div à un balisage sémantique.

Leçon 3 • Éléments sémantiques en ligne

Enseigne time, mark, abbr, cite, code, kbd et samp pour un sens précis en ligne. Les apprenants annotent le contenu avec des éléments qui transmettent une intention sémantique spécifique.

Leçon 4 • Article, section et regroupement de contenu

Distingue article, section et div pour le regroupement de contenu connexe. Les apprenants appliquent l'élément correct selon que le contenu est autonome ou thématique.

Leçon 1 • Accessibilité au clavier et gestion du focus

Enseigne tabindex, l'ordre du focus et les liens de navigation pour sauter des sections. Les apprenants vérifient que tous les éléments interactifs sont accessibles et utilisables sans souris.

Leçon 2 • Fondamentaux de l'accessibilité Web

Introduit les principes WCAG : perceptible, utilisable, compréhensible et robuste. Les apprenants identifient les décisions HTML qui affectent directement chaque principe d'accessibilité.

Leçon 3 • Validation HTML et correction d'erreurs

Utilise le validateur W3C et les outils de développement du navigateur pour trouver et corriger les erreurs de balisage. Les apprenants développent une habitude de validation qui prévient les problèmes de rendu entre navigateurs.

Leçon 4 • Normes de codage HTML et maintenabilité

Établit des règles de formatage, des conventions de nommage et des pratiques de commentaire cohérentes. Les apprenants écrivent du HTML que leurs coéquipiers peuvent lire, maintenir et étendre en toute confiance.