Exercices HTML Fondamentaux
10 exercices progressifs pour maîtriser la structure HTML, les balises, les formulaires et la sémantique.
Structure de base
Tâche : Complétez la page avec : charset UTF-8, viewport, <title>, <meta name="description">, un <h1> et un <p>.
Balises texte sémantiques
Tâche : Balisez avec : <h1>, <h2>, <p>, <strong>, <em>, <abbr>, <blockquote>
Listes imbriquées
Tâche : Menu restaurant : <ol> avec Entrées/Plats/Desserts, sous chaque catégorie un <ul> avec 2-3 plats.
Navigation avec liens
Tâche : <nav> avec lien externe (target="_blank" + rel="noopener"), ancres internes, lien mailto: et tel:.
Images accessibles
Tâche : Image informative (alt descriptif), image décorative (alt=""), image dans <figure> + <figcaption>.
Tableau de données
Tâche : Tableau avec <caption>, <thead> (scope="col"), <tbody>, <tfoot> avec colspan.
Formulaire de contact
Tâche : Formulaire : nom (required), email (required), tel, select 4 options, textarea (maxlength 500), boutons submit/reset. Labels liés par for/id.
Formulaire d’inscription avancé
Tâche : fieldset/legend pour genre (radio), checkboxes langages, date (min/max), file (accept="image/*"), checkbox CGU.
Structure sémantique HTML5
Tâche : Remplacez les <div> par : header, nav, main, article, aside, footer.
Page de blog complète
Tâche finale : Page blog complète : header/nav/main/article/aside/footer, time datetime, figure, input type="search", address.