Accesibilidad web en WordPress

imagen de tecla con el logo de discapacitado

Las ventajas de la accesibilidad web se pueden resumir en la siguiente frase de Steven Pemberton, presidente de los grupos de trabajo de formularios y HTML del W3C:

Tu usuario más importante es ciego. La mitad de las visitas a tu sitio vienen de Google, y Google sólo ve lo que un ciego puede ver. Si tu sitio no es accesible, tendrás menos visitas. Fin de la historia.

Google ve tu sitio prácticamente como lo haría un visitante ciego así que ahí tienes un buen elemento de reflexión ¿no? Pero hay más, mucho más …

:: Ventajas de la accesibilidad web ::

Por si no te valen estos argumentos hay más ventajas de ofrecer un sitio conforme a los estándares de accesibilidad web:

  1. Aumenta el número de potenciales visitantes de la página web: esta es una razón muy importante para una empresa que pretenda captar nuevos clientes. Cuando una página web es accesible no presenta barreras que dificulten su acceso, independientemente de las condiciones del usuario. Una página web que cumple los estándares es más probable que se visualice correctamente en cualquier dispositivo con cualquier navegador. De acuerdo con los datos del INE (1999), el 9% de la población en España tiene alguna discapacidad, en total 3.528.221 personas.
  2. Disminuye los costes de desarrollo y mantenimiento: aunque inicialmente aprender a hacer una página web accesible supone un coste (igual que supone un coste aprender a utilizar cualquier tecnología nueva), una vez se tienen los conocimientos, el coste de desarrollar y mantener una página web accesible es menor que frente a una no accesible, ya que una página web accesible es una página bien hecha, menos propensa a contener errores y más sencilla de actualizar.
  3. Reduce el tiempo de carga de las páginas web y la carga del servidor web: al separar el contenido de la información sobre la presentación de una página web mediante CSS se logra reducir el tamaño de las páginas web y, por tanto, se reduce el tiempo de carga de las páginas web.
  4. Demuestra responsabilidad socialCumples un derecho ciudadano a la participación y no discriminación por razón de discapacidad.
  5. Cumples las disposiciones legislativas al respecto, tanto por la Administración Pública, obligada a ello ante la ciudadanía, como por las redes privadas que aspiren a participar en contratos con la Administración o financiación pública.
  6. Al diseñar conforme a estándares de accesibilidad, garantizamos la equivalencia de los contenidos entre distintos navegadores y dispositivos;
  7. Mejor indexación en los motores de búsqueda. El cumplimiento de las pautas, tanto en código como en contenidos semánticos (por ejemplo, vínculos con sentido) permite a los motores de búsqueda una mejor identificación de los contenidos, y en consecuencia, mayores posibilidades de posicionamiento en los buscadores.
  8. Mejora la usabilidad de la web. Aunque no son equivalentes, la accesibilidad cursa una estrecha relación con la usabilidad de un sitio. Al cumplir requisitos de accesibilidad básicos en los elementos técnicos de una web (estructura de contenidos, vínculos, contraste de color, efectos y movimientos, formularios, tablas, etc.), mejoran las condiciones de uso para la mayor parte de las personas.

:: Legislación española sobre accesibilidad web ::

Y, por si no fuese suficiente motivo hay suficiente motivo como para tenerlo en cuenta en base a la legislación española que regula los derechos a la accesibilidad en la web:

  • Ley 34/2002 de 11 de julio, de servicios de la sociedad de la información y de comercio electrónico.
  • Ley 51/2003 de 2 de diciembre de Igualdad de Oportunidades, No Discriminación y Accesibilidad Universal con discapacidad (LIONDAU).
  • Real Decreto 366/2007 de 16 de marzo, de accesibilidad y no discriminación de las personas con discapacidad en sus relaciones con la Administración General del Estado.
  • Ley 27/2007, de 23 de octubre, por la que se reconocen las lenguas de signos españolas y se regulan los medios de apoyo a la comunicación oral de las personas sordas, con discapacidad auditiva y sordociegas.
  • Real Decreto 1494/2007, de 12 de noviembre, por el que se aprueba el Reglamento sobre las condiciones básicas para el acceso de las personas con discapacidad a la sociedad de la información.
  • Ley 49/2007, de 26 de diciembre, por la que se establece el régimen de infracciones y sanciones en materia de igualdad de oportunidades, no discriminación y accesibilidad universal de las personas con discapacidad.

:: Problemas relacionados con la accesibilidad web ::

