Chacun a ses propres préférences et besoins - et Joomla s'en occupe.

En plus de toutes les mesures prises dans le noyau pour fournir un outil de création accessible, il existe des modules complémentaires dans Joomla qui peuvent vous faciliter la vie et rendre vos utilisateurs et clients plus à l'aise.

Ces ajouts peuvent être utiles - mais sachez qu'ils ne rendent pas un site accessible à eux seuls !

Backend : paramètres d'accessibilité individuels

Dans Joomla 4, il est possible de modifier les paramètres du backend 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 quatre paramètres différents qui peuvent être utilisés individuellement ou en combinaison. Monochrome changera les couleurs du backend du bleu au noir/blanc :

Le contraste élevé supprimera une partie de l'arrière-plan et rendra le contraste plus lumineux :

Highlight Links ajoute des soulignements et des bordures à tous les liens dans le backend :

Augmenter la taille de la police change la taille de la police de base à 18 pixels (la taille de police standard dans les navigateurs est généralement de 16 pixels).

Pour les utilisateurs : plugin de saut de navigation

Ce plugin est activé par défaut pour le backend, mais peut également être activé pour le frontend .

Il aide les utilisateurs du clavier à accéder directement à une région du site.

Pour les utilisateurs : Plugin d'accessibilité

Les paramètres d'accessibilité sont utiles pour adapter le backend à chaque utilisateur du backend. 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.

Capture d'écran Firefox

Il existe une fonction pour changer les teintes de gris de la page, qui peut être utilisée dans Edge ou Chrome, mais elle est désactivée dans Firefox.

Bord de capture d'écran

Pour certaines fonctions, il existe des raccourcis clavier spéciaux :

Capture d'écran de la page de démonstration Cassiopeia avec guide de lecture activé

Le plugin Additional Accessibility Features ne résout aucun problème d'accessibilité que votre site peut avoir. Le site Web doit être construit correctement pour l'accessibilité dès le départ.

Les personnes handicapées utilisent des outils spécialisés (lecteurs d'écran, loupes d'écran, embosseuses braille, etc.). et n'utilisera probablement pas le plugin, mais il peut améliorer la convivialité pour les personnes âgées, les personnes ayant une déficience visuelle, les personnes ayant des problèmes cognitifs. Par exemple, une personne aveugle utilisera un lecteur d'écran et non la possibilité de changer le texte en parole, mais c'est une très bonne solution pour les personnes âgées, pour les personnes qui ont des difficultés de concentration, et aussi pour celles qui ont des problèmes de lecture temporaires.

L'agrandissement du texte est très utile pour de nombreux seniors et personnes qui voient moins bien. Souvent, ils ne connaissent pas les possibilités du navigateur et aiment utiliser de tels outils.

La version de contraste ne remplacera pas les contrastes corrects sur le site Web. Mais cela peut être utile pour les personnes qui ont une vue plus faible ou pour les personnes qui naviguent sur le site, par exemple dans un endroit ensoleillé.

Les WCAG n'exigent pas que les liens soient soulignés (ils doivent être mis en évidence). Mais les liens soulignés peuvent améliorer l'accessibilité pour les personnes malvoyantes ou pour les personnes ayant des difficultés de concentration.

Pour les utilisateurs : langue des pièces dans TinyMCE

Qu'est-ce que c'est?

Une balise qui marque une partie d'un texte comme "autre langue". Il est utile pour les moteurs de recherche ou les lecteurs d'écran afin qu'ils sachent qu'ils doivent changer de langue ou de prononciation. Imaginez qu'un lecteur d'écran utilise la prononciation anglaise pour une phrase comme « honni soit qui mal y pense » - cela semble bizarre !

Comment configurer ?

Dans le plugin TinyMCE, vous pouvez définir les langues que vous utilisez dans vos textes.

Si vous souhaitez faciliter la tâche des éditeurs, placez l'icône de langue sur les icônes autorisées pour vos éditeurs. Sinon, ils doivent sélectionner une langue avec le bouton de format et faire défiler vers le bas.

Comment l'utiliser dans l'éditeur ?

Écrivez votre article et enregistrez-le. Marquez ensuite les pièces qui sont dans une autre langue, cliquez sur l'icône du monde ou sur la liste déroulante des formats et sélectionnez la langue de cette pièce.

Maintenant, cette partie du texte est étiquetée en allemand. Le lecteur d'écran modifiera la prononciation en conséquence et les moteurs de recherche comprendront également votre texte.

Pour les auteurs et les éditeurs : vérificateur d'accessibilité - jooa11y

Rappelez-vous cet article de Brian Teeman annonçant une nouvelle et passionnante amélioration de Joomla : https://magazine.joomla.org/all-issues/july-2021/a-web-without-barriers.  

Maintenant, nous l'avons à bord !

Ce plugin aide à fournir un contenu accessible sur votre site Web.

Où peux-tu le trouver?

C'est un plugin système, son nom est jooa11y. Vous avez ce plugin avec Joomla Version 4.1.0, il est activé par défaut.

Dans le plugin, vous pouvez définir quelle zone de votre site est vérifiée (la zone principale est la zone par défaut) et vous pouvez inclure ou exclure certaines règles. Pour commencer, conservez simplement les paramètres prédéfinis.

A qui cela profite-t-il ?

Les visiteurs de votre site, car ils obtiennent un contenu sans barrière.

Auteurs de contenu sur votre site, car ils peuvent produire du contenu accessible.

Agences et développeurs Web - ils ont un produit qui permet de fournir un contenu sans barrière

Comment l'utiliser?

Écrivez n'importe quel article et enregistrez ou ouvrez n'importe quel article existant.

Activez le bouton "Contrôle d'accessibilité" dans la barre d'outils et immédiatement le vérificateur d'accessibilité indiquera dans une fenêtre de prévisualisation s'il y a des violations des règles connues.

Attention : tout comme un correcteur orthographique ou grammatical, ceci est un outil, il effectue des vérifications automatiques. Il ne peut pas trouver de violations de règles qui ne sont pas spécifiées dans le programme et il peut marquer des violations intentionnelles et correctes dans le contexte d'un article. C'est toujours votre responsabilité.

Comment ça marche?

Vous vous souvenez sûrement de la fameuse règle « Le contraste de la couleur du texte et de la couleur de fond doit avoir un rapport de contraste > 4,5 » ?

Le plugin vérifie cette règle et bien d'autres une par une et chaque violation d'une règle déclenche une erreur et sera marquée d'une icône dans l'aperçu.

Vous pouvez définir quelle zone de votre site est cochée (dans les paramètres du plugin, la valeur par défaut est la zone principale) et vous pouvez inclure ou exclure certaines règles.

Alors que certaines règles sont bien définies et sont certainement des erreurs, d'autres règles sont des violations des bonnes pratiques. Ce sont des avertissements et vous pouvez décider vous-même si cela est correct et prévu dans votre contexte ou si vous devez résoudre ce problème.

Derrière chaque icône, vous pouvez trouver une description - et parfois des conseils sur la façon de résoudre le problème ou sur les meilleures pratiques.

En bas à droite l'icône en forme de damier donne les premières informations. Il indique le nombre de problèmes si des problèmes ont été détectés. Cliquer sur le bouton fait basculer les informations détaillées dans le texte.

Passons étape par étape :

Le vérificateur a trouvé

• Erreurs de contraste à deux endroits - ce sont des erreurs.
• Un lien qui a target=_blank. Cela peut être correct et intentionnel - mais en général ce n'est pas une bonne pratique et donc un avertissement s'affiche.
• Une image sans texte alternatif - c'est une erreur.

Remarques

Tous les paramètres et plugins présentés ici ne résolvent aucun problème d'accessibilité sur votre site. Pour rendre un site Web accessible, vous avez besoin d'une structure HTML sémantique correcte et d'un bon CSS. Le noyau de Joomla vous aide avec des structures accessibles dans les différentes vues, comme des étiquettes correctes et des champs de saisie dans les formulaires.

Si vous utilisez un modèle tiers, vous devez être conscient des remplacements modifiant la structure d'origine des vues. Un joli template peut casser l'accessibilité d'un site, si le contraste des couleurs n'est pas bon ou si des éléments ne sont pas accessibles au clavier. L'accessibilité a de nombreuses facettes et les plugins ne sont qu'une aide pour les visiteurs qui utilisent votre site Web d'une manière différente de la vôtre.

Marge d'amélioration

Joomla est toujours un « travail en cours » et les plugins dont il est question ici évoluent toujours. Dans le prochain Google Summer of Code, nous avons inclus un projet d'accessibilité qui devrait améliorer le plugin d'accessibilité. Restez connectés et pensez accessible !

Merci

Cet article est une coproduction avec Christiane Maier-Stadtherr . Consultez ce lien pour d' autres articles de Christiane .

Nous remercions Stefan Wajda pour ses commentaires utiles.