Technologie · Seconde

Idées d’apprentissage actif

Accessibilité du Web pour tous

Les élèves retiennent mieux les normes d'accessibilité web quand ils vivent concrètement les obstacles et solutions. L'approche active transforme des concepts abstraits comme les contrastes ou la navigation au clavier en expériences tangibles et mémorables.

• Programmes Officiels
• MEN: Lycee - Le Web
• MEN: Lycee - Impacts sociaux

• 20–45 min
• Binômes → Classe entière
• 4 activités

Activité 01

• Étude de cas
• 30 min · Individuel

Hands-on Modeling : Naviguer sans souris

Les élèves doivent accomplir des tâches courantes (remplir un formulaire, consulter un article, naviguer dans un menu) en utilisant uniquement le clavier. Ils notent les obstacles rencontrés et les sites qui facilitent ou compliquent cette navigation.

Pourquoi l'accessibilité du Web est-elle considérée comme un enjeu à la fois technique, social et éthique ?

Conseil de facilitation

Pendant la navigation sans souris, circulez pour observer les stratégies des élèves et notez les difficultés récurrentes à discuter ensuite en groupe.

À observer

Distribuez une fiche à chaque élève avec une capture d'écran d'un élément de site web (image, bouton, formulaire). Demandez-leur d'écrire une phrase expliquant comment rendre cet élément plus accessible et pourquoi c'est important.

• Analyser
• Évaluer
• Créer
• Prise de décision
• Autogestion

Activité 02

• Cercle de recherche
• 45 min · Petits groupes

Cercle de recherche: Audit d'accessibilité

Les groupes utilisent un outil en ligne (WAVE, Lighthouse) pour analyser l'accessibilité d'un site de leur choix. Ils classent les erreurs trouvées par gravité et proposent des corrections HTML et CSS concrètes.

Comment les normes d'accessibilité permettent-elles de rendre le Web utilisable par tous, indépendamment des handicaps ?

Conseil de facilitation

Pour l'audit d'accessibilité, fournissez une grille claire avec des critères mesurables et un exemple de site web à analyser pour guider leur travail.

À observer

Proposez aux élèves de débattre de la question : 'Dans quelle mesure la responsabilité de l'accessibilité web incombe-t-elle uniquement aux développeurs ?' Encouragez-les à citer des exemples concrets de collaboration ou de partage de responsabilités.

• Analyser
• Évaluer
• Créer
• Autogestion
• Conscience de soi

Activité 03

• Galerie marchande
• 40 min · Petits groupes

Galerie marchande: Avant/après accessibilité

Chaque groupe modifie une page web pour corriger ses problèmes d'accessibilité (ajout d'alt, correction des contrastes, balisage sémantique). Les versions avant et après sont affichées côte à côte pour comparaison.

Dans quelle mesure les développeurs sont-ils responsables de l'accessibilité des sites qu'ils créent ?

Conseil de facilitation

Lors de la Gallery Walk, demandez aux groupes d'afficher leurs solutions à côté de leurs captures d'écran pour faciliter les comparaisons et les échanges.

À observer

Présentez une courte liste de caractéristiques de sites web (ex: 'contraste des couleurs faible', 'navigation uniquement à la souris', 'vidéos sans sous-titres'). Demandez aux élèves d'indiquer pour chaque caractéristique si elle favorise ou entrave l'accessibilité, et de justifier brièvement leur réponse.

• Comprendre
• Appliquer
• Analyser
• Créer
• Compétences relationnelles
• Conscience sociale

Activité 04

• Penser-Partager-Présenter
• 20 min · Binômes

Penser-Partager-Présenter: Le Web est-il vraiment pour tous ?

Les élèves réfléchissent aux types de handicaps concernés par l'accessibilité web (visuel, auditif, moteur, cognitif). Ils partagent leurs idées sur la responsabilité des développeurs et les limites du cadre réglementaire actuel.

Pourquoi l'accessibilité du Web est-elle considérée comme un enjeu à la fois technique, social et éthique ?

Conseil de facilitation

Pendant le Think-Pair-Share, insistez sur l'écoute active en demandant à chaque binôme de reformuler l'argument de l'autre avant de partager en grand groupe.

À observer

Distribuez une fiche à chaque élève avec une capture d'écran d'un élément de site web (image, bouton, formulaire). Demandez-leur d'écrire une phrase expliquant comment rendre cet élément plus accessible et pourquoi c'est important.

• Comprendre
• Appliquer
• Analyser
• Conscience de soi
• Compétences relationnelles

Quelques notes pour enseigner cette unité

Commencez par une démonstration rapide avec un lecteur d'écran pour montrer l'impact immédiat d'une image sans texte alternatif. Évitez de présenter les WCAG comme une liste de cases à cocher : privilégiez des exemples concrets qui créent un besoin de compréhension. Les débats sur la responsabilité de l'accessibilité web gagnent en profondeur quand les élèves confrontent leurs idées à des cas réels plutôt qu'à des théories.

Les élèves montrent leur compréhension en identifiant des problèmes d'accessibilité sur des sites réels, en proposant des corrections pertinentes et en expliquant pourquoi ces ajustements profitent à tous les utilisateurs. Ils justifient leurs choix avec des références aux critères WCAG.

---

Attention à ces idées reçues

• During Hands-on Modeling : Naviguer sans souris, certains élèves pensent que l'accessibilité ne concerne que les personnes aveugles.

  Pendant cette activité, observez les élèves essayer de remplir un formulaire ou de cliquer sur un menu déroulant sans souris. Remarquez que ceux qui ont des difficultés motrices ou qui utilisent un ordinateur avec un trackpad limité rencontrent les mêmes obstacles. Utilisez ces observations pour élargir la discussion aux handicaps temporaires ou situationnels.

• During Collaborative Investigation : Audit d'accessibilité, des élèves croient que rendre un site accessible demande beaucoup plus de travail et coûte cher.

  Pendant l'audit, utilisez des outils gratuits comme WAVE ou Lighthouse pour montrer que les problèmes majeurs (images sans texte alt, contrastes insuffisants) sont identifiés en quelques clics. Montrez comment les bonnes pratiques s'intègrent naturellement dans le développement : par exemple, ajouter un texte alternatif en même temps que l'image, ou vérifier les contrastes dès la phase de design.

---

Méthodes utilisées dans ce dossier

• Étude de cas
• Cercle de recherche
• Galerie marchande
• Penser-Partager-Présenter