La dernière version de Joomla 4 présente de nouvelles fonctionnalités, mais dans cet article, nous nous concentrerons essentiellement sur l'accessibilté : sur le contraste des couleurs, le plugin d'accessibilité intégré et autre élément présents pour améliorer l'accessibilité du cms.
Sommaire de l'article
Qu'est-ce que l'accessibilité web ?
L'accessibilité signifie que votre site web peut être consulté facilement par tout le monde, mais aussi par les personnes souffrant de handicap. L’accessibilité du web comprend tous les handicaps affectant l’accès au web, en particulier le handicap : auditif, cognitif, neurologique, physique, de la parole, visuel .... Le web offre la possibilité d’un accès sans précédent à l’information et l’interaction de beaucoup de personnes handicapées. C’est-à-dire que les barrières d’accessibilité de l’écrit, des média audio et visuels, peuvent être plus facilement surmontées grâce aux technologies web...
Source : w3.org
Un certains nombres de régles et directives existent pour rendre votre joomla 4.0 accessible.
Les directives WCAG
Les directives WCAG 2.0 et 2.1 sont des règles techniques établies par le W3C (le W3C est l'organisation qui crée les normes Web et des choses comme CSS3 et HTML5). WCAG 2.0 et WCAG 2.1 sont des standards techniques stables, referenceables. Ils contiennent 12-13 règles organisées selon 4 principes : perceptible, utilisable, compréhensible et robuste. Pour chaque règle, il y a des critères de succès à tester, qui sont sur trois niveaux : A, AA, et AAA.
Source : w3.org
Si votre site web suit ces règles alors il est considéré comme accessible. C'est pour cela que il est important dès le départ de choisir un CMS qui prend en charge l'accessibilité. C'est le cas de Joomla 4.0 et c'est une bonne chose !
Prise en charge de l'accessibilité
Cela signifie que votre site web est capable de fournir une assistance aux utilisateurs souffrant de handicap.
L'interface de joomla 4.0
L'interface utilisateur Joomla 4 est conçue conformément à la directive WCAG 2.0.
La couleur
Le contraste des couleurs utilisé par joomla est conforme aux instructions des WCAG 2.0. en effet la couleur du panneau d'administration tient compte des directives des WCAG 2.0 qui exigent que le contraste de l'interface utilisateur soit supérieur à 4,5:1. Le contraste de couleur choisi pour l'interface utilisateur d'administration de Joomla 4 est de 4,8:1.
L'interface d'administration
Dans l'administration de Joomla 4, le menu principal se présente à gauche de l'interface. On peut y trouver les éléments de menu contenu, menu, composant, utilisateur, systeme qui ont eux- même des sous menus. Lorsque l'utilisateur clique sur un des éléments, la barre latérale est masquée par la barre verticale des sous-menu qui se développe. La navigation est simplifiée.
Panneau de contrôle configurable
L'ensemble du panneau de contrôle de Joomla 4 est configurable. L'utilisation peut configurer la disponibilité et la position des éléments du panneau de contrôle. Tous ces paramètres peuvent être modifiés et personnalisés en fonction de l'utilisateur : chaque utilisateur peut adapter le backend à ses besoins. Les paramètres d'accessibilité se trouvent sous le profil utilisateur (Utilisateurs -> Gérer) et dans le menu utilisateur dans le coin supérieur droit de votre backend.
Il existe 4 paramètres différents qui peuvent être utilisés individuellement ou en combinaison.
- Monochrome change les couleurs du backend en noir/blanc
- Le contraste élevé
- La mise en surbrillance des liens dans le backend
- Augmentation de la taille de la police
Les liens d'évitement
Le plugin - Skype to navigation - peut etre activé ou désactive pour le back office, mais peut également être activé pour le frontend. Il aide de les utilisateurs du clavier à accéder directement à une région du site : navigation, article, footer..
Le plugin d'accessibilité de joomla 4.0
Joomla 4 dispose d'un plugin d'accessibilité intégré. On peut le trouver dans le gestionnaire de plugins. Le plug-in peut être activé ou désactive depuis le gestionnaire de plugin. Une fois activé, l'icône d'accessibilité s'affiche dans le coin inférieur droit de chaque page de votre site Web.Les paramètres d'accessibilité sont utiles pour adapter le backend à chaque utilisateur. Mais il est également possible de proposer des fonctionnalités d'accessibilité pour les visiteurs de votre page. Le plugin "Additional Accessibility Features" peut être activé pour le backend, le frontend ou les deux.
Le plugin ajoute un bouton en bas de la page. Pour ouvrir/fermer les fonctions, vous pouvez utiliser un raccourci clavier, CTRL+ALT+A sous Windows ou CTRL+OPTION+A sous MacOS. Avec le plugin, l'utilisateur peut augmenter ou diminuer la taille de la police et augmenter ou diminuer l'espacement du texte pour améliorer la lisibilité du contenu. L'utilisateur peut également inverser les couleurs de la page, ajouter des soulignements à tous les liens, agrandir le curseur, activer un guide de lecture et également convertir le texte en parole.
Pour certaines fonctions, il existe des raccourcis clavier spéciaux :
Basculer le menu : CTRL + ALT + A
Teintes grises : CTRL + ALT + G
Souligner les liens : CTRL + ALT + U
Grand curseur : CTRL + ALT + C
Guide de lecture : CTRL + ALT + R
Texte pour parler : CTRL + ALT + T
Discours en texte : CTRL + ALT + S
Comment vérifier l'accessibilité de joomla?
A partir de la version 4.1 Joomla dispose d'un plugin vérificateur d'accessibilité. Ce vérificateur met en évidence les problèmes d'accessibilité. Le plugin vérifie la présence d'erreurs ou d'avertissements en une cinquantaine de points et guide l'administrateur du site Web pour les corriger. Il est important de mentionner qu'il s'agit bien sûr d'un système automatique et vous pouvez bien entendu corriger les erreurs si vous en détectez. Ce plugin a été développé par Brian Teeman, qui a rendu le script prêt à être utilisé dans Joomla.
Comment activer le vérificateur le plugin?
Pour utiliser le vérificateur d'accessibilité Joomla, vous devez d'abord vous assurer que votre Joomla est en version 4.1 ou supérieure.
Etape 1 : Vous pouvez ensuite aller dans Système > Plugins
Etape 2 : Cliquer sur PlugIns
Etape 3 : Rechercher "Système - Vérificateur d'accessibilité de Joomla", qui est un plugin système. Activez le plug-in. Lorsque le plug-in est activé, accédez à l'avant du site Web et connectez-vous en tant qu'administrateur/super utilisateur pour voir le plug-in fonctionner.
Que vérifie le plug-in?
Le plug-in effectue une analyse rapide lors du chargement de la page. Chaque page est vérifiée sur environ 50 points. S'il y a des erreurs ou des avertissements, le bouton affiche un badge de notification avec le nombre total de problèmes détectés.
Le rouge indique des erreurs, tandis que le jaune indique qu'il n'y a que des avertissements.
En cliquant sur le bouton d'accessibilité ou la notification sur la page, vous obtiendrez plus d'informations.
Vous pouvez diviser les problèmes d'accessibilité en différentes catégories.
- La lisibilité du texte
- Titres et en-tête
- Contraste
- Images
- Formulaires
- Tableaux
- Etc...
Le plugin vous donne une indication du niveau de lisibilité. Un bon score de lisibilité indique que votre texte est compréhensible et facile à traiter. Outre la lisibilité technique, le contenu, la structure et la conception du texte sont également importants pour une lisibilité totale. Par conséquent, ce plugin ne garantit pas le niveau de lecture exact mais n'est qu'une indication.
Le score de lisibilité est exprimé en :
- Bon
- Assez difficile
- Difficile
- Très difficile
Conseils pour améliorer le score
- Conservez des phrases d'environ 15 mots en moyenne.
- Évitez les phrases de plus de 25 mots.
- Décomposez les longues phrases ou utilisez des puces.
- Évitez les mots complexes ou les mots avec beaucoup de syllabes.
Titres des pages
Afin de comprendre le contenu de la page, il est important que vous struturiez correctement les titres et les sous-titres sur votre site Web. Les navigateurs Web, les plug-ins et les technologies d'assistance peuvent les utiliser pour fournir une navigation dans la page.
Navigation au clavier
La navigation sur un site web doit être possible à l’aide du clavier seul pour les personnes qui ne peuvent pas utiliser de souris. Cette fonctionnalité est prise en charge directement par le navigateur. Il est tout de même important de vérifier son fonctionnement, car certains développements peuvent entraîner des difficultés pour naviguer correctement dans la page.
Pour tester si votre service est accessible à l’aide du clavier, vous pouvez tenter de naviguer sans votre souris. Toutes les fonctionnalités disponibles habituellement doivent rester accessible.
Il est crucial de s'assurer que tous les liens et éléments de contenu de votre site Web sont accessibles via le clavier.
L'utilisation de balises de structure HTML appropriées, c'est-à-dire nav pour la navigation, header pour l'en-tête de la page, article pour le contenu lisible, ne sont que quelques exemples qui garantissent que le contenu est accessible via la navigation au clavier uniquement.
Il est également essentiel d'avoir un ordre correct car le lecteur d'écran ou d'autres outils ne les liront que dans l'ordre dans lequel le HTML est rendu et non dans l'ordre dans lequel l'élément apparaît nécessairement sur la page.