Millones de personas en todo el mundo tienen una discapacidad que afecta la forma en que utilizan Internet. Dado que la pandemia de coronavirus sigue aumentando la necesidad de compras en línea fáciles, pedidos de alimentos e incluso servicios de atención médica remotos, la accesibilidad web es más importante que nunca. 

Esta guía de accesibilidad web analiza qué es la accesibilidad, por qué es importante y cómo hacer que los sitios web de WordPress sean accesibles, incluida la identificación de problemas comunes mediante pruebas.

Hombre con discapacidad visual escucha su teléfono

En este artículo, cubriremos:


¿Qué es la accesibilidad web?

En pocas palabras, los sitios web accesibles son sitios web que pueden ser utilizados por todas las personas, incluidas las personas que pueden no interactuar con la web a través de una configuración típica de teclado y mouse, y aquellos que tienen una variedad de diferencias intelectuales o físicas.

Se deben incorporar características específicas en los sitios web para que sean utilizables y comprensibles para las personas con discapacidades. Las discapacidades auditivas, visuales, cognitivas, motoras o de aprendizaje requieren adaptaciones y modificaciones del sitio web para que sean utilizables. Dependiendo de su situación, las personas con discapacidades utilizan varios dispositivos de asistencia, como lectores de pantalla , para acceder a los sitios web.

Los diseñadores y desarrolladores web deben asegurarse de que el contenido y la funcionalidad de sus sitios web sean perceptibles, operables, comprensibles y sólidos ( POUR ), lo que significa que todas las personas pueden acceder y comprender el contenido y la funcionalidad en todos los dispositivos.

Algunos ejemplos de funciones que hacen que los sitios web sean más accesibles incluyen:

  • subtítulos y transcripciones para archivos de audio y video
  • texto alternativo en imágenes
  • omitir enlaces para ayudar con la navegación con el teclado 
  • Contraste de color apropiado para hacer el texto más legible.

Por qué es importante la accesibilidad

La accesibilidad del sitio web tiene un impacto en todos los que usan la web. Si sus sitios web o los de sus clientes son accesibles, esto garantiza que todos tengan el mismo acceso a la información en línea, las necesidades, el entretenimiento, las compras y más, independientemente de su capacidad. 

Pero la accesibilidad del sitio web no se trata solo de buen karma; también tiene efectos en el mundo real sobre las clasificaciones de los motores de búsqueda, las nuevas ventas y los visitantes del sitio web, las complicaciones legales y la imagen de marca. 

Ranking de motores de búsqueda

Hacer correcciones de accesibilidad puede mejorar la clasificación de los motores de búsqueda de un sitio web. Muchas funciones de accesibilidad, como texto alternativo en imágenes y contenido estructurado correctamente con encabezados, ayudan tanto a la accesibilidad como a la optimización de motores de búsqueda (SEO). Una clasificación más alta en una página de resultados de búsqueda puede aumentar la visibilidad con nuevos clientes o clientes, lo que genera un mayor tráfico en el sitio web, conversiones, suscriptores de blogs o boletines, y más. 

Aumento de ventas

El CDC afirma que, a partir de 2018, 1 de cada 4 europeo tiene una discapacidad . Los europeos discapacitados gastaron anualmente más de $ 200 mil millones en gastos discrecionales en línea. Las funciones de accesibilidad permiten que más personas encuentren y utilicen sitios web, lo que aumenta la oportunidad de obtener nuevas ventas, conversiones y clientes habituales. Cuando muchos sitios web no son accesibles en el mundo actual, cualquier sitio web accesible estará muy por encima de la competencia.

Es legalmente requerido

Todos los sitios web deben cumplir con los estándares de accesibilidad web establecidos en la Ley de Estadounidenses con Discapacidades (ADA). Bajo la ADA, se ha establecido un precedente legal que establece sitios web como lugares de alojamiento público. Esto significa que los sitios web comerciales, que son esencialmente sus escaparates digitales, deben ser accesibles de la misma manera que el edificio de una empresa física debe ser accesible. 

