Introducción al artículo de Wulin.com (www.vevb.com): 10 Consejos de facilidad de uso para sitios web que todos pueden usar.
1. Agregue texto alternativo a su logotipo
Esto tiene dos beneficios: el lector de pantalla puede reconocer el significado de la imagen del logotipo, y cuando la imagen no está cargada, también puede indicar a los usuarios no discapacitados visualmente dónde está su logotipo.
Varios métodos:
<img src = logo.png alt = sitio web de enseñanza web>
O, si usa la imagen de fondo para implementar el logotipo, también puede agregar el atributo de título para implementarla:
<span title = Web Page Sitio web de enseñanza> </span>
Por supuesto, la imagen de enlace + de fondo es la mejor manera, pero también es mejor agregar el atributo de título:
<A Title = Web Teaching Network> Red de enseñanza web </a>
2. Agregar puntos de referencia básicos
Aria Landmark es un conjunto de reglas de usabilidad del sitio web definidas por W3C. Agregar un punto de referencia descriptivo a diferentes módulos del sitio web, o directamente llamado rol, es propicio para detectar el software de lectura para comprender mejor sus páginas web, para que los usuarios con discapacidad visual puedan usar mejor su sitio web.
<Nav rol = Navigation>
<div id = mainContent role = main>
<form de acción = search.php role = búsqueda>
3. Mejorar la definición de enfoque
De hecho, muchos sitios web intentarán todos los medios para eliminar el estilo de enfoque del navegador, especialmente para el navegador IE. De hecho, tiene sentido tener el navegador con el enfoque predeterminado. Puede indicar dónde está el enfoque actual del mouse del usuario. Esto es especialmente importante para la transmisión de teclado.
Así que por favor no elimine el estilo de enfoque. Incluso si cree que el estilo predeterminado no es guapo o inconsistente (es decir, es una caja punteada, WebKit es una caja sólida resaltada y Safari es azul, Chrome es naranja) También puede definir un color destacado usted mismo:
A: Focus {
Esquema: 1px de rojo sólido;
Antecedentes: amarillo;
}
Si su gerente de producto o diseñador visual insiste en eliminar el estado de enfoque, simplemente quítate el mouse por un día y dígale que solo puede usar la pestaña para cambiar los enlaces. . .
4. Defina los elementos de formulario requeridos
Use el atributo requerido ARIA para definir los elementos requeridos en el formulario; bueno, es principalmente para indicar el software de lectura de pantalla:
<input type = text name = username aria-required = true>
5. Agregue un H1 a su página
La razón es simple, no solo para SEO, sino también para la usabilidad general y la legibilidad del sitio web. Además, ¿no tienes obsesión por código?
6. Defina el encabezado de la tabla
Por lo general, muchas personas están acostumbradas a usar etiquetas TD para todas las formas. De hecho, las tablas no solo tienen etiquetas HD, sino también th, col, alcance, etc.
Así que simplemente, cambie el encabezado a la etiqueta TH:
<th scope = col> date </th>
7. Defina la descripción de la tabla
No simplemente agregue una P delante de/después de la mesa. La tabla tiene una etiqueta de subtítulos dedicada, como una imagen.
<Table>
<tittition> Horario de clases </tittion>
<tr>
...
8. Evite hacer clic aquí
Aunque dicha descripción del enlace no es importante para las personas comunes, es bastante malo para el software de lectura de pantalla. En realidad, es una interferencia a los usuarios con discapacidad visual.
Entonces, solo use el enlace en el lugar correcto.
9. Eliminar tabindex
Érase una vez, muchas personas usaron Tabindex para mejorar la experiencia del usuario, pero este atributo interrumpiría el orden de lectura normal de la página, que es desastroso para los usuarios con discapacidad visual, y puede no ser amigable con los usuarios comunes.
Así que no abuses del atributo Tabindex.
10. Compruébalo en línea
Bueno, cuando vi esto, descubrí que en realidad era un anuncio, pero si se puede detectar el problema de usabilidad del sitio web, también es algo bueno. Una herramienta web desarrollada por WebAim la detectará automáticamente ingresando la URL. Probado fue bastante bueno.