SEO y Accesibilidad Web

Escrito por Rubén Martínez

Un escenario para todos

Los expertos en SEO estamos habituados a trabajar en escenarios en los cuales disponemos de un importante número de piezas que debemos encajar en un lugar determinado, equiparables a los engranajes que hacen funcionar a un motor.

En una carrera de velocidad, un motor construido con las mejores piezas dispuestas de la manera más óptima, tendrá serias opciones de alzarse con el título. Análogamente, en el ranking de los buscadores, optarán a aparecer en las posiciones más altas aquellos sitios web que cuenten con una mejor optimización de sus engranajes.

Hoy no solo quiero hablaros de SEO, sino también del concepto de Accesibilidad Web, haciendo especial hincapié en aquellos puntos en los que ambas disciplinas se encuentran.

La accesibilidad web se refiere a que cualquier página web pueda ser percibida, comprendida y navegable para el mayor número de personas

Para ello, acompaño este artículo de una interesante entrevista que he realizado a José María Fernández, experto en Tecnologías Accesibles y Desarrollador de Software en la Universidad de Alicante.

Os dejo nuestra entrevista:

La accesibilidad web se refiere a que cualquier página web pueda ser percibida, comprendida y permita navegar por ella al mayor número de personas posible.

Es decir, que independientemente del dispositivo que se use (tableta, móvil, ordenador, lector de pantalla de una persona ciega), de las capacidades físicas o sensoriales que tenga una persona, de las condiciones externas (internet de baja velocidad, situaciones de luminosidad escasa, etc.), se pueda acceder de forma óptima a los contenidos de la web.

Una página web accesible será aquella que:

• Maquete el contenido con un interlineado suficiente y prescinda de justificar el texto a los dos lados.
• Posea todos los enlaces con significado propio (nada de «Pulsar aquí» o similares).
• Use encabezados para estructurar la información y proporcione mecanismos de navegación por los distintos apartados con menús y/o índices de contenido.
• Permita navegar con el teclado para quien no puede usar el ratón.
• Proporcione descripción escrita a elementos visuales como imágenes (atributo alt) o tablas (etiqueta caption).
• Incluya vídeos con subtítulos.
• Tenga un contraste suficiente entre color del texto y del fondo y de la posibilidad de utilizar diferentes combinaciones de color para mejorar contrastes.
• Permita y/o posea botones para aumentar el tamaño del texto o de las imágenes sin pérdida de calidad.

Sí, deberíamos pensar en que nuestro sitio web llegará al mayor número de personas posibles. Se estima que hay 4 millones de personas con algún tipo de discapacidad en España y más de 1.000 millones en todo el mundo. Son potenciales usuarios o clientes de nuestra web, por lo que si no los tenemos en cuenta, estaremos perdiendo buenas oportunidades de negocio.

No, al revés. Se suele decir que Google es el usuario ciego más rico del mundo. Hay que tener en cuenta que el robot de Google no ve, por lo que rastrea una web de una forma similar que una persona ciega, necesita el texto alternativo de una imagen para saber qué información aporta. Necesita la jerarquía de encabezados para saber cómo está estructurada la página y cuáles son sus apartados más importantes. Igualmente, un enlace con el texto de ancla «pincha aquí» no le dice nada, igual que no le diría nada a una persona que no puede ver.

Por este motivo, si una página web es accesible, Google la comprenderá mejor y por tanto, podrá posicionarla de una mejor forma.

Por otro lado, sí que es cierto que en muchas ocasiones no se tienen en cuenta cosas importantes como ocultar contenido en móviles de forma incorrecta, que visualmente no están pero por ejemplo un lector de pantalla que utiliza una persona ciega sí lo hará.

Por una parte sí. Los términos de accesibilidad y usabilidad van de la mano. También ha tenido mucho que ver la irrupción de la web móvil, cuya optimización apuesta por la claridad y concisión del contenido, así como por la fácil navegación web.

Antes existía la idea de que el usuario tenía 5 segundos para decidir si seguía en nuestra página o no y se intentaba acumular todo el contenido en la parte superior, lo que dificultaba comprender el sitio web. Ahora el usuario ha desarrollado más paciencia al acostumbrarse a hacer scroll vertical con el móvil hasta casi el infinito.

No obstante, todo tiene un pero. En este caso se están utilizando cada vez más los menús tipo hamburguesa, que despliegan el contenido al pulsar en ellos. Ocurre que muchas veces se programan para ser utilizados únicamente con el ratón, por lo tanto, personas que solo usan teclado para navegar no pueden acceder a estos contenidos.

Sí. Como indicaba en la pregunta anterior, ahora por lo general los sitios web son más sencillos y muestran únicamente la información más relevante, por lo que buscar y comprender contenido es más sencillo.

Depende de la plataforma y su integración con el sistema. En Android el rey es Chrome, pero en iOS es Safari. En Windows pasa diferente, Firefox o Internet Explorer son más accesibles y en macOS es Safari.

Esto es así porque las tecnologías de apoyo que utilizan las personas con discapacidad para navegar por la web (lector de pantalla, magnificador de pantalla, etc.) suelen ser creadas por el fabricante del Sistema Operativo, con lo que los dotan de mayor compatibilidad y características de accesibilidad.

Cada usuario tiene sus trucos. Por ejemplo, una persona con baja visión configura su navegador para forzar que el tamaño mínimo de la fuente y el tipo de ésta sean siempre los mismos. De esta manera, independientemente del tipo y tamaño de fuente que utilicemos, el usuario puede estar viendo tipo Arial y tamaño 18 siempre. Por esto es importante maquetar en medidas relativas y no absolutas, para que el contenido se adapte a ello.