Los sitios web de agencias gubernamentales locales, estatales y federales y cualquier sitio web de organizaciones y proyectos financiados con fondos federales también deben cumplir con los estándares de la Sección 508 . Además, existe una variedad de leyes estatales e internacionales que requieren que los sitios web sean accesibles. 

Si un sitio web no cumple con los requisitos de accesibilidad establecidos en estas pautas, la organización puede correr el riesgo de una demanda o, en algunos casos, una multa del gobierno. Según Usablenet , en 2020, se presentaron 3.550 demandas de accesibilidad de sitios web en los Estados Unidos. Mantener el cumplimiento legal es una parte importante de hacer negocios, y tener un sitio web accesible es una forma en que las empresas pueden cumplir con sus obligaciones legales.

Imagen de marca

Las empresas y organizaciones sin fines de lucro que toman medidas para hacer que sus sitios web de WordPress sean más accesibles muestran que están practicando la responsabilidad social y afirman que quieren hacer de Internet un lugar para todos. Un compromiso organizacional con la accesibilidad muestra a las personas que se preocupan por ellas de una manera profundamente humana, lo que genera lealtad y puede elevar la imagen de la marca. 


¿Cuáles son algunos problemas de accesibilidad comunes?

Si desea asegurarse de que los sitios web que crea o administra sean accesibles, comience por verificar estos problemas:

Texto alternativo faltante o de baja calidad

El texto alternativo es lo que utilizan los lectores de pantalla para describir el contenido o el propósito de una imagen para las personas ciegas. Si el texto alternativo se deja vacío, un lector de pantalla lo saltará por completo o puede leer el nombre del archivo de la imagen en su lugar, lo cual no es útil cuando el nombre del archivo es una cadena de números o no describe la apariencia. Sin un texto alternativo adecuado, los usuarios ciegos y con discapacidad visual no tendrán contexto o comprensión de una imagen. 

El texto alternativo de baja calidad es problemático porque no describe la imagen con precisión o es demasiado detallado y puede causar confusión. Palabras y frases como “imagen”, “imagen”, “gráfico de”, “imagen de” no necesitan agregarse al texto alternativo porque el lector de pantalla anunciará que hay una imagen o gráfico presente.

Si tiene un texto alternativo que tiene más de 125-150 caracteres, algunos lectores de pantalla cortarán y dejarán de leer. Agregar puntos dentro del texto alternativo puede hacer que los lectores de pantalla se detengan, lo que podría confundir a los oyentes o hacerles creer que el texto alternativo ha terminado.

Contraste de color insuficiente

En el diseño web, el contraste de color se refiere a la medida de brillo entre el color de fondo y los elementos de color como texto, botones o iconos. Los colores de fondo y primer plano deben tener una proporción de 4.5: 1 para que el texto de tamaño estándar se considere suficiente. Puede probar su contraste de color ingresando los códigos hexadecimales de ambos colores en un verificador de contraste de color gratuito .

Texto de anclaje ambiguo

El texto de anclaje es una palabra o un grupo de palabras en las que se puede hacer clic en una página web. Hacer clic en el texto de anclaje puede llevarlo a un nuevo sitio web, descargar un documento, abrir una imagen o un video en una nueva pestaña. El texto de anclaje se considera ambiguo si no tiene sentido fuera de contexto o no describe el propósito del enlace. Algunos ejemplos de texto de anclaje ambiguo incluyen «enlace», «haga clic aquí», «obtenga más información» o «continuar». Al agregar enlaces al contenido, es esencial que, si alguien escucha solo el enlace de forma independiente (sin nada del texto que lo rodea), sepa a dónde apunta el enlace o qué sucederá cuando se haga clic en el enlace.

Faltan subtítulos y transcripciones

Los subtítulos toman contenido hablado y no hablado, como efectos de sonido, música o risas de un video, y lo describen mediante texto. Aparecen en la pantalla durante un video, por lo que los usuarios sordos y con problemas de audición pueden entender lo que está sucediendo en el video. Además, los subtítulos deben coincidir con la sincronización del video. Es importante tener en cuenta que los subtítulos deben ser precisos; Es necesario comprobar la precisión de los subtítulos generados automáticamente.

