Problématiques de visualisation des interfaces Web

Alors que l’accessibilité des applications locales est relativement bien traitée, il en est tout autrement concernant les pages Web. Ce chapitre met en avant les diverses raisons qui font que les pages Web amènent bien plus facilement à des problèmes d’accessibilité que les applications locales. Le problème réside principalement dans la liberté offerte aux concepteurs et développeurs de pages Web, mais pas uniquement. Divers exemples permettent de mettre en avant des problèmes concrets rencontrés par des personnes ayant une basse vision mais aussi des problèmes qui peuvent être rencontrés par n’importe qui dans un contexte particulier. Ce chapitre introduit aussi brièvement des solutions pour compenser les difficultés rencontrées. Ces solutions seront détaillées plus précisément dans les chapitres suivants. Ce chapitre est construit sur la base d’entretiens informels menés auprès de personnes malvoyantes (avec diverses pathologies) au sein d’une association.

Éblouissements (brillance importante)

Les personnes atteintes de photophobie sont très sensibles aux sources de lumière importante. Si l’image projetée est claire, un écran d’ordinateur peut générer assez de lumière pour éblouir complètement une personne. Un grand nombre de pages Web sont sur fond blanc. Cette tendance dépend du thème de site (e-commerce, voyage, loisir, etc.) sur lequel on navigue. Mais le fond blanc (ou très clair) fait partie des plus répandus.

Une page Web peut tout à fait respecter les standards tels que ceux du W3C ou du RGAA et avoir un arrière-plan blanc sur toute la page. Malheureusement ceci ne convient pas du tout aux personnes qui sont très sensibles à la lumière et donc facilement éblouies.

Le texte devient difficilement voire complètement illisible. Cette gêne n’apparaît pas uniquement lorsque tout le fond de la page est blanc. il arrive également que des difficultés de lecture surviennent même s’il ne s’agit que d’un petit bloc de texte sur un fond blanc. Le lecteur peut également être gêné si un élément clair se trouve à proximité d’un texte sans pour autant que ce soit l’arrière-plan de ce dernier. Nous avons pris pour exemple le blanc comme source de problème parce qu’il s’agit de la couleur la plus lumineuse, mais le problème peut arriver avec toutes les couleurs lumineuses.  Il ne s’agit que d’une représentation donnée à titre d’exemple. Lorsqu’une personne est gênée par un arrière-plan trop lumineux, le texte a tendance à paraître plus fin. La couleur de l’arrière-plan déborde sur la lettre ce qui donne des contours flous. Si l’éblouissement devient trop important, les lettres peuvent entièrement disparaître. L’impact peut alors aller d’une simple réduction légère de la vitesse de lecture à une impossibilité totale de lecture.

Contraste faible

Le contraste est ce qui permet de distinguer deux éléments entre eux. Plus le contraste est élevé et plus la discrimination sera facile. Sur une page Web, il est important d’avoir un bon contraste entre le texte et l’arrière-plan afin d’avoir un confort de lecture optimal. Des pathologies visuelles affectent la perception des couleurs et par la même occasion la perception des contrastes. Qu’il s’agissent des contrastes de luminance ou de couleurs , des contrastes trop bas peuvent empêcher la lecture.

Certains concepteurs ou développeurs de site Web utilisent des ensembles de couleurs qui offrent des contrastes entre le texte et l’arrière-plan trop faibles. Des standards permettent de normaliser le taux de contraste de brillance minimal nécessaire entre le texte et son arrière-plan immédiat, mais cela n’est bien sûr pas suffisant pour tout le monde. Les personnes qui sont atteintes de pathologies à un stade avancé sont souvent confrontées à ce problème. Il n’est pas si rare de trouver des textes verts sur fond gris moyen, ou même jaunes sur fond blanc. il est parfois même difficile pour des personnes valides de les lire selon le support de visualisation utilisé.  Le contraste de luminance (ou brillance) est le type de contraste le plus utilisé. Le W3C donne une méthode de calcul et l’utilise pour définir ses standards.  On peut y trouver des taux de contraste relativement faibles. Sur certains exemples, le texte peut même devenir complètement illisible pour un grand nombre de personnes selon le support sur lequel ils sont visualisés. Par exemple, avec un vidéo-projecteur qui a bien moins de contraste qu’un moniteur à dalle IPS, la perception risque bien d’être difficile pour beaucoup de personnes.

Texte au format image

Certains sites Web utilisent des images afin de véhiculer des informations textuelles. C’est souvent le cas des sites Web développés avec la technologie Flash ou des technologies similaires, mais on trouve également des sites en HTML qui utilisent ce procédé. Bien que les textes affichés par le biais d’images soit strictement déconseillés par les standards WCAG 2.0, il restent néanmoins toujours une réalité.

Divers problèmes peuvent survenir, notamment lors de la consultation de ces textes par des personnes malvoyantes. Ces textes, affichés par le biais d’images, ne peuvent pas être sélectionnés ni copiés. Certains utilisateurs malvoyants utilisent un outil externe dans lequel ils placent le texte à lire afin de lui enlever sa mise en forme et d’accroître le confort de lecture. Cependant, avec les images, il n’est pas possible de copier le contenu textuel et donc de l’insérer dans ce type d’outils. D’une certaine manière, ces textes ne peuvent être lus que visuellement puisqu’en soi ce n’est pas du texte mais une image. Un lecteur d’écran ne sera donc pas en mesure d’y accéder non plus.

