Introduction de l'article de wulin.com (www.vevb.com): 10 Conseils de facilité d'utilisation pour les sites Web que tout le monde peut utiliser.
1. Ajoutez du texte alternatif à votre logo
Cela présente deux avantages: le lecteur d'écran peut reconnaître la signification de l'image du logo, et lorsque l'image n'est pas chargée, elle peut également indiquer aux utilisateurs non visuels où se trouve votre logo.
Plusieurs méthodes:
<img src = logo.png alt = site Web d'enseignement Web>
Ou, si vous utilisez l'image d'arrière-plan pour implémenter le logo, vous pouvez également ajouter l'attribut de titre pour l'implémenter:
<span title = site Web d'enseignement de la page Web> </span>
Bien sûr, l'image Link + Background est la meilleure façon, mais il est préférable d'ajouter également l'attribut de titre:
<un titre = réseau d'enseignement Web> réseau d'enseignement Web </a>
2. Ajouter des repères de base
Aria Landmark est un ensemble de règles d'utilisation du site Web définies par W3C. L'ajout de monument descriptif à différents modules du site Web - ou directement appelé rôle, est propice à l'écran de lecture de logiciels pour mieux comprendre vos pages Web, afin que les utilisateurs malvoyants puissent mieux utiliser votre site Web.
<role de navigation = navigation>
<div id = MainContent Role = Main>
<form form = search.php role = search>
3. Améliorer la définition de focus
En fait, de nombreux sites Web essaieront tous les moyens de supprimer le style de mise au point du navigateur, en particulier pour le navigateur IE. En fait, il est logique d'avoir le navigateur avec le foyer par défaut. Cela peut indiquer où se trouve la mise au point actuelle de la souris de l'utilisateur. Ceci est particulièrement important pour le streaming du clavier.
Veuillez donc ne pas supprimer le style: Focus. Même si vous pensez que le style par défaut n'est pas beau ou inconscient (c'est-à-dire une boîte en pointillés, WebKit est une boîte solide surlignée, et Safari est bleu, Chrome est orange), vous pouvez également définir une couleur de surbrillance vous-même:
A: Focus {
Aperçu: 1px rouge solide;
Contexte: jaune;
}
Si votre chef de produit ou votre concepteur visuel insiste pour supprimer l'état de mise au point, retirez simplement votre souris pendant une journée et dites-lui que vous ne pouvez utiliser que l'onglet pour changer de lien. . .
4. Définir les éléments de formulaire requis
Utilisez l'attribut requis à Aria pour définir les éléments requis dans le formulaire - eh bien, il s'agit principalement de dire au logiciel de lecture d'écran:
<input type = text name = username aria-required = true>
5. Ajoutez un H1 à votre page
La raison est simple, non seulement pour le référencement, mais aussi pour la convivialité et la lisibilité globales du site Web. De plus, n'avez-vous pas d'obsession de code?
6. Définissez l'en-tête de la table
Habituellement, de nombreuses personnes ont l'habitude d'utiliser des balises TD pour toutes les formes. En fait, les tables ont non seulement des balises HD, mais aussi th, col, portée, etc.
Donc, mettez simplement, changez l'en-tête en étiquette TH:
<th Scope = Col> Date </th>
7. Définir la description du tableau
N'ajoutez pas simplement un P devant / après la table. La table a une balise de légende dédiée, tout comme une image.
<ballage>
<genture> Horaire de classe </pention>
<tr>
...
8. Évitez de cliquer ici
Bien qu'une telle description de lien n'ait pas d'importance pour les gens ordinaires, il est assez mauvais pour les logiciels de lecture d'écran. Il s'agit en fait d'une interférence pour les utilisateurs malvoyants.
Alors, utilisez simplement le lien au bon endroit.
9. Supprimer Tabindex
Il était une fois, de nombreuses personnes ont utilisé Tabindex pour améliorer l'expérience utilisateur, mais cet attribut perturberait l'ordre de lecture normal de la page, qui est désastreux pour les utilisateurs malvoyants et peut ne pas être amical avec les utilisateurs ordinaires.
Alors n'abusez pas de l'attribut tabindex.
10. Vérifiez-le en ligne
Eh bien, quand j'ai vu cela, j'ai trouvé que c'était en fait une publicité, mais si le problème de l'utilisabilité du site Web peut être détecté, c'est aussi une bonne chose. Un outil Web développé par Webaim le détectera automatiquement en entrant dans l'URL. Testé c'était plutôt bien.