Articles TYPO3

le

La problématique de l'accès d'un site web aux personnes handicapées et aux séniors est un vaste sujet trop souvent écarté. Pourtant intégrer les standards de l'accessibilité n'est pas très compliqué et s'avère bénéfique pour les sites faisant l'effort.

accessibilité handicap typo3

Le handicap sur internet peut avoir plusieurs formes : malvoyants, aveugles, malentendants, sourds, paralysie moteur... Chacun de ces handicaps peut limiter la navigation sur votre site web. Les prendre en compte en adoptant les normes W3C ou WAI permettrait d'offrir à ces utilisateurs une vrai expérience de navigation sur votre site internet.

Que ce soit pour un site vitrine, un site d'information ou un site e-commerce... rendre votre site accessible peut avoir de nombreux avantages. Bien sur vous pouvez toucher une plus large audience, vous montrez votre sensibilité au handicap et... vous améliorez votre référencement naturel. Depuis plusieurs années l'algorithme de Google prend en compte l'accessibilité des sites pour établir son page rank. Ce n'est d'ailleurs pas surprenant puis que les robots se comportent un peu comme une personne non-voyante et « lis » votre site grâce aux méta-données de votre site.

 

Structurer ses pages

La première étape pour rendre votre site accessible est de bien structurer vos pages. Un utilisateur « valide » va scanner la page et la lire en diagonale pour arriver sur la partie qui l'intéresse. Une personne handicapée a besoin d'une structure de page pour faire ça. Il est donc important d'avoir un vrai titre de page, une méta-description pertinente et pas seulement remplie de mots-clés. Il est aussi très important de bien coder vos méta-données pour donner des informations sur la page : date de création, auteur... Et bien évidemment il indispensable d'organiser le contenu de vos pages en utilisant les en-têtes h1,h2... dans le corps du texte.

 

Mettre des liens d'évitement

Les liens d'évitement permettent de faciliter la navigation sur le site internet. Les plus connus sont « Aller au menu » ou encore « remonter en haut de la page ». Ils sont très facile à mettre en place puisqu'il s'agit simplement d'ancres. Ces ancres sont particulièrement utile lors de la navigation sur le site avec des tabulations. Ils permettent de passer de lien en liens plus facilement. Dans TYPOScript vous pouvez aussi les configurer pour faciliter leur intégration par la suite :

 

// Lien d'évitement lib.evitement = TEXT lib.evitement { value = Aller au menu principal typolink.parameter = #menu-principal typolink.ATagParams = class="evitement" }

Par la suite il vous suffira d'intéger les liens comme suit : < a class="evitement" href="#menu-princial">Aller au menu principal<a>

 

Avoir un Sitemap

Le plan du site est très important pour l'accessibilité de votre site. Il donne une structure complète de votre site et permet d'accéder directement à un contenu recherché. Au delà de l'objectif d'accessibilité de votre site, mettre en place votre sitemap va aussi vous permettre de mieux référencer vos pages en indiquant aux robots toutes les pages qui existent. Faciliter la vie des personnes handicapées c'est aussi faciliter le travail des robots ;)

A ce sujet, pensez à définir des titres et des noms explicites pour vos menus. Evitez donc les jeux de mots et autres figures de styles dont vous seul avez le secret. Cela servira aussi pour votre référencement naturel.

 

Utiliser un fil d'Ariane

Le fil d'ariane, en référence à la mythologie grecque (ou Breadcrumb pour le petit poucet en anglais), est une aide à la navigation qui permet de garder une trace de l'emplacement de vos visiteurs à l'intérieur du site. Par exemple : Accueil>Catalogue>categorieA>Produit2. Vous indiquez à vos visiteurs le chemin parcouru et vous leur permettez ainsi de revenir en arrière sans repasser par toutes les étapes précédentes.

Pour plus d'informations sur la façon d'intégrer les Breadcrumb vous pouvez visiter ce tuto.

 

Naviguer avec le clavier

La navigation au clavier est un usage à intégrer lors de la réalisation de votre site web, car beaucoup de personnes l'utilise pour aller de lien en lien. C'est notamment le cas pour naviguer dans le menu-principal ou encore pour suivre les liens internes et externes à votre site. Sachez également que beaucoup de « valides » utilisent aussi cette méthode, notamment avec la démocratisation des netbook et autres laptops. La tabulation est largement utilisée dans les formulaires par exemple.

