Accesibilidad Web

Charlar sobre accesibilidad web, en pleno año 2024, cuando la sociedad avanza en la digitalización, es charlar del acceso universal a un sitio web, sin importar el dispositivo, la tecnología o las diferentes capacidades de cada persona.

De ahí, que hayan nacido la WAI y varias herramientas que te iré comentando en este post. 

¿Qué significa accesibilidad web?

Artículo sobre la accesibilidad web en el blog de paulagende.es

Si buscas en internet encontrarás múltiples definiciones del término accesibilidad web y se pueden resumir en:

La función que debe tener una web para que todas las personas, independientemente de sus capacidades, puedan acceder y utilizarla de forma eficaz. Esto incluye a personas con discapacidades visuales, auditivas, cognitivas o motoras.

Esta idea, de que la web debe ser accesible y universal para todxs, ya estaba en mente de Tim Berners-Lee, cuando creó lo que conocemos hoy en día como la navegación web.

Si estás en el mundo del diseño y el desarrollo web, seguro que te suena su frase:

El poder de la Web está en su universalidad. El acceso por cualquier persona, independientemente de la discapacidad que presente, es un aspecto esencial.

¿Por qué es tan importante la accesibilidad web?

La accesibilidad web es parte esencial de una sociedad inclusiva y, aquí, te voy a dejar 4 razones de porqué es tan importante incluirla en tu web.

Es un derecho fundamental

Cómo bien lees, la accesibilidad web está declarada como Derecho universal, y no lo digo yo, sino la Convención por las Personas con Discapacidad de las Naciones Unidas.

Este instrumento recoge el derecho y la garantía de que todas las personas, independientemente de sus capacidades, tengan acceso a las tecnologías de la información y servicios online al igual que los demás, por igualdad, para no discriminar, para tener más información a su alcance y por libertad de expresión.

Mejora la experiencia de cliente

Los sitios web que tienen una buena accesibilidad ayudan a mejorar la experiencia de todos los usuarios que la visitan, no solo de las personas con discapacidad, porque hace que la interfaz sea más atractiva y fácil de utilizar.

También, estamos ampliando nuestro público objetivo, o target, ya que nos acercamos a un grupo de personas con una experiencia web agradable, que de otra manera se pueden ver apartadas. Esto lo podemos traducir en más interacción en la web, mejor navegabilidad, más satisfacción de la clientela, más fidelidad a nuestra marca y, por lo tanto, más ventas.

Beneficia la reputación de marca

Puedes incorporar tu compromiso, con la accesibilidad web, dentro del plan de comunicación de la Responsabilidad Social Corporativa. Esto ayudaría a generar una imagen positiva en los potenciales clientes que valoran la inclusión y, por lo tanto, beneficiar la reputación de marca.

Además, esta imagen positiva de tu marca puede traducirse en una gran ventaja competitiva.

Aumenta el rendimiento SEO

Entre la accesibilidad web y el SEO existe una relación muy beneficiosa porque se complementan y potencian mutuamente. Un sitio web accesible, además de ser más intuitivo y usable para todas las personas, también ofrece un montón de posibilidades para mejorar las posiciones en Google.

Los motores de búsqueda, como Google, tienen muy en cuenta si una página web tiene buena accesibilidad a la hora de posicionarla. Si Google ve que tu web goza de una excelente experiencia de usuario y que se adapta a las necesidades de cada persona según su condición, va a mostrarla en las primeras posiciones.

¿Cuáles son las mejores prácticas para hacer accesible mi web?

Al llegar a este punto seguramente te estés preguntado cómo puedes hacer accesible tu web. 

Toma nota de las mejores prácticas para de accesibilidad web:

  • Emplear colores que contrasten bien.
  • Usar etiquetas ALT
  • Ordenar el contenido
  • Cuidar el diseño responsive.
  • Seguir estándares de accesibilidad.

Emplear colores que contrasten bien

Al emplear colores de fondo que contrasten bien con las letras, hace que para las personas con dificultades visuales puedan leer con facilidad.

Por ejemplo, usar letras finas con una foto o video de fondo puede ser muy difícil de ver. En este caso es mejor usar un tipo de letra con más grosor, hacer la capa del fondo del texto más difuminada o incluso colocar el texto fuera de la imagen o del video.

Usar etiquetas ALT

Es importante etiquetar adecuadamente todos los elementos de la web, como imágenes, formularios y enlaces, utilizando atributos como alt text (texto alternativo) y títulos descriptivos.

Estos textos alternativos o ALT son leídos por los lectores de pantalla que utilizan las personas con discapacidad visual y así, oyen la información que incluyen.

En este punto también debemos tener en cuenta insertar transcripciones y subtítulos en videos y audios.

Ordenar el contenido

Para ordenar y optimizar el contenido debemos, en primer lugar, redactar con un lenguaje sencillo y claro.

En algunos sectores se utilizan muchos tecnicismos en el día a día, como el mundo del marketing digital o del Tech, y también si tenemos presente, que hay personas que visitan tu web y que no están familiarizadas con ciertas jergas, les ayudaremos a entender mejor tu la página con una lectura agradable.

A mayores, al estructurar bien la jerarquía de encabezados y los títulos (h1’s, h2’s …), va a facilitar la comprensión de la página, tanto las personas, los lectores de pantalla y Google van a entender mejor de qué trata tu web.

Cuidar el diseño responsive

Asegurarnos de cuidar el diseño responsive de la web, para que este se adapte al formato de cada dispositivo, es muy importante cuando hablamos de accesibilidad web. Y no solo en cuanto a diseño, incluso al permitir realizar acciones sencillas como ampliar el zoom, desplazarse con el teclado o un fácil deslizamiento en la pantalla.

Además, debemos tener en cuenta que el aumento del uso del móvil frente a ordenadores o tablets, sobre todo entre la gente joven.

Para darnos cuenta de esto, tan solo hay que pasar por una parada de bus y ver a lxs chicxs con los ojos y el pulgar pegados a su smartphone. 

Seguir estándares de accesibilidad

Para implementar buenas prácticas de accesibilidad web ha nacido un conjunto de estándares internacionales, con las cuales guiarnos con pautas y normativas.

Con esto sale a luz la WCAG (Directrices de Accesibilidad para el Contenido Web) propuestas por el W3C (World Wide Web Consortium), dicho de una manera más sencilla, los creadores de la navegación web.

Para coordinar esta idea, en 1997, han fundado la WAI (Iniciativa de Accesibilidad Web) con el objetivo de promover la accesibilidad en entornos digitales y desarrollar pautas para lograr esta meta.

De este organismo ya te hablaré en otro artículo.

herramientas para implementar accesibilidad en una web

¿Qué herramientas puedo utilizar?

Por suerte cada vez existen más herramientas que ayudan a personas con dificultades navegar por una web, sobre en personas con discapacidad visual o motora.

Herramientas para personas con discapacidad visual

Aquí te dejo unos ejemplos de las herramientas para personas con discapacidad visual más conocidas.

Lectores de pantalla

Los lectores de pantalla son software que convierten el texto en voz, permitiendo a las personas con discapacidad visual acceder al contenido de una web.

Algunos ejemplos populares son:

  • JAWS (Job Access With Speech) Un lector de pantalla comercial con muchas funciones para Windows
  • NVDA (NonVisual Desktop Access) Otro lector de pantalla gratuito y de código abierto para Windows.
  • y VoiceOver integrado en dispositivos Apple y macOS.

Ampliadores de pantalla

Estas herramientas permiten a las personas con baja visión aumentar el tamaño del texto y los elementos de la pantalla para hacerlos más legibles.

Los ampliadores de pantalla más populares son:

  • ZoomText: Un ampliador de pantalla comercial con muchas funciones para Windows
  • Magnifier: ampliador integrado en Windows.

Extensiones en navegadores web

Existen varias extensiones de navegador diseñadas para mejorar la accesibilidad web para personas con discapacidad visual.

Por ejemplo:

  • ChromeVox es una extensión de Chrome que proporciona retroalimentación auditiva y lectura de pantalla en el navegador Chrome.

Navegadores con funcionalidad de accesibilidad

Los navegadores web más conocidos ya incorporan sus funciones de accesibilidad como: 

  • Firefox: que ofrece una serie de funciones de accesibilidad integradas, como la navegación por teclado y el zoom. 
  • Chrome: También dedica una serie de funciones de accesibilidad integradas, como el lector de pantalla integrado y el modo de alto contraste.

Navegadores de texto a voz

Estos navegadores de texto a voz convierten el texto en voz, permitiendo a las personas con discapacidad visual escuchar el contenido web en lugar de leerlo. 

Estas herramientas son las que dictan en voz alta el contenido del los ALT TEXT, y así las personas puedan saber que imágenes hay en tu web.

Algunos navegadores de texto a voz son:

  • NaturalReader
  • y ReadSpeaker.
lectores de pantalla para mejorar la accesibilidad web - paulagende.es

