Permite el uso de cookies para que podamos saber si esta web es de interés o no.

Accesibilidad: Haz que la web de tu organización sin ánimo de lucro sea para todos

Esto puede sonar obvio, pero no todo el mundo que usa tu sitio lo usará como tu.  Si tienes un portátil con teclado y ratón es importante no olvidarse de los usuarios que tienen dispositivos táctiles. Igualmente, puede que algunos usuarios necesiten «tecnología asistencial» como un programa «lector de pantalla» que lea en voz alta a las personas con minusvalías visuales. Es esclarecedor observar las maneras sorprendentes con las que la gente visita webs en vídeos sobre personas usando tecnología asistiva.

Para asegurar que tu web funciona para la mayor cantidad de gente posible, pon especial cuidado en centrarte en la accesibilidad web. El sector de las entidades sin ánimo de lucro está lleno de gente que trabaja duro para hacer un mundo mejor. Haciendo tu sitio WordPress accesible podrás dar servicio a más gente e incluir a todos los que quieran apoyar tu trabajo.

El reto de la accesibilidad

Hacer accesible una web es un esfuerzo en equipo. WordPress está mejorando su propia accesibilidad. También es necesario que los autores de los plugins y el tema de tu web los hagan accesibles. No des esto por hecho. Es por este motivo que hay una sección de «Accesibilidad en los plugins recomendados y un truco para buscar temas «preparados para accesibilidad».

¡La parte final del reto está en tu mano! Introducir y dar formatos al contenido de tu web teniendo en cuenta en la accesibilidad es importante y requiere aprender unas pocas pero importantes técnicas.

Elige temas accesibles

Para tener una web accesible primero debes empezar eligiendo un tema accesible para tu web. A la hora de elegir un tema para tu organización sin ánimo de lucro, la accesibilidad es una característica crítica a considerar. Es por eso que muchos de nuestros temas recomendados están “preparados para accesibilidad”. Si no estás seguro de si un tema es accesible o no escribe directamente al autor del tema para preguntarle, y mira a ver si puedes ¡probar el sitio demo del tema con algunas de las herramientas y pruebas mencionadas más abajo!

Una vez hayas elegido un tema accesible, es hora de hacer tu parte en el reto e ¡introducir texto, enlaces e imágenes accesibles!

Formato de texto para webs accesibles

Un fabuloso efecto colateral del contenido accesible es que suele ser más fácil de usar para todos y que al mismo tiempo a menudo mejora tu puntuación en los motores de búsqueda! Este artículo sobre cómo escribir contenido accesible es una fantástica lectura recomendada.

En particular, para hacer un sitio accesible debes:

  • Completar el campo “Texto Alt” al subir imágenes
    Ese campo debería describir la imagen en 3-7 palabras a cualquiera que no pueda verla.
  • Usa suficiente contraste para que cualquiera pueda leer tu texto
    A nadie le gusta leer textos en bajo contraste (gris suave o a colores) y algunas personas simplemente no podrán leerlos. Puedes probar el contraste de color para de paso conocer los «códigos hexadecimales» que estás usando.
  • Divide las páginas largas con títulos
    Los títulos ofrecen resúmenes tanto visuales como técnicos de la estructura de tu página. Usar correctamente los títulos es crucial para una buena accesibilidad.
  • Usa un plugin de formularios accesible
    Usando uno de los plugins de formulario recomendados con su correspondiente plugin que solucione la accesibilidad (cuando esté disponible) para obtener unos mejores resultados.

Para mejorar aún más la accesibilidad de tu sitio deberías también hacer todo lo siguiente:

  • Escribe sencillo
    Plantéate escribir como lo haría un niño de primaria, con frases y párrafos cortos. Utiliza listas tanto como sea posible. Herramientas como Hemingway te permiten probar el nivel de escritura y te hará otras sugerencias útiles para simplificar tu escritura. El análisis de legibilidad del plugin Yoast también te dará consejos similares.
  • Haz enlaces descriptivos
    No más «haz clic aquí» y «sigue leyendo». Describe el contenido de la página enlazada (p.ej. nuestros servicios) o la acción a la que lleva el enlace (p.ej. Comprar entradas).
  • No subrayes texto que no sea un enlace
    ¿Has tratado alguna vez de hacer clic en los enlaces falsos de la última lista? Está todo dicho.
  • Leyenda y transcripción
    Ofrece leyendas y transcripciones para vídeos y audios cuando sea posible. Esto vale tanto  para los que no pueden oír como para los que prefieren aprender leyendo.
  • Evita los PDF
    Hay montones de buenas razones por las que evitar los PDF además de la accesibilidad. Hacer accesibles los PDF es realmente difícil y nunca ofrecen una buena experiencia en el navegador web.