Prenez aussi en compte les raccourcis claviers traditionnels pour rendre plus fluide la navigation sur votre site et donner accès à des fonctionnalités.

 

Décrire les images et vidéos

Vous illustrez certainement vos articles et pages avec de belles images très parlantes comme une infographie ou un schéma... mais pensez-vous à décrire cette image autrement que par la balise alt="schema" ? Il est très important de bien décrire vos éléments graphiques afin de permettre aux malvoyants de lire votre image. Cette balise n'est une simple contrainte imposée par les moteurs de recherche.

Pour les vidéos vous pouvez aussi ajouter de l'audio-description, mais ce n'est pas toujours évident. Décrire la video et résumer le contenu est déjà un bon début. Il existe des extensions pour ça, mais cela nécessite d'héberger soit-même sa video. Sur Youtube, Vimeo ou DailyMotion il ne semble pas possible de remplacer la vidéo par du texte. Mais vous pouvez développer le contenu dans un paragraphe sous la vidéo par exemple.

 

Augmenter/Diminuer la taille du texte

Il existe des extensions TYPO3 pour gérer cette fonctionnalité, a vous de choisir celle avec laquelle vous êtes le plus à l'aise. C'est important de permettre de grossir la taille de vos textes, car de nombreuses personnes, notamment agées, ont besoin de ça pour lire. Par ailleurs cela permet aussi de ne pas altérer la qualité de vos images et la mise en page de votre site, contrairement à un grossissement classique de la page. Evitez aussi les textes "en défonce" (blanc sur fond noir) qui sont peu lisibles même par des personnes n'ayant pas de gros problèmes de vue.

 

Vous l'avez compris rendre son site accessible aux handicaps n'est pas très compliqué mais nécessite tout de même de bien penser à tous les usages. Pour ceux d'entre-vous qui n'arrivez pas bien a cerner les besoins, vous pouvez vous référer aux normes W3C qui intègrent les besoins principaux. Et pour les plus sceptiques qui ne voient pas bien l'intérêt de ces efforts pour une minorité de visiteurs... rassurez-vous en pensant à votre référencement naturel qui va profiter de ces améliorations.

 

 
 

Commentaires

Soyez le premier à laisser un commentaire


Agenda

Aucune nouveauté dans cette rubrique

Derniers billets de blog

Joshua
Joshua
, vendredi 20 janvier 2017
Aujourd'hui, on peut voir une diffusion sans précédent de l'enseignement pour les étudiants de partout dans le monde.
Joshua
Joshua
, vendredi 20 janvier 2017
Aujourd'hui, on peut voir une diffusion sans pr&eacute;c&eacute;dent de l'enseignement pour les &eacute;tudiants de partout dans le monde. Comme il a &eacute;t&eacute;...
madeincity
madeincity
madeincity
, dimanche 15 janvier 2017
Nous vous proposons une liste exhaustive des destinations à visiter lors de votre prochain séjour au Maroc. Appuyez ici vite pour plus d'informations !

Quel CMS choisir ?

Quizz cmsAccédez au quizz pour découvrir quel CMS correspond le mieux à votre projet web. 

 

Offres d'emploi

vendredi 20 janvier 2017
vendredi 20 janvier 2017
vendredi 20 janvier 2017
vendredi 20 janvier 2017

Pub adSense

Créez votre compte

Rejoignez la communauté de CMS.fr

Bénéficiez d'un accès complet au site, Publiez vos articles et références, Diffusez vos événements, Participez à la vie du forum, Commentez les articles et Créez votre propre blog pour partager vos connaissances des CMS.

La création du compte est simple, rapide et GRATUITE.

Créez votre compte

A propos

CMS.fr est un site d'information dédié aux dernières actualités des CMS et des logiciels de gestion de contenu web.

Retrouvez les dernières news, les modules et extensions indispensables et les comparatifs des meilleurs CMS du marché comme Wordpress, Joomla, e-majine, Drupal et Prestashop.

Suivez-nous ! 

icone facebookicone google plusicone twittericone RSS