Plugins para mejorar accesibilidad web en CMS

Algunos CMS más conocidos  ya tienen plugins específicos de accesibilidad web que nos facilitan mucho la tarea de adaptar la interfaz a las necesidades de cada persona usuaria.

Te voy a dejar una pequeña lista del plugins más utilizados en WordPress, PrestaShop y Shopify:

Plugins para WordPress

  • WP Accessibility: Este plugin ofrece una variedad de características para mejorar la accesibilidad de un sitio web WordPress. Incluye opciones para mejorar el contraste, agregar atributos alt automáticamente a las imágenes, mejorar la navegación por teclado y mucho más.

 

  • Access Monitor: Access Monitor es otro plugin útil para WordPress que nos ayuda a monitorear la accesibilidad y detectar posibles problemas de accesibilidad en tiempo real en la web. Ofrece informes detallados sobre el cumplimiento de las normativas de accesibilidad y proporciona recomendaciones sobre cómo mejorar la accesibilidad del sitio.

Plugins para PrestaShop

  • PrestaShop Accessibility Pack: Este paquete de módulos incluye varias herramientas diseñadas para mejorar la accesibilidad de una tienda PrestaShop. Incluye funciones como un lector de pantalla virtual, un teclado virtual, una opción para cambiar el tamaño del texto y mucho más.

 

  • Accessible by Triplax: Este plugin agrega funcionalidades de accesibilidad a una tienda PrestaShop, como un botón de contraste, un widget de fuentes más grandes, opciones de navegación simplificada y etiquetas alt automáticas para imágenes.

Plugins para Shopify

  • Accessibility Enabler: Este plugin ofrece una variedad de herramientas de accesibilidad para mejorar la experiencia del usuario en una tienda Shopify. Incluye opciones para mejorar el contraste, aumentar el tamaño del texto, agregar etiquetas alt a las imágenes y más.

 

  • Accessible Apps Accessibility Widget: Esta aplicación de Shopify agrega un widget de accesibilidad a la tienda en línea que permite a los usuarios ajustar la configuración de accesibilidad según sus preferencias. Ofrece opciones como cambio de contraste, tamaño del texto ajustable y navegación por teclado.
  1.  

¿Existen leyes que regulan la accesibilidad web?

A la cuestión de si en España existe alguna ley o narmativa que regula el acceso universal a la web, te diré que sí. 

Estas son algunas de ellas.

Directiva Europea de Accesibilidad de los Sitios Web y Aplicaciones Móviles de los Organismos del Sector Público (UE) 2016

Esta directiva, adoptada por la Unión Europea en 2016, establece requisitos de accesibilidad para los sitios web y aplicaciones móviles de los organismos del sector público. Los Estados miembros de la UE, incluida España, deben implementar esta directiva en sus legislaciones nacionales.

Ley 34/2002, de 11 de julio, de servicios de la sociedad de la información y de comercio electrónico

Esta ley establece que los sitios web de las entidades públicas estatales deben ser accesibles para las personas con discapacidad, por lo tienen que garantizar el acceso universal a la información y los servicios en línea.

Real Decreto 1112/2018, de 7 de septiembre, sobre accesibilidad de los sitios web y aplicaciones para dispositivos móviles del sector público

Este decreto transpone la Directiva Europea 2016/2102 al marco jurídico español. Establece requisitos detallados de accesibilidad para los sitios web y aplicaciones móviles del sector público español, así como los procedimientos de supervisión y sanciones por incumplimiento.

Norma UNE 139803:2012 sobre accesibilidad en servicios de la sociedad de la información

Esta norma establece los requisitos técnicos para garantizar la accesibilidad de los sitios web y aplicaciones móviles. Se basa en las pautas de accesibilidad del W3C (WCAG) y proporciona orientación detallada sobre cómo implementar la accesibilidad web de manera efectiva.

Mi experiencia

Cuando estaba realizando el TFM del Máster de Marketing Digital sobre la Fundación San Rafael, he visto que necesitaban implementar técnicas de accesibilidad en su web por dos sencillas razones: trabaja para personas con discapacidad, por lo que es muy importante que se adapte a cada condición y, por tener un compromiso claro con la inclusión de la sociedad.

En conclusión, si tenemos una web, debemos de cuidar su adaptabilidad a las necesidades de cada persona, sea cual sea su condición.

Let’s rock!

Contacto

¿Precisas apoyo para aplicar técnicas de accesibilidad en tu web?

Contacta conmigo y pondremos en práctica la adaptabilidad para cada usuario.

Scroll al inicio