Accessibility is the degree to which a website is available to as many people as possible. L'accessibilité permet de concevoir un site consultable par un maximum d'utilisateurs possible.
Is it because it’s too hard, and there’s too much to think about? Estce parce que c'est difficile et qu'il faut prendre en compte beaucoup plus de paramètres?
Design decisions made in the name of accessibility will largely benefit everyone. Un design conçu en prenant en compte l'accessibilité profitera largement au plus grand nombre.
Améliorer l'accessibilité a doublé les ventes d'assurancevie en ligne pour Legal & General http://www.wsi-ic.com/PConnolly/FileContent/improve_website.pdf Improvements in accessibility doubled Legal and General’s life insurance sales online
Améliorer l'accessibilité a augmenté les livraisons à domicile de l'épicerie en ligne Tesco de 16 millions € en 2005 http://www.wsi-ic.com/PConnolly/FileContent/improve_website.pdf Improvements in accessibility increased Tesco’s grocery home delivery sales by £13M in 2005
http://www.wsi-ic.com/PConnolly/FileContent/improve_website.pdf Improvements in accessibility increased Virgin.net sales by 68% Améliorer l'accessibilité a augmenté les ventes de Virgin.net de 68%
1. Make text content easy to read. 2. Ensure sensible font sizes. 3. Don’t prevent the user from resizing the fonts themselves in the browser. 1. Rendez le texte facile à lire. 2. Assurezvous que la taille des polices soit suffisante. 3. N'empêchez pas le redimensionnement des polices par l'utilisateur dans le navigateur
Good copy is a part of good accessibility. Keep your text simple and your meaning clear. Un texte bien écrit fait partie de l'accessibilité. Gardez votre texte simple et facilement compréhensible
1. Use colour contrast tools to ensure your text is high- contrast enough. 2. Beware of super-high contrast too. 1. Vérifiez que votre texte a suffisamment de contraste avec les outils de mesure de contraste de couleur adéquats 2. Méfiezvous également des contrastes très élevés.
Voici un titre de niveau supérieur Voici un paragraphe avec du texte à l'intérieur. Il est long de quelques phrases, beaucoup de paragraphes se présentent sous cette forme. Voici un titre de niveau 2 Voici un paragraphe qui contient quelques liens vers d’autres contenus, ainsi qu'un bouton qui permet d'effectuer une action.
Voici un titre de niveau supérieur Voici un paragraphe avec du texte à l'intérieur. Il est long de quelques phrases, beaucoup de paragraphes se présentent sous cette forme. Voici un titre de niveau 2. Voici un paragraphe qui contient quelques liens vers d’autres contenus, ainsi qu'un bouton qui permet d'effectuer une action
Randomly enlarging and colouring text does not make a hierarchy. Agrandir ou colorer son texte de manière anarchique ne permet pas de créer une hiérarchie
1. Make the content structure clear and consistent. 2. Use semantic headings, labels, lists and other relevant elements for your HTML or native controls. 1. Créez une structure de contenu claire et constante. 2. Utilisez des titres sémantiques, des labels, des listes et tous les autres éléments qui seront pertinents avec votre HTML ou contrôles natifs
Sometimes the links are the same colour and style as the rest of the text and you only find out it’s a link when you hover over it. Les liens sont parfois de la même couleur et avec un style similaire au reste du texte si bien que l'on ne se rend compte que c'est un lien qu'une fois qu'il est survolé
Sometimes the links are the same colour and style as the rest of the text and you only find out it’s a link when you hover over it. Les liens sont parfois de la même couleur et avec un style similaire au reste du texte si bien que l'on ne se rend compte que c'est un lien qu'une fois qu'il est survolé.
1. Make buttons and interactive elements easyily distinguishable from non-interactive elements. 2. Make links easy to recognise by using an underline. 1. Faites en sorte que les boutons et éléments cliquables se distinguent des autres éléments non interactifs 2. Rendez les liens facilement identifiables en les soulignant
1. Use link text that makes sense out of context. Don’t use “click here”. 2. Remember that not all your users are clicking. 1. Utilisez des ancres de lien qui ont une signification même hors contexte. N'utilisez pas "Cliquez ici". 2. Souvenezvous que tous vos utilisateurs ne cliquent pas.
Provide text alternatives for images that helps a user understand the context of the image. Proposez des alternatives textuelles pour les images qui aideront les utilisateurs à comprendre le contexte de l'image
No, I don’t want to listen to your podcast or watch your video tutorial. Give me text! Non je ne veux pas écouter votre podcast ou regarder votre tutoriel vidéo. Donnezmoi du texte!
1. Provide text transcripts for audio. 2. Provide subtitles for video. 1. Proposez des transcriptions textuelles pour les média audio. 2. Proposez des soustitres pour les vidéos.
1. Use JavaScript with care and load it in a sensible place. 2. If your web site or app needs JavaScript, ensure you use WAI ARIA to guide assistive technologies. 1. Utilisez le JavaScript avec précaution et chargezle de manière appropriée 2. Si votre site ou application a besoin de JavaScript pour fonctionner, assurezvous d'utiliser WAI ARIA pour que ce soit reconnaissable et utilisable par les technologies d'assistance
The days of flash are over, stop punishing me with your artsy navigation. Les jours de gloire de Flash sont terminés, arrêtez de me punir avec votre navigation fantaisiste
Provide consistent ways to help users navigate, find content, and determine where they are. La manière pour l'utilisateur de naviguer, de trouver du contenu et de savoir où il se trouve doit être cohérente tout au long du site
1. Give users enough time to read and use content 2. Try not to distract users from their goals with unstoppable animations 1. Donnez aux utilisateurs suffisamment de temps pour lire et utiliser les contenus 2. Essayer de ne pas distraire les utilisateurs de leur but final avec des animations qu'ils ne pourront arrêter
Consider accessibility at every point of planning. It is functionality, content hierarchy, copy, visual design and code. Prenez en compte l'accessibilité à chaque étape du planning : des fonctionnalités au code en passant par la hiérarchie des contenus, le texte et la charte graphique.
Accessibility is easy to consider once you start caring about it. L'accessibilité est très facile à prendre en compte dans un projet à partir du moment où l'on commence à s'en soucier.