Pasa igual con personas que padecen algún tipo de ceguera al color o problemas de contraste. Crean hojas de estilo propias para aplicar sus reglas y ver la página con inversión de colores o similar.

Todas las webs deberían incorporar botones básicos para aumentar / disminuir el tamaño del texto o imágenes, o aplicar filtros de color, como blanco sobre negro.

Deberían realizarse pruebas con usuarios con discapacidad para detectar los problemas de nuestros sitios web o aprender de ellos. Cualquier desarrollador debería conocer las herramientas que utilizan las personas con discapacidad, explorarlas y hacerse una idea de cómo navegan las personas con deficiencias sensoriales.

Todos tenemos estas tecnologías en nuestros SmartPhones. Simplemente yendo a Ajustes -> Accesibilidad, ya sea en Android o iOS, disponemos de lupas para ampliar la pantalla, aplicar filtros de alto contraste, utilizar pulsaciones largas de teclas para personas con problemas de motricidad o lector de pantalla para oír cómo lee el contenido de una web una persona ciega; en Android se llama TalkBack y en iOS VoiceOver.

En Windows se utiliza el lector de pantalla NVDA, que es gratuito, de código abierto y que permite hacerte una idea de cómo navega una persona ciega por la web.

Además, hay extensiones en los navegadores Firefox y Chrome para hacer análisis de accesibilidad, como Accesibility Toolbar, WCAG Contrast Checker y más.

Existen las Pautas de Acceso al Contenido Web (WCAG por sus siglas en inglés) en su versión 2.0 que son las normas que debería seguir una página web para que fuera accesible. La legislación Española exige que las páginas web de administraciones publicas, empresas dependientes de éstas o empresas que facturen más de 1 millón de euros, están obligadas a que sus sitios web sean accesibles, pudiéndose enfrentar a multas de hasta 1 millón de euros.

Webs de El Corte Inglés, Jazztel o Iberia ya han sido sancionadas por esto.

Sí, y aprendimos mucho uno del otro.

Es muy importante y en el futuro lo será más. La población cada vez está más envejecida por lo que traerá nuevas personas con problemas de visión y comprensión. Igualmente el uso de tantas pantallas y auriculares hará que aumenten en estas áreas aún más las personas con discapacidad.

Tener un especialista que haga tests con usuarios, que pruebe las web con distintas tecnologías que utilizan personas con discapacidad o que automatice análisis de accesibilidad web es una buena inversión. Al final estará haciendo también trabajo de maquetación, por lo que a un maquetador ya podríamos exigirle tener conceptos de accesibilidad web.

La web debe tener un título descriptivo y proporcionar enlaces de navegación y encabezados h1-h6 que le permitan hacerse una idea de cuál es el contenido de la página. De esta manera podrá navegar por ella, saber de qué trata y profundizar en el caso de estar interesado.

Sí. España está al nivel de Europa, puede que incluso por encima de la media europea. En EEUU y Canadá se consiguen más resultados gracias a la gran cantidad de recursos que invierten en investigación. De tener nosotros un nivel digno de I+D+I en tecnologías accesibles, seríamos sin duda un país puntero a nivel mundial en este campo.

Existe el caso de Luz Rello, una investigadora catalana con Dislexia que ha tenido que emigrar a EEUU para realizar sus estudios sobre esta especialidad, llegando a desarrollar Apps para detección de la dislexia en niños, juegos para estimularla, etc. Lamentablemente, en España se exigen resultados en fases demasiado tempranas de la investigación, lo que a todas luces hace imposible alcanzar conclusiones de valor.

Las herramientas como https://www.tawdis.net nos informan de lo que tenemos bien y mal y nos ayudan a solucionar los problemas de accesibilidad encontrados, aportando incluso ejemplos de código.

Algunas extensiones para el navegador:

• Accessibility Toolbar: Extensión para navegadores que permite desactivar eventos de ratón para similar solo el uso de la web con teclado, comprobar encabezados, accesibilidad de tablas, comprobar si las imágenes tienen texto alternative, etc etc.
• WCAG Contrast checker: Esta extensión nos dice si las combinaciones de colores entre fondo y texto cumplen los requisitos de accesibilidad
• Headings (encabezados): Nos muestra los encabezados que tiene nuestro sitio web y si están correctos en su jerarquía.
• WAVE: Es una extensión que nos permite hacer análisis de accesibilidad de sitios web dándonos mucha información.

El robot de Google no ve, por lo que rastrea una web de una forma similar que una persona ciega

Conclusiones

En este punto es posible extraer valiosas conclusiones con respecto a dos disciplinas que, a priori, pueden parecer independientes pero que en realidad están ampliamente relacionadas.

Encontramos numerosos puntos en común, como el contenido oculto penalizable, la navegación intuitiva y coherente, la legibilidad, la usabilidad móvil, la navegación predecible, las búsquedas por voz, el contenido alternativo en modo texto (atributos alt) o el uso limitado de recursos JavaScript que puedan dificultar la navegación en caso de ser desactivados.

El SEO y la Accesibilidad Web avanzan a pasos agigantados, desarrollándose cada vez más compartiendo senderos que discurren a través de la experiencia del usuario durante su navegación. La tecnología web se aproxima a los usuarios con discapacidad y en este progreso, trata de encontrar un escenario óptimo para el total de individuos que navegan por internet con independencia de sus facultades o deficiencias.

¿Y vosotros, optimizáis pensando en todos los tipos de usuarios?