Una transcripción es un registro escrito de lo que se dice en un clip de audio o durante un video. Las transcripciones proporcionan un medio secundario para comprender el contenido de video o los archivos de audio. Deben usarse junto con los subtítulos en un video para que las personas puedan leer la transcripción en lugar de ver el video. Esto es importante porque no todos los usuarios pueden leer los subtítulos. Las transcripciones también brindan la ventaja de ser fácilmente traducidas a otros idiomas y pueden ayudar al SEO.  


Prueba de accesibilidad de sitios web de WordPress

La mejor manera de probar la accesibilidad de los sitios web es realizar una combinación de pruebas automáticas, manuales y de usuario. 

Pruebas de accesibilidad automatizadas

Las pruebas de accesibilidad automatizadas se realizan con herramientas de escaneo de IA. Existen muchas herramientas gratuitas y de pago que pueden ofrecer una variedad de funciones de escaneo de accesibilidad. Al elegir una herramienta automatizada, aquí hay algunas cosas que debe tener en cuenta:

  • El tamaño del sitio web. Si tiene un sitio web más pequeño, una herramienta gratuita puede funcionar para usted. Si tiene un sitio web más grande, como un sitio con un blog o una sección de comercio electrónico con miles de publicaciones, es probable que una herramienta paga sea más apropiada.  
  • Cuánto apoyo necesitas. Si necesita ayuda para encontrar errores de accesibilidad en su sitio web para poder corregirlos, las herramientas gratuitas pueden ser una excelente opción. Si necesita ayuda para comprender los errores de accesibilidad o desea que otra persona los corrija, intente encontrar una herramienta con opciones de soporte integradas u ofrecidas por los desarrolladores. Tener soporte disponible es clave si es nuevo en la corrección de accesibilidad.
  • Experiencia de usuario. Algunas herramientas de accesibilidad automatizadas se pueden utilizar directamente en su sitio web, por ejemplo, a través de una extensión del navegador o dentro del panel de WordPress. Otras herramientas requieren que utilice una interfaz que es completamente independiente de su sitio web. Si desea ver errores de accesibilidad mientras trabaja en su sitio web, elija una herramienta que ofrezca informes en el sitio. Esto le facilita verificar continuamente la accesibilidad de su sitio web mientras edita el contenido del sitio. 

Dos herramientas gratuitas populares que se pueden utilizar en cualquier sitio web son WAVE y Axe . Estas herramientas tienen extensiones de Chrome y Firefox disponibles para probar URL individuales, una a la vez, y planes pagados que permiten pruebas masivas y funciones adicionales.

Complemento de WordPress Accessibility Checker

Si desea ejecutar escaneos de accesibilidad masivos y ver informes en el panel de WordPress, el complemento Verificador de accesibilidad de WordPress es la mejor herramienta. Puede descargar la versión base del complemento de forma gratuita en WordPress.org .

El comprobador de accesibilidad para el complemento de WordPress

El Comprobador de accesibilidad escanea páginas y publicaciones en busca de errores de accesibilidad o problemas potenciales y los muestra directamente en la pantalla de edición de esa página o publicación. Estos informes en la página son útiles no solo para verificar si el sitio web es accesible en primer lugar, sino también para monitorear la accesibilidad continua.

Captura de pantalla de las pruebas en ejecución del complemento Accessibility Checker

El Comprobador de accesibilidad ejecuta más de 40 comprobaciones diferentes, incluso para los problemas comunes identificados anteriormente. La versión gratuita escanea publicaciones y páginas, y la versión Pro incluye escaneos completos del sitio de tipos de publicaciones personalizadas y páginas de archivo. Los elementos marcados o revisados ​​incorrectamente pueden descartarse, lo que permite realizar un seguimiento de las correcciones de accesibilidad a medida que se realizan a lo largo del tiempo. Es una gran herramienta para agencias, desarrolladores y usuarios de WordPress por igual.

Prueba manual

Desafortunadamente, los escaneos automatizados no pueden identificar todos los problemas de accesibilidad en un sitio web; algunos problemas solo pueden ser determinados por un ser humano que experimente el sitio web. Después de probar el sitio web con una herramienta automatizada como Accessibility Checker, luego realice pruebas manuales para asegurarse de que todas las personas puedan usarlo sin importar qué dispositivo estén usando.

El primer paso en una prueba de accesibilidad manual es confirmar que los usuarios pueden navegar completamente con solo un teclado. Vaya a la parte frontal del sitio web y use la pestaña y las teclas de flecha para moverse por el sitio, asegurándose de no perder su lugar a medida que avanza y de que puede usar todas las partes del sitio web. 

Después de la prueba del teclado, puede pasar a la prueba del lector de pantalla. Los lectores de pantalla son un tipo de software de tecnología de asistencia que utilizan las personas ciegas y con discapacidad visual para comprender el contenido web. Si tiene una Mac, puede usar el software VoiceOver que está integrado en su computadora. Si no tiene una Mac, puede descargar el lector de pantalla de código abierto gratuito NVDA o comprar el popular lector de pantalla JAWS . Es una buena práctica probar su sitio web con dos o más lectores de pantalla, ya que no todos los lectores de pantalla dicen lo mismo para elementos individuales. 

Para probar su sitio web con un lector de pantalla, vaya a la página que le gustaría probar y luego desplácese por la página como lo hizo durante la prueba de navegación con el teclado, usando solo las teclas de tabulación y flechas. Escuche lo que dice el lector de pantalla a medida que avanza por la página y marque cualquier cosa incorrecta o confusa. Escuche archivos multimedia o controles deslizantes que se reproducen automáticamente e interrumpen otros contenidos de la página. 

Una vez que haya realizado la navegación con el teclado y las pruebas del lector de pantalla, debe verificar todos los archivos multimedia incrustados o vinculados. Los archivos multimedia incluyen videos, archivos de audio, PDF, archivos .Doc o .XLS, controles deslizantes de imágenes o texto y widgets o iFrames de terceros. Asegúrese de que las personas con discapacidad puedan acceder, interactuar y comprender el contenido presentado por todos los archivos multimedia incrustados o vinculados. 

Prueba de usuario

Después de las pruebas de accesibilidad automáticas y manuales, se recomienda realizar pruebas de usuario. Las pruebas de usuario implican la contratación de usuarios de tecnología de asistencia del mundo real para que prueben su sitio web en busca de errores de accesibilidad. Normalmente, a un usuario de prueba se le da un resumen de un desarrollador web con objetivos específicos. Luego, el usuario de prueba intentará lograr esos objetivos y luego proporcionará comentarios al desarrollador.  

Mujeres con discapacidad visual que utilizan un teclado con braille

Puede contratar usuarios de prueba individuales a través de programas pagados o voluntarios, o encontrar una empresa de accesibilidad que ofrezca servicios de prueba de usuarios . 


Conclusión: mantener un sitio web accesible

Es importante tener en cuenta que, al igual que el SEO, la accesibilidad es un proceso continuo que requiere un seguimiento y modificaciones continuos. Para asegurarse de que su sitio web sea accesible, cree un plan para:

  • Supervise y pruebe regularmente los errores de accesibilidad utilizando una herramienta como el complemento Accessibility Checker.
  • Capacite a los desarrolladores web, diseñadores y creadores de contenido en las mejores prácticas de accesibilidad web. Si está lanzando sitios web para clientes, asegúrese de que sepan cómo agregar contenido de manera accesible después del lanzamiento.
  • Manténgase informado de cualquier pauta de accesibilidad o cambios legales que deba seguir. 

Seguir estos pasos ayudará a garantizar que su sitio web sea accesible y que todas las personas tengan el mismo acceso a la información, los productos y los servicios en la web, independientemente de sus capacidades.

¿Quieres recibir en tu buzón un correo con las últimas novedades?