- Elaborado con apuntes del curso Introduction to UX and Accessible Design de UAL Creative Computing Institute.
W3Schools es una plataforma de recursos, desarrollada por el World Wide Web Consortium (W3C), para mostrar las mejores prácticas y las últimas tendencias en diseño web o tecnologías de lenguaje de programación.
La herramienta agrupa información fundamental y prácticas sobre cómo usar y proporcionar los medios para que las personas prueben cualquier código, con el propósito de verificar que cumplan con los estándares del W3C.
Artículo relacionado: Desde la accesibilidad, ¿cuál es tu experiencia digital?
En esencia, y un elemento fundamental del diseño de interfaces de usuario y el desarrollo de sitios web accesibles, es comprender las Directrices de Accesibilidad al Contenido en la Web (WCAG) y la Iniciativa de Accesibilidad a la Web (WAI) del W3C.
WCAG son las pautas establecidas por el W3C. Estas son estándares globales que demuestran lo que se necesita para construir un sitio web accesible.
Artículos relacionados: La importancia de la accesibilidad en la experiencia de usuario
WAI proporciona una gran cantidad de información integral sobre protocolos para promover la evolución de la WWW, al tiempo que garantiza que las partes interesadas y los profesionales se mantengan dentro de las pautas de WCAG.
Como creativos digitales, es una buena práctica cumplir y aplicar estos estándares a su enfoque de diseño y desarrollo.
Los sitios web que cumplen totalmente con WCAG y WAI benefician a todos.
Todos deben cumplir con las pautas y practicar el uso del etiquetado para los elementos esenciales que son componentes de una página web.
Esto es importante porque garantiza que los navegadores y las ayudas de asistencia, como los lectores de pantalla, funcionen sin problemas.
W3Schools establece cómo puede hacer esto con una serie de guías simples, que incluye lo siguiente:
1. HTML semántico:
El HTML semántico simplemente permite a los codificadores o desarrolladores dar nombres a los componentes a medida que los identifica. Por ejemplo, un botón que proporciona funciones como “Agregar a la papelera” o “Acepto” debe etiquetarse simplemente como <button>, por ejemplo:
<button>Agregar a la papelera</button>
La aparición de HTML5, junto con otros desarrollos más recientes, significa que ya no es necesario para un programador usar códigos excesivamente largos e innecesariamente complejos para designar la operabilidad del botón diferente. Es más fácil para los navegadores modernos reconocer y comprender los nuevos términos de lenguaje más simples.
2. Las etiquetas de cabecera:
Se define con la etiqueta <h1> y hasta la <h6>, lo que permite el control de los elementos de una página web.
El uso de la etiqueta Encabezado le permite estructurar la navegación y muestra la estructura del documento y las relaciones entre las diferentes secciones.
<h1> Los encabezados deben usarse para los títulos principales, seguidos de los <h2>, luego los menos importantes <h3>, y así sucesivamente. La <h1> solo de utiliza una vez.
3. Texto alternativo o atributo ALT
El uso de texto alternativo proporciona información adicional o descripción de un objeto en la página web. Un ejemplo sería una fotografía.
Un lector de pantalla proporciona una descripción de la fotografía para aquellos que no puedan verla. Por ejemplo, una foto de un gol de Messi tendría el siguiente atributo descriptivo:
<img src=“messi-gol.jpg” alt=“El golazo de Messi”>
4. El atributo Idioma:
Permite que los sitios web con capacidades multilingües y alcance global atiendan adecuadamente para las audiencias que hablan diferentes idiomas.
Sitios como Apple, Netflix y Amazon ofrecen esta función, por ejemplo:
<html lang=“es”>
5. Lenguaje claro:
Es esencial tomar las medidas necesarias para garantizar que la redacción utilizada sea entendida por las audiencias. Es evitar es escribir abreviaturas no universales.
Una buena práctica es usar siempre la palabra completa.
Al igual que los lectores de pantalla, la redacción puede dificultar su experiencia ya que los sistemas de información no podrán leerlos con claridad.