1. Pourquoi l'accessibilité ?
Comprendre l’importance de l’accessibilité web et ses bénéfices pour tous les utilisateurs.
HTML Sémantique et Accessibilité
Dans cette partie, nous allons couvrir :
- Pourquoi l’accessibilité est importante - Les principes fondamentaux de l’accessibilité web
- Les balises HTML5 sémantiques -
<header>,<nav>,<main>,<article>,<section>,<aside>,<footer> - La hiérarchie des titres - Comment structurer vos contenus avec h1-h6
- Les médias accessibles - Images, vidéos, audio et leurs alternatives
- Exercices pratiques - Mise en pratique de tous les concepts
- Checklist de validation - Pour vous assurer que tout est correct
Parcours du cours
Section titled “Parcours du cours”2. Éléments sémantiques
Découvrir les balises HTML5 sémantiques et leur utilisation correcte.
3. Hiérarchie des titres
Apprendre à structurer vos contenus avec une hiérarchie de titres logique.
4. Médias accessibles
Intégrer des images, vidéos et audio de manière accessible.
5. Exercices
Mettre en pratique tous les concepts appris avec des exemples interactifs.
6. Checklist & Ressources
Valider vos connaissances et découvrir des ressources complémentaires.
Objectifs d’apprentissage
Section titled “Objectifs d’apprentissage”À la fin de ce cours, vous serez capable de :
- ✅ Comprendre pourquoi l’accessibilité web est essentielle
- ✅ Utiliser correctement les balises HTML5 sémantiques
- ✅ Créer une hiérarchie de titres cohérente
- ✅ Rendre vos images et médias accessibles
- ✅ Valider la structure HTML de vos pages
Fil rouge : Votre site d’histoires
Section titled “Fil rouge : Votre site d’histoires”Tout au long de ce cours, vous allez appliquer ces concepts à votre projet de site d’histoires pour l’une des trois tranches d’âge :
- 6-8 ans
- 8-12 ans
- Adolescents
Livrables attendus
Section titled “Livrables attendus”À la fin de ce cours, vous devrez avoir :
- Une page d’accueil avec header, nav, main, footer
- 2-3 pages de contenu (chapitres, personnages, etc.)
- Une navigation cohérente entre toutes les pages
- Une hiérarchie de titres correcte sur chaque page
- Des images avec textes alternatifs appropriés
- Au moins une figure avec légende
- Un HTML valide (testé avec W3C Validator)