À côté de cela, l’agrandissement de ce texte peut lui aussi poser problème. Si le niveau de grossissement reste faible alors cela n’est pas vraiment problématique mais dès lors que l’on atteint des seuils d’agrandissement un peu plus importants alors la netteté du texte diminue rapidement. Le fait d’agrandir une image quelle qu’elle soit diminue sa qualité (un phénomène dit de pixélisation intervient). Lorsqu’il s’agit d’agrandir une image pour lire du texte alors ce dernier est dégradé ce qui réduit la qualité de lecture.

Images d’arrière-plan

Outre l’information que peuvent véhiculer les images placées en tant qu’arrière-plan, bien que strictement déconseillées par le WCAG 2.0, ces images peuvent sensiblement réduire le confort de lecture si elles sont insérées au-dessous de contenus textuels. En effet, le texte peut ainsi devenir illisible à certains endroits selon la teinte et l’intensité lumineuse de la zone de l’image sur laquelle il se trouve. La couleur de l’image à l’endroit où se trouve le texte peut par exemple donner lieu à un contraste faible ou à des éblouissements. Ce procédé est souvent utilisé pour la création du bandeau d’entête des pages Web ou bien pour la création de boutons.

De plus, bien souvent la méthode utilisée pour le développement de la page et permettant de positionner les images ainsi que les textes ne permet pas de prévoir la superposition. C’est-à-dire que le texte n’est pas positionné de manière fixe (absolue) par rapport à l’image. Autrement dit, le niveau de zoom du navigateur, la famille de police de caractères utilisée ou la résolution de l’écran, sont autant de paramètres qui jouent sur le placement du texte au dessus de l’image. Il n’est pas possible de compter sur le fait que l’image contient un grande portion avec laquelle le texte est bien contrasté puisque l’on ne sait pas sur quelle portion de l’image il va finalement se positionner.

Table des matières

1 Introduction
1.1 L’accessibilité et le numérique
1.2 Le handicap
1.3 Cadre du sujet et axes directeurs
2 Notions complémentaires requises
2.1 L’œil humain et son fonctionnement
2.2 L’acuité visuelle
2.3 La déficience visuelle
2.3.1 Troubles visuels dus à des pathologies
2.3.2 Regroupement des pathologies visuelles
2.4 Les couleurs et leurs propriétés
2.4.1 Organisation des couleurs
2.4.2 Des propriétés diverses
2.5 Conclusion
3 État de l’art
3.1 Le Web dans sa forme visuelle
3.2 La normalisation
3.2.1 Domaine d’application et cadre juridique
3.2.2 Les éléments sur lesquels portent les normes et recommandations
3.2.3 Le contenu Web
3.2.4 Les outils de production
3.2.5 Les outils de consultation
3.2.6 Un exemple plus concret
3.2.7 Les limites
3.3 Les technologies d’assistance
3.3.1 Les magnifiers d’écran
3.3.2 Intégration dans les systèmes d’exploitation
3.3.3 Les Outils de gestion des styles
3.4 Adaptation de pages Web et préférences utilisateur
3.4.1 Architecture de transformation, destinataires et but
3.4.2 Éléments traités, reconnaissance automatique, cible d’application, partie transformée et conservation du contexte originel
3.4.3 Profil utilisateur : langage de définition, acquisition, déficience spécifique visée et définition a priori
3.4.4 Méthode d’adaptation .
3.4.5 Évaluation, métriques et utilisateurs
3.4.6 Démonstrateur et corpus de données fourni
3.5 Conclusion
4 Problématiques de visualisation des interfaces Web
4.1 Problèmes sur la page d’origine
4.1.1 Éblouissements (brillance importante)
4.1.2 Contraste faible
4.1.3 Texte au format image
4.1.4 Images d’arrière-plan
4.1.5 Ordre du contenu
4.1.6 Le daltonisme
4.2 Utilisation des technologies d’assistance
4.2.1 Éblouissements (brillance importante)
4.2.2 Contraste faible
4.2.3 Images d’arrière-plan
4.2.4 Ordre du contenu
4.2.5 Le daltonisme
4.3 Conclusion
5 Analyse des besoins en vue de l’acquisition des préférences de l’utilisateur
5.1 Introduction
5.2 Types de besoins et leur expression
5.3 Analyse des réponses
5.4 Synthèse des réponses et observations
5.5 Souhaits et préférences
5.5.1 Acquisition par l’exemple
5.5.2 Acquisition par apprentissage
5.6 Conclusion
6 Recherche d’une adaptation
6.1 Approche exacte – La théorie des préférences
6.2 Syntaxe du langage des préférences
6.3 Sémantique du langage des préférences
6.3.1 Méthodes de résolution
6.3.2 Limites principales liées au contexte .
6.4 Les algorithmes évolutionaires
6.4.1 L’algorithme NSGA – Concepts fondamentaux
6.4.2 La variante NSGA-II
6.4.3 La variante NSGA-III
6.4.4 Le tri par fronts de non domination
6.4.5 Les opérateurs génétiques
6.4.6 Les fonctions objectif
6.5 Conclusion
7 Schéma global du démonstrateur 
7.1 Sélection des données depuis la page Web
7.2 Données en entrée
7.3 Données en sortie et transformation de la page Web
7.4 Architecture générale
7.5 Les différents paramètres
7.6 Exemples d’adaptations
7.7 Conclusion
8 Expérimentations
8.1 Introduction
8.2 Approches exactes
8.3 Algorithmes génétiques
8.3.1 Mise en œuvre
8.3.2 Corpus de pages Web réelles utilisé .
8.3.3 Résultats
8.3.4 Impact du choix des paramètres
8.4 Conclusion
9 Conclusion

Cours gratuitTélécharger le document complet

Télécharger aussi :

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *