Liens d'évitement
Le logo du handicap visuel. Egalement un bouton pour accéder à l'affichage épuré.
Affichage épuré
Logo de NeoWebTech représantant une souris dans un cercle. Métaphore combinée de la souris d'ordinateur et du symbole arobase.

NeoWebTech

Accessibilité

Ecrit le 27/06/2019 par NeoWebTech
Voici tous les critères d'accessibilités qui ont été pris en compte pour le développement de NeoWebTech
Logo du handicap visuel

Introduction


Tout d'abord je tiens à préciser pourquoi j'utilise le logo du handicap visuel sur les sites que je créer au lieu du logo handicap "classique" représentant une personne en fauteuil et qui est le logo utilisé traditionnellement lorsque l'on parle du handicap.

Il s'agit ni plus ni moins d'un choix personnel parce que j'estime qu'un site internet est avant tout une réalisation visuelle et qu'à ce titre c'est ce logo qui correspond le mieux. De mon point de vue c'est le visuel qui doit être rendu accessible que ce soit à ceux qui ne voient pas (ou "très mal") mais aussi à ceux qui voient mais ne peuvent naviguer comme une majorité des internautes.

Ce qui a été pris en compte pour l'accessibilité


Handicaps visuels, troubles de l'attention, troubles de la mémoire, daltonisme, handicap moteurs, difficultés liées à l'apréhension des nouvelles technologies.

En d'autres mots, je fais au mieux pour prendre en compte tout ce qui empêche d'avoir accès à l'information, que ce soit au niveau des yeux, du cerveau, du corps etc.
De par des adaptations spécifiques ainsi que par la simplification, la clarification de la façon dont sont mises en avant les informations et dont sont faites les fonctionnalités des sites que je créer.

Tout le monde à le droit d'avoir accès au même contenu !

Les critères d'accessibilité


Les images : Toutes les images du site ont un texte alternatif décrivant leur contenu et aucune d'entre elles ne contient une information indispensable à l'utilisation optimale du site.

Les couleurs : Il n'existe sur ce site aucune indication ou information qui soit données exclusivement par de la couleur. Il existe toujours un élément textuel pour cela.

Le contraste : Il a été travaillé pour être aussi optimal que possible. Le texte est majoritairement écrit en noir sur blanc. Quand ce n'est pas le cas, le contraste du texte à été doublé afin d'assurer une visibilité maximale.

Le texte : L'unité de mesure pour déterminer la taille du texte est "em". Cette unité permet au texte de s'adapter aux réglages de votre navigateur.

Scripts : Ce site a été conçu avec un usage strictement minimal de langages côté client, tel le javascript qui est l'un des plus courant. Cela veut dire que toutes les informations et fonctionnalités du site sont accessibles même si les scripts sont désactivés.

Pas d'Iframe : Aussi appelés cadres, ces frames nuisent à l'accessibilité d'une page, entre autres problèmes. Il n'y en a donc pas dans mes créations.

Liens : Tous les liens sont conçus pour être le plus explicite possible en dehors de leur contexte. L'un des intérêts est la navigation dans une liste de liens que récupère certains logiciels d'accessibilités afin de fluidifier la navigation au sein d'un site. De même pour la navigation clavier, qui permet d'aller de liens en liens sans suivre le contexte environnant.

Titres : L'information dans chaque page est structurée de la façon la plus claire possible, entre autre avec une utilisation sensée de la hiérarchie entre les titres au sein d'une même page (h1, h2, h3 etc.)

Listes : Les listes à puces sont numérotées, ce qui facilite le repérage en leur sein.

Mise en page : NeoWebTech utilise exclusivement le CSS3 pour la mise en page de ses sites. Voir le paragraphe sur les scripts concernant l'abscence de mise en page dynamique via javascript ou une autre solution équivalente.

Formulaires : Tout champ de formulaire est accompagné de son label permettant de donner du sens au champ en question et simplifiant son accès. En effet, le clic sur un label a le même effet qu'un clic sur le champ associé.