Las principales limitaciones que hay que tener en cuenta a la hora de hacer nuestra web accesible serían las siguientes:

  • Visuales: En sus distintos grados, desde la baja visión a la ceguera total, además de problemas para distinguir colores (Daltonismo).
  • Motrices: Dificultad o la imposibilidad de usar las manos, incluidos temblores, lentitud muscular, etc, debido a enfermedades como el Parkinson, distrofia muscular, parálisis cerebral, amputaciones, entre otras.
  • Auditivas: Sordera o deficiencias auditivas.
  • Cognitivas: Dificultades de aprendizaje (dislexia, discalculia, etc) o discapacidades cognitivas que afecten a la memoria, la atención, pas habilidades lógicas, etc.
  • Edad avanzada: A las personas con discapacidad podemos añadir el conjunto de personas de la “tercera edad”, ya que las carencias y problemas de los medios físicos, así como muchas veces el contenido, hacen que estas personas se encuentren también en riesgo de infoexclusión.

En base a esto, las personas con estas dificultades pueden encontrarse con  una serie de problemas de accesibilidad:

  • Manejo de dispositivos: Los teléfonos, ordenadores, cajeros automáticos y televisión digital la mayoría de las veces no están diseñados y colocados, en el caso de los cajeros, prestando atención a las necesidades de las personas con discapacidad. La variedad de terminales es muy grande, lo que se debe buscar es seguir la tendencia a reducirlos y acceder a todos los servicios a través de unos pocos. Cada vez más webs se visitan con todo tipo de dispositivos.
  • Interacción con las interfaces: Los menús, barras de navegación y botones no suelen ser accesibles desde una variedad de terminales adaptados.
  • Acceso a los contenidos: Los contenidos a los que se tiene acceso desde un mismo dispositivo son cada vez mayores y, este rápido crecimiento no suele atender las necesidades específicas de la discapacidad.

:: Niveles de prioridad y conformidad con la accesibilidad web ::

La accesibilidad web se divide en un espectro de tres niveles de prioridad:

  1. Prioridad 1: son aquellos puntos que un desarrollador Web tiene que cumplir ya que, de otra manera, ciertos grupos de usuarios no podrían acceder a la información del sitio Web.
  2. Prioridad 2: son aquellos puntos que un desarrollador Web debería cumplir ya que, si no fuese así, sería muy difícil acceder a la información para ciertos grupos de usuarios.
  3. Prioridad 3: son aquellos puntos que un desarrollador Web debería cumplir ya que, de otra forma, algunos usuarios experimentarían ciertas dificultades para acceder a la información.

En función a estos puntos de verificación se establecen los niveles de conformidad:

  1. Nivel de Conformidad “A”: todos los puntos de verificación de prioridad 1 se satisfacen.
  2. Nivel de Conformidad “Doble A”: todos los puntos de verificación de prioridad 1 y 2 se satisfacen.
  3. Nivel de Conformidad “Triple A”: todos los puntos de verificación de prioridad 1,2 y 3 se satisfacen.

:: Normas básicas de accesibilidad web ::

Para crear una web accesible hay que seguir las 14 pautas y sus puntos de control, pero hay algunas normas básicas, que las resumen en lo siguiente:

  1. Seguir los estándares del W3C. Actualmente los dos lenguajes estándar para la creación de sitios webs son HTML 4.01 y XHTML 1.0. Cumplir cualquiera de los dos estándares facilita la accesibilidad.
  2. Todas las imágenes deben tener un texto alternativo (atributo alt) que será el que visualicen los navegadores que no muestren imágenes (lectores de pantalla, ordenadores con una conexión lenta, navegadores de texto). Dicho atributo debe contener la descripción de la imagen (no el nombre) a no ser que esta descripción sea puramente decorativa.
  3. Los enlaces tienen que tener un nombre significativo del lugar al que apuntan. Este texto debe ser comprensible fuera de su contexto y, por tanto, no sirve el tan usado “pulsa aquí”.
  4. Para organizar la información dentro de la página web se deberán usar los h1,h2 …, con ellos debemos organizar tanto el contenido como el formato de los títulos.
  5. Debe evitarse el uso de tablas para maquetar, a menos que sean imprescindibles. Si se usan hay que asegurarse que el contenido se pueda leer de manera lineal y procurar que las diferentes celdas no tengan excesivo contenido.
  6. Siempre que sea posible deben usarse hojas de estilo (CSS) para separar el contenido de la presentación y deberán ser sintácticamente correctas.
  7. En caso de añadir contenido multimedia (sonido, animaciones y/o vídeo) deberán proporcionarse subtítulos (para el sonido) o descripción de las animaciones y los vídeos.
  8. En caso de usar marcos, deberá usarse una etiqueta <noframe> que incorpore los enlaces necesarios para la navegación. Se deberá identificar perfectamente cada uno de los marcos
  9. Si se usan scripts, applets o plugins no accesibles, deberá ofrecerse contenido alternativo.
  10. En caso de usar imágenes con información larga o compleja deben describirse adecuadamente. Para ello puede usarse el atributo longdesc.
  11. Si se utilizan mapas de imagenes es conveniente proporcionar vínculos redundantes en formato texto para cada zona activa del mapa.
  12. Deben usarse tipologías de letras de fácil lectura.