Probando la accesibilidad de tu sitio

¡Es sorprendentemente fácil hacer pruebas básicas de accesibilidad! Algunas pruebas ni siquiera requieren herramientas especiales. ¡Aquí tienes unas pocas pruebas que puedes hacer ahora mismo! Pruébalas en este sitio y luego en el tuyo.

Prueba 1: Zoom al 200%

Muchas gente con mala vista hará zoom de tu web para poder leerla, algunos hasta 3 veces o más.

Usa los ajustes de tu navegador o los atajos de teclado CTRL +/CMD+ para hacer zoom de tu navegador hasta el 200%. Aún deberías ser capaz de leer y navegar fácilmente por el sitio, sin barras de desplazamiento horizontal.

¡Ya está! ¡Acabas de completar tu primera prueba d accesibilidad web! Normalmente, un sitio responsive debería pasar esta prueba.

Prueba 2: Navega con un teclado

Hay mucha gente que usa solamente un teclado para controlar su ordenador. Puede ser por conveniencia o porque el uso de un ratón les es difícil o imposible. Tu sitio debería ser utilizable al 100% solo con un teclado.

Pruébalo tu  mismo haciendo esto:

  1. Navega a tu sitio (Actualiza la página si ya estás ahí)
  2. Pulsa la tecla TAB 1 o más veces.

A medida que hagas esto estás comprobando lo siguiente:

  1. ¿Puedes ver dónde está el «foco» del teclado?
    Un sitio adaptado destacará los enlaces y otros elementos a medida que pasas por ellos con tu teclado.
  2. ¿Puedes acceder y activar cada elemento?
    Cuando pulsas la tecla TAB unas cuantas veces y puedes ver dónde has «enfocado», pulsa ENTER para activarlo. Esto es como hacer clic en un enlace con un ratón. La mayoría de las partes de tu sitio deberían funcionar de este modo. Algunas pocas cosas requerirán el uso de las teclas de dirección (botones de selección única) o de la barra espaciadora (casillas de selección múltiple).

Solucionar esto puede requerir ayuda de  un diseñador y/o desarrollador, pero ¡el conocimiento es el primer paso!

Prueba 3: Simula un lector de pantalla

Si usas el navegado web Google Chrome puedes instalar la extensión llamada ChromeVox que, una vez activa, lee la web que estés visualizando para que te hagas a la idea de cómo la «oirá» un visitante con problemas de vista.

Instala tota11y

tota11y es la herramienta de pruebas de accesibilidad más sencilla de utilizar. Su página web tiene una sección de instalación simple para ayudarte a instalarla en tu navegador. También puedes usar los plugins WP Tota11y o wa11y para instalar tota11y para todos los usuarios conectados de un sitio WordPress.

¿Quieres saber qué se cuece sobre “a11y”? Es el modo breve de referirse a la «accesibilidad» ya que hay 11 letras entre la «a» y la «y» de «accessibility» (en inglés). Por ejemplo, , sigue #a11y en Twitter para ver conversaciones sobre accesibilidad!

Una vez instalado, tota11y te ayudará a probar la accesibilidad de:

  • Títulos
  • Contraste de color
  • Texto de enlaces
  • Etiquetas de formularios
  • Textos Alt de imágenes

Muchos de estos problemas – especialmente los de títulos, textos de enlaces y textos Alt – ¡pueden solucionarse de inmediato cuando los descubras! Lee en detalle los resultados de tota11y pues trata de explicar el problema y sugiere soluciones.

Para aprender más

Hay montones de fantásticas webs y boletines con información sobre accesibilidad web. Aquí tienes algunos de los mejores para principiantes: