Démarche d’accessibilité

Dans le monde, plus d’un milliard de personnes ont un handicap rendant l’accès à internet difficile (malvoyance, daltonisme, dyslexie, etc.)

Plus de 7 contenus web sur 10 ne sont pas accessibles à tous et à toutes.

Dans un objectif d’amélioration de l’accessibilité, le site du groupe MerAlliance est développé selon les recommandations du référentiel général d’amélioration de l’accessibilité (RGAA) pour être accessible à tous les usagers quel que soit le matériel ou le logiciel utilisé pour naviguer sur internet.

Cette déclaration de démarche d’accessibilité s’applique uniquement au site meralliance.com 

Objectifs attendus

Le groupe est à l’origine de ce désir d’amélioration de l’accessibilité du service numérique puisque son cahier des charges mentionnait déjà cet objectif, aux côtés de l’écoconception.

Le groupe MerAlliance est une entreprise engagée dans une démarche RSE qui vise à avoir un impact positif sur la société. L’accessibilité est un enjeu incontournable dans la mise à disposition de l’information à toutes et à tous.  

Actions mises en œuvre

Le travail sur l’accessibilité du site du groupe MerAlliance comprend différentes actions dans les catégories suivantes : 

Design

Travail sur les contrastes couleur de fond/couleur. Quelques exemples :

• H2 classique – couleur de fond : #FFFFFF, couleur du texte : #1B3683 / ratio : 11,04 (bien)
• Menu burger ouvert – couleur de fond : #1B3683, couleur du texte : #FFFFFF / ratio : 11,04 (bien)
• H1 sur zone d’intro – couleur de fond : #FFBA8F, couleur du texte : #1B3683 / ratio : 6,66 (accepté)
• Texte sur chronologie (page qui-sommes nous)  – couleur de fond : #F8F9FB, couleur du texte : #1B3683 / ratio : 10,48 (bien)
• Bouton CTA dans zone de réassurance – couleur de fond : #FFFFFF, couleur du texte : #1B3683 / ratio : 10,48 (bien)
• Texte sur zone de réassurance – couleur de fond : #F8F9FB, couleur du texte : #FFFFFF / ratio : 10,48 (très bon)
• Axes d’amélioration :
  • H3 classique survolé – couleur de fond : #FFFFFF, couleur du texte :#EB6008 / ratio : 3,38 (non conforme)
  • Texte sur zone d’intro – couleur de fond : #FFBA8F, couleur du texte : #1B3683 / ratio : 6,66 (non conforme pour du texte normal)

Les contrastes ont été testés avec le site UserWay.

Aide à la navigation

• présence de liens d’évitement ;
• menu de navigation optimisé ;
• blocs déroulants optimisés ;
• focus sur les éléments ;
• une page plan du site est présenté en lien dans le pied de page du site et représente l’architecture générale du site ; 
• la navigation ne contient pas de piège au clavier ;
• optimisation pour la lecture vocale : présence d’un menu optimisé, blocs déroulants optimisés, lecture des encarts optimisée (le lien se situe sur le titre) exclusion de la lecture du bouton, titrage des liens optimisé, les liens sont correctement nommés, la balise title est laissée vide pour éviter une lecture en doublon.

Images

• à la mise en ligne, les images porteuses d’information ont une alternative textuelle ;
• les images de décoration sont correctement ignorées par les technologies d’assistance ;
• les attributs obligatoires sont déclarés pour que le contexte de l’image soit bien interprété (attribut alt vide pr img décorative) – pour les images au format svg nous avons évité l’attribut alt, mais avons plutôt préféré l’attribut title.

Retour d’information et contact

Si vous n’arrivez pas à accéder à un contenu ou à un service, vous pouvez nous contacter par courriel à l’adresse contact@meralliance.com pour être orienté vers une alternative accessible ou obtenir le contenu sous une autre forme.

Recommandations essentielles

Les 4 principes fondamentaux du W3C (Web content accessibility guidelines du WCAG) sont les suivants : perceptible, opérable, compréhensible et robuste.

Perceptible

• fournir des alternatives textuelles pour tout contenu non textuel ;
• proposer des sous-titres pour les vidéos ;
• assurer un contraste suffisant (ratio minimum 4.5:1) entre le texte et le fond ;
• permettre le redimensionnement du texte jusqu’à 200%.

Opérable

• rendre toutes les fonctionnalités accessibles au clavier ;
• donner assez de temps pour lire et utiliser le contenu ;
• éviter les contenus qui peuvent provoquer des crises d’épilepsie ;
• fournir des moyens de navigation clairs (menu, plan du site).

Compréhensible

• identifier la langue de la page ;
• créer un contenu qui apparaît et fonctionne de manière prévisible ;
• aider les utilisateurs à éviter et corriger les erreurs ;
• utiliser des libellés explicites pour les formulaires.

Robuste

• assurer la compatibilité avec les technologies d’assistance ;
• utiliser correctement les balises HTML et ARIA.