Ouvrir le dico. Un site web pédagogique que tout le monde peut utiliser.
Le CCDMD voulait remettre en ligne Ouvrir le dictionnaire, une ressource de 2012 devenue impraticable. DevActif a bâti le site web au complet en Laravel : cinq sections, dix-neuf modules et 83 activités interactives. Chacune d'elles se termine au clavier seul, et s'écoute au lecteur d'écran — conformité WCAG 2.1 AA sans exception, y compris sur les exercices de glisser-déposer.
Une ressource de 2012 à reconstruire, pas seulement à rafraîchir.
Ouvrir le dictionnaireétait en ligne depuis 2012. La matière pédagogique tenait toujours la route ; la technologie qui la portait, non. Le CCDMD a confié à DevActif la programmation web et l'intégration des contenus de la nouvelle édition, rebaptisée Ouvrir le dico.
Le contenu révisé et la direction visuelle venaient du client. Notre part : transformer ça en un site web qui fonctionne sur n'importe quel appareil, qui se gère dans le temps, et qui respecte le standard d'accessibilité auquel un organisme public québécois est tenu.
sections
du fonctionnement d'un dictionnaire à la recherche d'information dans un ouvrage réel
modules
chacun avec sa consigne, sa progression et sa rétroaction
activités interactives
choix multiples, mots à repérer dans un article, mots à classer
Cinq sections, et jamais deux fois le même exercice.
Le site guide l'étudiant du fonctionnement général d'un dictionnaire jusqu'à la recherche d'information dans un ouvrage qu'il a devant lui. Chaque module a sa propre mécanique d'exercice, sa rétroaction et son explication — ce qui veut dire autant de comportements distincts à développer, à rendre accessibles et à valider.
Connaissez-vous vraiment les dictionnaires ?
Mythes et réalités, particularités, choix d'un ouvrage, repérage dans un dictionnaire papier.
L'article de dictionnaire
Décortiquer un article réel, partie par partie, puis se tester dessus.
Résoudre des problèmes
Orthographe, sens, genre, conjugaison, accords, prépositions — six modules de dépannage en rédaction.
Enrichir son vocabulaire
Synonymes, antonymes et cooccurrences pour trouver le mot juste.
À vos dicos !
Cinq modules de recherche guidée dans Le Petit Robert, le Multidictionnaire, Usito, Antidote ou l'ouvrage de son choix.
WCAG 2.1 AA sur la totalité du site, exercices compris.
Le CCDMD développe ses contenus web selon le standard SGQRI 008 du gouvernement du Québec, qui s'appuie sur les règles WCAG 2.1 de niveau A et AA, et valide ses sites avec NVDA sur Chrome et VoiceOver sur Safari. Cette exigence-là, tout le monde peut la cocher sur une page de contenu. Sur 83 exercices interactifs tous différents, c'est un autre métier.
Tout se fait au clavier
Aucune des 83 activités n'exige la souris. On tabule jusqu'à la réponse, on valide avec Entrée, et le contour de focus reste visible partout — contour épais doublé d'un halo blanc, lisible sur les cinq fonds de couleur du site.
La rétroaction est annoncée
Bonne ou mauvaise réponse, fin d'activité, explication : chaque changement passe par une région aria-live. Le lecteur d'écran annonce le résultat au moment où il arrive, sans que l'utilisateur ait à partir à sa recherche dans la page.
Le glisser-déposer aussi
L'exercice de classement alphabétique se fait à la souris — ou au clavier. Chaque mot est un bouton, chaque destination s'annonce « Case 3 de 7 ». C'est le genre d'exercice qu'on met normalement de côté en accessibilité. Ici, non.
On sait toujours où on est
Deux liens d'évitement — vers le contenu principal, puis directement vers la consigne de l'exercice. La pagination s'annonce « Activité 1, activité en cours », « Activité suivante ». Les titres sont hiérarchisés, la langue déclarée, et aucune image n'est sans alternative textuelle.
« Gageure » et « gageüre » se prononcent pareil. Alors on les épelle.
Cet exercice demande de choisir la bonne orthographe d'un mot. À l'écran, les deux choix se distinguent d'un coup d'œil. Lus à voix haute par un lecteur d'écran, ils sont rigoureusement identiques — l'exercice devient impossible.
Chaque bouton porte donc son épellation : « GAGEURE, épellation G-A-G-E-U-R-E, choix 1 sur 3 » et « GAGEÜRE, épellation G-A-G-E-U tréma-R-E, choix 2 sur 3 ». Aucun validateur automatique ne signale ce problème. Il faut avoir écouté la page pour le voir.
Un site que le CCDMD peut faire vivre sans nous.
La ressource précédente avait tenu onze ans avant de devenir inutilisable. Celle-ci est bâtie pour être modifiable : le contenu est en base de données, la logique d'exercice est factorisée par type plutôt que recopiée module par module, et rien ne dépend d'une technologie propriétaire.
Laravel pour le contenu
Sections, modules, activités et corrigés vivent en base de données plutôt qu'en pages figées. Ajouter une activité ne demande pas de redéployer le site.
Livewire pour les exercices
La correction reste côté serveur : les réponses ne se lisent pas dans le code source de la page, et l'interactivité n'oblige pas à reconstruire une application front complète.
Rendu serveur, pas de greffon
Chaque activité a sa propre URL et arrive en HTML. C'est ce qui la rend indexable, partageable en classe — et lisible par une technologie d'assistance.
Construisons quelque chosede concret.
Développeurs chevronnés, assistés par l'IA : on livre plus vite, sans sacrifier la qualité. Dites-nous ce que vous voulez construire. On vous dira à quelle vitesse on peut le livrer.