En este vídeo hacen un repaso de algunas normas y de la importancia de la accesibilidad web:

Ahora bien ¿cómo cumplimos todo esto si utilizamos WordPress?

buscar temas accesibles en wordpress

:: Accesibilidad web en WordPress ::

WordPress ofrece una página especial sobre accesibilidad web que nos ofrece consejos y herramientas para hacer nuestro WordPress accesible. También hay un resumen de prácticas de accesibilidad en el CODEX. No obstante, aunque mucho mejores que la raquítica página de referencia en WordPress.com, no son las mejores fuentes de conocimiento al respecto, así que te recomiendo que repases todos los demás puntos tratados en este artículo, y especialmente las referencias al final del mismo.

Lo primero que hay que tener en cuenta es que WordPress no se diferencia de cualquier otra web, por lo que las pautas y normas a seguir son exactamente las mismas que ya hemos visto. Sin embargo podemos tomar algún atajo que nos ahorrará trabajo:

  1. Utiliza un tema WordPress accesible. Aunque no hay muchos, en el repositorio oficial hay algunos temas, en concreto ocho, que cumplen con la tag “accesibility-ready“. Uno de ellos es el tema por defecto de WordPress, TwentyFourteen. También hay un tema hijo del tema TwentyTen que cumple con las normas de accesibilidad.
  2. Utiliza plugins accesibles. Siempre utiliza alguna versión accesible de los plugins que utilices, además de aquellos que te ayuden a cumplir las pautas de accesibilidad:
    • Busca plugins que cumplan con la norma WAI-ARIA. No es todo lo que necesitamos cumplir pero es un buen comienzo. No busques por “accesibility” o “accesible” porque lo que encuentras es un saco roto donde verás plugins de control de acceso, permisos de usuario y un poco de todo.
    • WP Accessibility. Es un buen comienzo pues identifica y soluciona errores comunes de accesibilidad (algunos los arregla de manera automática) como atributos de enlace incorrectos (cosa de lo que yo peco mucho) y adaptaciones de tags estándar de WordPress a las pautas de accesibilidad. Muy recomendable.
    • WP Accessible. A pesar de su nombre, a día de hoy no se parece ni de lejos al anterior porque solo ofrece un widget de cronología de Twitter accesible, el resto está por venir, pero por algo se empieza.
    • Contact Form 7: Accessible defaults: Convierte los formularios del plugin Contact Form 7 en accesibles en todos sus campos.
    • SOGO Accessibility: Añade varios ajustes para adaptar WordPress a usuarios con problemas de accesibilidad, como el contraste, tamaños, etc.
    • BotDetect Captcha es un plugin que ofrece un sistema de control de usuarios indeseables pero cumpliendo las normas de accesibilidad, para no convertir en indeseables a usuarios que no lo son, solo por su discapacidad.
    • YouTube Shortcode. Una versión de código corto (o shortcode) para insertar vídeos de YouTube en tu sitio pero de manera accesible.
    • Accessible tag cloud. Una alternativa accesible al widget de nube de etiquetas de WordPress.
    • Accessibility widget. Añade a tu barra lateral un widget desde el que aumentar o disminuir el tamaño de letra de tu sitio, muy útil para usuarios con problemas de vista cansada y otros.
    • Zoom widget. Igual que el anterior, añade un widget para aumentar el tamaño de los elementos de tu web.
    • Accessible_blank. Abre los enlaces en otra ventana o pestaña pero cumpliendo los estándares de accesibilidad. Estupendo plugin, aunque sin actualizar hace tiempo, de nuestro amigo Cristina Eslava.
    • Accessible external links. Similar al anterior, ofrece un modo de aplicar el destino de enlace pero de modo accesible.

Un buen resumen lo hizo Manrique López en esta presentación que expuso el pasado WPDay Madrid:

:: Cómo comprobar la accesibilidad de tu web ::

Existen una serie de prácticas que puedes llevar a cabo para comprobar la accesibilidad de tu web:

  1. Utiliza una herramienta de accesibilidad automática y una herramienta de validación del navegador. Por favor, comprueba que el software de las herramientas trata todos los problemas de accesibilidad, como la significación del texto del vínculo, la aplicabilidad de un equivalente textuale, etc. A continuación de esta lista tienes un par de buenas herramientas gratuitas online.
  2. Valida la sintaxis (Por ejemplo, HTML, XML, etc.).
  3. Valida las hojas de estilo (Por ejemplo, CSS).
  4. Utiliza un navegador sólo-texto o un emulador.
  5. Utiliza varios navegadores gráficos con:
    • Sonidos y gráficos cargados.
    • Gráficos no cargados.
    • Sonidos no cargados.
    • Sin ratón.
    • Marcos, scripts, hojas de estilo y applets no cargados.
  6. Utiliza varios navegadores, antiguos y nuevos.
  7. Utiliza un navegador por voz, un lector de pantalla, un software de magnificación, un visualizador pequeño, etc.
  8. Utiliza verificadores de ortografía y gramática. Quien lea la página con un sintetizador de voz puede no ser capaz de descifrar lo que reproduce el sintetizador por un error ortográfico. Eliminando problemas gramaticales se incrementa la comprensión.
  9. Revisa tu web para obtener claridad y simplicidad. Las estadísticas de legibilidad, tales como las generadas por algunos procesadores de textos, pueden ser útiles indicadores de claridad y simplicidad. Mejor aún, pida a un experimentado editor (humano) que revise la claridad del texto escrito. Los editores pueden también incrementar la utilidad de un texto identificando potenciales problemas interculturales que pueden surgir a causa del lenguaje o los iconos usados.
  10. Invita a personas con discapacidad a revisar la web. Usuarios discapacitados expertos y noveles proporcionarán una retroalimentación valiosa sobre la accesibilidad o los problemas de uso y su gravedad.

Por último, nunca está de más utilizar herramientas de comprobación automática de la accesibilidad web como estos:

  • eXaminator (en español)
  • HERA (en varios idiomas, también en español)

Ambos ofrecen una herramienta rápida que analiza si tu web cumple los estándares de accesibilidad web, ofreciéndote consejos para solucionarlo.

¿Cumple este blog con los estándares de accesibilidad?, pues tristemente aún no.

La accesibilidad web no es cosa fácil si no la aplicas desde el principio. En muchos casos son hábitos que debes adquirir a la hora de insertar enlaces o contenido, así que es mejor si empiezas cuanto antes, y yo llevo ya muchos años haciéndolo mal, lo que me suponer que tendría que echarle un buen rato a hacerlo accesible … pero estoy en ello poco a poco y espero tenerlo bonito y accesible en poco tiempo.

Las ventajas son manifiestas, como hemos visto, y en realidad no es tan complicado si sigues unas sencillas pautas y te acostumbras a ellas.

Referencias:

  1. Beneficios de accesibilidad web.
  2. Legislación española sobre accesibilidad web.
  3. Guía breve sobre accesibilidad web (W3C).
  4. Pautas sobre accesibilidad web en DiscapNET.
  5. Pautas sobre accesibilidad web.
  6. Repositorio oficial de temas WordPress.

AVISO: esta publicación es de hace dos años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.

Valora este artículo para mejorar la calidad del blog ...

PobreRegularEstá bienMuy buenoExcelente (13 votos, promedio: 5,00 de 5)
Cargando…

Autor: Fernando

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran.Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

ESTA WEB UTILIZA COOKIES PARA OFRECER LA MEJOR EXPERIENCIA POSIBLE. SI SIGUES NAVEGANDO DAS TU CONSENTIMIENTO PARA LA ACEPTACIÓN DE COOKIES Y NUESTRA POLÍTICA DE PRIVACIDAD más información

Los ajustes de cookies de esta web están configurados para "permitir cookies" y así ofrecerte la mejor experiencia de navegación posible. Si sigues utilizando esta web sin cambiar tus ajustes de cookies o haces clic en "Aceptar" estarás dando tu consentimiento a esto.

Cerrar