Aperçu de l'application
d'accessibilité numérique conforme aux standards WCAG 2.1 AA et RGAA 4.1.
Présentation du projet
Le LSF Generator est une application web développée sous la marque IntA11Y — Solutions,
dédiée à l'accessibilité numérique pour tous. Elle permet à n'importe quel utilisateur de
traduire un mot ou une phrase en français vers sa représentation en Langue des Signes Française,
via des vidéos ou illustrations.
La particularité du projet réside dans sa double ambition : rendre la LSF accessible,
et être elle-même une démonstration d'excellence en accessibilité numérique — avec
10 modes d'adaptation distincts intégrés directement dans la barre de navigation,
allant de la police dyslexique au mode daltonien.
Les données LSF sont fournies par deux dictionnaires de référence :
Elix LSF et SpreadTheSign.
- Traduction LSF — mot par mot ou phrase complète, rendu vidéo ou illustration
- Historique de recherche — persistance des requêtes précédentes, effacement global
- 10 modes d'accessibilité — police dyslexique, taille texte, daltonien, N&B, sombre, simplifié
- Navigation 100% clavier — compatibilité NVDA, JAWS, VoiceOver
- ARIA Live Regions — annonces dynamiques pour les lecteurs d'écran
- Double source de données — Elix LSF + SpreadTheSign, fallback automatique
- Déclaration d'accessibilité — modale dédiée RGAA 4.1, contact dédié access@inta11y.fr
Fonctionnalités d'accessibilité — détail
Sources de données LSF
| Source | Type | Couverture | Format |
|---|---|---|---|
| Elix LSF elix-lsf.fr |
Vidéos | Dictionnaire LSF de référence français, milliers de signes | API embed iframe video |
| SpreadTheSign sign-lang.uni-hamburg.de |
Vidéos | Base multilingue européenne, corpus Uni. Hamburg / DictaSign | API embed fallback |
L'application interroge les deux sources en séquence : si Elix LSF ne trouve pas de résultat pour un mot, SpreadTheSign est utilisé en fallback automatique. L'utilisateur n'a pas à choisir manuellement — la résolution est transparente.
Extraits de code
<!-- Barre d'accessibilité en navigation principale ──── --> <nav id="a11y-bar" aria-label="Options d'accessibilité"> <!-- Police pour dyslexie ── OpenDyslexic --> <button id="btn-dyslexie" aria-pressed="false" aria-label="Activer la police pour dyslexie"> Aa Dyslexie </button> <!-- Taille du texte --> <button id="btn-text-sm" aria-label="Réduire la taille du texte">A-</button> <button id="btn-text-reset" aria-label="Taille par défaut">A</button> <button id="btn-text-lg" aria-label="Augmenter la taille du texte">A+</button> <!-- Filtres visuels --> <button id="btn-daltonien" aria-pressed="false">◑ Daltonien</button> <button id="btn-nb" aria-pressed="false">⬛ N&B</button> <button id="btn-dark" aria-pressed="false">🌙 Sombre</button> <button id="btn-simplified" aria-pressed="false">📖 Simplifié</button> </nav> <!-- Zone live pour lecteurs d'écran ─────────────────── --> <div id="live-region" aria-live="polite" aria-atomic="true" class="sr-only"></div>
// ── Gestionnaire des modes a11y ────────── const a11yModes = { 'dyslexie': () => { document.body.classList .toggle('font-dyslexic'); }, 'daltonien': () => { document.body.classList .toggle('filter-deuteranopia'); }, 'dark': () => { document.body.classList .toggle('theme-dark'); } }; // Annonce ARIA lors du changement de mode function announceMode(modeName, active) { liveRegion.textContent = `Mode ${modeName} ${active ? 'activé' : 'désactivé'}`; }
// ── Résolution multi-source ────────────── async function fetchLSF(word) { // 1. Tentative Elix LSF const elix = await queryElix(word); if (elix?.found) return elix; // 2. Fallback SpreadTheSign const sts = await querySpreadTheSign(word); if (sts?.found) return sts; // 3. Aucun résultat → message utilisateur announceToSR(`Aucun signe trouvé pour : ${word}`); return null; } // ── Mode de génération ─────────────────── async function generate(text, mode) { const words = mode === 'word' ? text.split(' ') : [text]; return Promise.all(words.map(fetchLSF)); }
Architecture du projet
Stack technique & compatibilité
L'application est testée avec les principaux lecteurs d'écran du marché. Toutes les interactions dynamiques sont annoncées via des zones ARIA Live. Contrastes texte/fond vérifiés conformes aux exigences WCAG 2.1 niveau AA.
Points forts du projet
Rendre la Langue des Signes Française accessible à tous — entendants souhaitant communiquer, proches de personnes sourdes, professionnels de santé — via un outil simple et sans inscription.
L'application ne se contente pas de diffuser du contenu accessible : elle intègre 10 modes d'adaptation pour être utilisable par les personnes dyslexiques, malvoyantes, daltoniennes ou en situation de handicap cognitif.
Architecture de requête résiliente : Elix LSF en priorité, SpreadTheSign en fallback automatique. L'utilisateur obtient toujours un résultat ou un message clair, sans jamais voir une erreur technique brute.