Navigation : Sur les sites créés par NeoWebTech vous aurez toujours la possibilité d'utiliser la navigation au clavier (via la touche de tabulation). Cette navigation est complétée par la présence de liens d'évitements qui permettent d'avoir accès à différentes parties du site de façon bien plus rapide en évitant certaines zones où la navigation est "ralentie". Imaginez par exemple un menu contenant cinquante liens. Eh bien grâce à un lien d'évitement vous pouvez avoir accès à ce qu'il y a après le menu sans avoir à utiliser la touche de tabulation cinquante fois ! En outre, concernant la navigation générale (au clavier ou non) vous avez la possibilité de revenir à l'accueil du site depuis n'importe quelle page et cela via le nom du site ou via le menu du site.

Affichage épuré : Une option est présente pour visualiser le site avec une mise en page minimale afin de permettre une navigation plus aisée en fonction des difficultés que vous pourriez rencontrer. Cette option est présente sous forme d'un lien qui est le premier élément du site après les liens d'évitements. Ce lien est visuellement reconnaissable à son image qui représente le logo du handicap visuel mais aussi par son texte "Affichage épuré".

Responsive design : A mon sens l'accessibilité passe également par l'accès à la mobilité. Lorsque même l'utilisation d'un ordinateur adapté devient complexe on peut préférer passer par un support moins contraignant comme une tablette tactile ou même un smartphone. Il devient alors impératif qu'un site internet puisse être lu correctement par un navigateur dit "mobile". D'abord c'est mieux pour tout le monde et ensuite cela permet aux synthèses vocales des smartphones de mieux fonctionner, d'indiquer plus clairement où on est dans une page etc. Un autre crtière d'accès via un smartphone est la quantité de données contenue dans une page. Il faut alors faire attention à la taille et à la qualité des images, à la quantité de texte, à la présence potentielle de scripts sur la page (voir une nouvelle fois le paragraphe dédié). Au jour d'aujourd'hui tout le monde ne peut pas avoir le dernier smartphone à la mode, et c'est encore plus vrai quand les personnes doivent prendre en compte leur handicap.

Le respect des standards : Il existe des standards permettant de normaliser le contenu d'une page internet. Dans l'absolu, il n'est pas obligatoire de les respecter pour qu'une page "fonctionne". On est plus vraiment obligé de les respecter pour le référencement non plus (tout dépend de la taille et de la visibilité du site). Cependant les respecter facilite souvent les phases de tests car en respectant ces standard on provoque moins de bugs. Les respecter facilite toujours le référencement. Enfin les respecter c'est aussi respecter l'utilisateur final et être sûr qu'il n'aura pas une bouillie infâme à son écran parce que le site a été codé avec les pieds et non avec la rigueur nécessaire à cela. Enfin un site qui ne respecte pas les normes existantes à très peu de chances d'être entièrement accessible en cas de handicap. Par exemple les lecteurs d'écrans se réfèrent à ces standards pour lire une page d'un site internet. Si les normes ne sont pas respectées ces lecteurs peuvent se mettre à lire le code html de la page en plus des informations qui y sont présentes. Ou même ne pas lire certaines informations alors qu'elles y sont présentes.

Pour conclure avec l'accessibilité

Il est vrai qu'il est très compliqué de penser à tout les handicaps existant, ou même à toutes les difficultés qu'elles soient liées à l'âge, au milieu social ou encore à un rejet des nouvelles technologies.

Pour NeoWebTech et mes autres créations je fais au mieux, en fonction de mes connaissances. Si par hasard vous rencontriez des difficultés à naviguer sur l'un des sites que j'ai créé vous pouvez utiliser le formulaire de contact présent sur la page d'acceuil de ce site pour m'en informer et me dire en quoi vous avez du mal et, si vous le savez, ce que je peux faire pour remédier à cela.
Ce serait un plaisir pour moi d'apprendre d'avantage comment aider les uns et les autres au travers d'un internet meilleur pour tous !