État des lieux de l’accessibilité mobile

Initialement destinés à passer des appels, les téléphones mobiles ne se limitent plus à ce type d’usage. Le mobile-first est devenu une réalité : les internautes utilisent massivement leur smartphone pour naviguer sur le web, consulter leurs e-mails, les réseaux sociaux, des news ou encore des vidéos...

Les chiffres que nous avons compilés sur les mobinautes sont on ne peut plus éloquents, mais vous verrez dans cet article qu’il y a encore du chemin à faire pour satisfaire cette grosse communauté.

Encore aujourd'hui, de nombreux défis restent à relever. L’un des plus stimulants est de réussir à rendre 100 % accessibles les contenus et les services numériques, de plus en plus sollicités sur petit écran. Car bien souvent, la majorité des utilisateurs d’internet ne poursuivront pas leur navigation si les contenus ne s’affichent pas convenablement sur leur appareil. 

Voilà pourquoi il est plus que jamais crucial de les adapter au format mobile. Pour vous aider à y voir plus clair, voici notre état des lieux de l’accessibilité mobile.  

Accessibilité mobile : quelques chiffres clés sur l’utilisation mobile

Voici quelques chiffres sur l'utilisation mobile selon un rapport concernant l'état du numérique dans le monde en 2019 :

Utilisateur mobile

Taux mondial d’utilisateurs mobiles : 5,1 milliards.

En France, 64,70 millions de personnes sont équipées de mobile, alors que le Royaume-Uni, l’Espagne et l’Allemagne possèdent tous plus d’un mobile par personne. 

• En France, les smartphones représentent 71 % des mobiles,
• L'Allemagne : 75 %, 
• Le Royaume-Uni : 77 % 
• Et l'Espagne : 87 %.

Internet mobile 

Plus de 50 % de personnes utilisent internet sur mobile, ce qui représente 3,986 milliards de personnes. Le pourcentage des utilisateurs français est de 74 % .  L’Allemagne totalise 78 % d'utilisateurs internet mobile, alors que le Royaume-Uni et l’Espagne comptent tous les deux plus de 80 % d’utilisateurs.

Utilisation mobile vs desktop 

Les internautes préfèrent faire leurs recherches sur leurs mobiles que sur desktop.

Utilisation par tranche d’âge

98 % des adultes entre 18 et 24 ans en France possèdent un smartphone, contre 44 % pour les personnes ayant plus de 70 ans.

Selon le baromètre numérique 2019, les Français de moins de 40 ans éprouvent de moins en moins de l’intérêt pour l’ordinateur.

Datas sur le taux de transformation - taux de conversion par device

Le commerce mobile occupe une part de 45 % de toutes les activités e-commerce.

L’Europe est en dessous et la France arrive dernière dans le classement des pays de l’UE avec 26 % d’utilisateurs.

En 2020, le commerce mobile représentait 45 % de toutes les activités e-commerce :

68 % des utilisateurs de smartphones et de tablettes ont tenté d’effectuer un achat sur leur appareil.

Comme nous venons de le voir, l’usage mobile est en passe de devancer l’usage desktop dans les activités de consultation d’information et de e-commerce.

Ce changement de paradigme de conception concerne tous les utilisateurs quel que soit leur âges, pays, culture, capacité physique et mentale. À l’ère du nomadisme, l’accessibilité numérique mobile est un enjeu majeur qu’il faut relever afin de garantir un accès au web à tous.

Les handicaps face au numérique : principe de l’accessibilité, chiffres et critères de mise en conformité

Définition de l’accessibilité

L’accessibilité consiste à mettre le web et ses services à la disposition de tous les individus, qu’ils soient en situation de handicap ou pas.

Quelques chiffres sur le handicap en France et dans le monde

France

Environ 12 millions de Français sont touchés par un handicap au sens large.

1,5 million de personnes sont atteintes d’une déficience visuelle et 850 000 correspondent aux personnes à mobilité réduite. 

2,7 millions représentent la population active (15 à 64 ans). 

Source : Enquête emploi 2015 ; INSEE, traitement DARES - les chiffres clés de l’aide à l’autonomie 2018, CNSA.

États-Unis d’Amérique 

Selon une étude de Disability Status and Type Among Adults en 2016, 26  % de la population active américaine est touchée par un handicap.

Statistiques mondiales 

15 % de la population est concernée, les +65 ans représentant près de 10 % de la population en 2019.

Les référentiels et norme en vigueur  

Le W3C, organisme de normalisation web international, a mis au point les critères d’accessibilité Web Content Accessibility Guidelines (WCAG) pour assurer la conformité des sites internet. L’union européenne a décliné ce référentiel dans une norme européenne EN 301-549 v2.1.2. Au niveau national,  le Référentiel Général de l’Amélioration de l’Accessibilité ( RGAA) liste les obligations d’accessibilité et les critères d’accessibilité à respecter pour les sites internet. La consultation sur mobile d’un site internet doit respecter ces critères. Concernant les applications mobiles natives, c’est la norme européenne qui fait foi.

Quels sont les problèmes les plus courants lors de l'utilisation d'applications mobiles ?

Problème de taille de texte

Les mobiles ont tous un paramètre qui permet d'augmenter la taille de police par défaut et cette taille de police doit être répliquée dans toutes les applications. Néanmoins, certaines applications ou sites utilisent leur propre taille de police. La taille de police peut être parfois inadéquate, ce qui empêche le lecteur de lire le texte convenablement. Les écrans des téléphones portables étant plus petits, les développeurs d'applications doivent veiller à présenter un texte par défaut de taille raisonnable et lisible. 

Contraste

En raison d’un manque de contraste entre le texte et l'arrière-plan, certaines personnes ont du mal à différencier les couleurs. Le rapport de contraste des couleurs recommandé est d'au moins 4,5:1 (texte plus grand d'au moins 3:1).

Par ailleurs, l’utilisation de couleurs comme seule forme d'identification empêche les personnes daltoniennes de participer ou de comprendre pleinement l'application. 

Touchpoints

Les cibles tactiles ne sont pas toujours faciles à manipuler, faute de distance entre les éléments, et la taille pas optimisée. Même si ce n’est pas un critère pour la norme européenne concernant les applications mobiles, c’est un élément qui est à relever.

Résultat : il y a une incohérence entre le désir de ce qu’on veut faire et l’action. Par exemple, quand on appuie accidentellement sur "envoyer" au lieu de "enregistrer" sur un brouillon d'e-mail. 

Incohérence mobile/desktop

Les écarts sont bien réels entre applications mobiles et les versions de bureau. En général, les consommateurs apprécient les présentations numériques cohérentes, quelle que soit la plate-forme utilisée. Toute différence ou omission entraîne confusion et frustration. 

Les clients étant de plus en plus nombreux à utiliser différents appareils pour accéder aux services numériques, les marques doivent pouvoir répondre efficacement à leurs besoins en offrant une expérience inclusive, centrée sur l'utilisateur et uniforme sur tous les écrans.

Bonnes pratiques à mettre en place 

L'essentiel est de partir sur de bonnes bases et de respecter les directives d'accessibilité des sites internet et des applications mobiles . Découvrez quelques bonnes pratiques à adopter pour garantir l'accessibilité mobile.

Rendre l'interface sur mobile facile d'utilisation 

Les smartphones à écran tactile doivent être faciles à manipuler. Il faut privilégier un contrôle gestuel simple (comme un tapotement avec un doigt) plutôt que des combinaisons complexes (impliquant plusieurs doigts, plusieurs tapotements et des formes dessinées) qui peuvent être compliquées pour les utilisateurs ayant des déficiences motrices ou de dextérité.

Éventuellement, créer des alternatives pour permettre des gestes simples de toucher ou de glisser à la place de gestes plus complexes.

En cas d'actions accidentelles, les utilisateurs doivent avoir la possibilité de revenir en arrière facilement et réorienter leur parcours.

Privilégier des formats cohérents

Les éléments sur les pages d'une application mobile doivent être présentés dans une mise en page cohérente pour orienter l’utilisateur. Il s’agit en fait d’organiser l’ordre de ces composants (qui sont ici des composants répétés et des éléments de navigation) dans une taille et une orientation particulières.

Le format le plus classique des applications natives se compose d’un logo, d’un titre, d’un formulaire de recherche et d’une barre de navigation. Dans le menu, ces éléments apparaissent dans le même ordre et position relatifs. Lorsque l'application est affichée sur petit écran, la barre de navigation se réduit en une seule icône avec une liste déroulante, mais les éléments de cette liste sont toujours dans le même ordre.

En plus de l’aspect accessibilité, cette pratique entre dans une dimension cross-canal

L’utilisateur se sent à l'aise et en contrôle lors de l'exécution de tâches, y compris celles qui peuvent commencer sur un appareil et se terminer sur un autre.

Proposer des méthodes simples pour la saisie de données

La saisie de texte peut prendre du temps et être difficile pour certains utilisateurs.

Taper sur un clavier par exemple n’est pas à la portée de tous les utilisateurs, notamment les handicaps moteurs. Mais aussi pour l’utilisateur lambda pressé ou qui a besoin d'effectuer son action plus vite. 

D’autres styles de saisie de données existent pour rendre la tâche plus facile et rapide. Réduisez la quantité de saisie de texte requise en fournissant des menus sélectionnés, des boutons radio ou des cases à cocher, ou en remplissant automatiquement les informations connues (par exemple la date, l'heure, l'emplacement...).

Adapter le contenu à toutes les tailles d'écran 

Quelques bonnes pratiques pour adapter son contenu aux petits écrans :

- Réduire au minimum la quantité d'informations sur chaque page (par rapport à un ordinateur de bureau ou portable) en fournissant un site web mobile dédié ou en concevant le site responsive

- Fournir une taille par défaut raisonnable pour le contenu et les commandes tactiles afin de minimiser la nécessité de faire un zoom avant et arrière pour les utilisateurs malvoyants

- Adapter la longueur du texte des liens à la largeur de la fenêtre d'affichage

- Placer les champs de formulaire sous leurs étiquettes, plutôt qu'à côté

Optimiser les rapports de contraste de couleur

Les WCAG définissent des rapports généraux de contraste des couleurs qui sont acceptables pour la plupart des utilisateurs, mais une attention particulière doit être accordée aux appareils et applications mobiles. En effet, les téléphones portables sont plus susceptibles d'être utilisés à l'extérieur, où les reflets du soleil peuvent affecter la lisibilité du texte. 

Un mauvais contraste peut également aggraver les difficultés rencontrées par les personnes malvoyantes lorsqu'elles accèdent au contenu sur des appareils mobiles.

Vérifier les contrastes entre la couleur de la police et le fond en fonction des exigences du niveau AA du WCAG 2.1 

Focus sur les cibles tactiles et le placement

Les cibles tactiles doivent être perceptibles, c’est-à-dire suffisamment grandes (au moins 9 mm de haut sur 9 m de large ou un minimum de 44x44 CSS pixel.). Mais aussi distantes pour que les utilisateurs puissent facilement les cibler au toucher et interagir avec précision et confiance.

En plus de la taille et de l'espacement, le positionnement des boutons est également important. Quelle que soit la manière dont l'appareil est tenu, l’utilisateur doit y accéder sans que cela cause un problème à sa facilité d’utilisation. Un bouton peut être plus facilement atteignable par un utilisateur droitier par rapport à un gaucher si l’on considère l’amplitude de mouvement du pouce. 

Pour pallier cet inconvénient, placez les boutons là où ils sont faciles d'accès afin de permettre une utilisation flexible de tous les éléments interactifs.

Nouveautés techs mobiles A11Y 

Alors que l’accessibilité web sur mobile représente un enjeu majeur pour les concepteurs d’applications, de nouvelles tendances émergent pour améliorer l’accès des contenus et les services aux utilisateurs. Apple a su relever le défi avec VoiceOver qui grâce à son intelligence embarquée arrive à décrire le contenu d’une image pour les utilisateurs malvoyants ou non voyants.

En outre, les solutions low code et no code facilitent la création rapide de plates-formes web, ce qui améliore l’accessibilité. Les avantages : 

• Moins ou pas de lignes de programmes à écrire 
• L'automatisation permet de résoudre les problèmes de fonctionnement des organisations
• La fusion des plates-formes de collaboration et des outils de low code - un moyen en libre service pour rendre accessible les applications les plus utiles et couramment utilisées par les professionnels 

Pour conclure

Au-delà de son aspect légal, l’accessibilité au sens large représente un atout fondamental et un enjeu majeur pour la stratégie numérique d’une entreprise. 

Réussir à ce niveau, c’est envisager une approche inclusive dès le départ. Autrement dit, fournir une expérience optimale à l’ensemble des utilisateurs d’internet - qu’ils soient en situation de handicap ou pas. Le tout grâce à un contenu de qualité, adaptable et accessible sur tous les appareils.

“Tous les appareils” est bien le maître mot dans le monde des applications mobiles : entre IOS et la multitude d'appareils sous Android, il existe une multitude de configurations possibles. Prendre en compte l’ensemble des ces configurations est néanmoins une nécessité pour l'accessibilité numérique. Dernier conseil : ne partez donc pas dans de l'innovation non maîtrisée, optez pour les standards définis dans les guides accessibilité IOS et Android et utilisez les motifs de conception robustes.