Aspectos prácticos para la accesibilidad web

Enviado por Daniel Muñoz Egido el Lun, 18/11/2019 - 13:00
diagrama con los aspectos más significativos de la accesibilidad web

La accesibilidad web no es otra cosa que hacer que las personas con alguna discapacidad o limitación puedan percibir, entender, navegar e interactuar con la web y de esta manera puedan contribuir con ella, y podemos empezar a aplicarla con estos prácticos y sencillos consejos.

El diseño accesible no sólo beneficia a las personas con algún tipo de discapacidad, aquellas con algún tipo de deficiencia (problemas que afectan a una estructura o función corporal), limitación de la actividad (con dificultad para ejecutar acciones o tareas)  o restricciones de la participación (con dificultades para relacionarse y participar en situaciones vitales), también consiste en hacer sitios que puedan ser accedidos, interactuados, utilizables y practicables por cualquier persona de la forma más autónoma y natural posible, aquello que se denomina accesibilidad universal. En definitiva hacer que nuestra web pueda ser accedida y utilizada por personas con discapacidad o limitaciones, ya sean éstas permanentes o temporales.

Para poder lograr éstos objetivos, el W3C (World Wide Web Consortium), a través de la Web Accesibility Initiaitive (WAI) y otras organizaciones de todos los rincones del mundo, desarrollar toda una serie de actividades, como pueden ser:

  • Asegurar que el core de las tecnologías web soporten la accesibilidad.
  • Desarrollar guías para la creación de contenido web, agentes de usuario y herramientas de autoría que sean accesibles.
  • Facilitar el desarrollo de herramientas de evaluación de la accesibilidad.
  • Realización de acciones de educación y divulgación.
  • Coordinarse junto a investigadores y desarrolladores que estén o vayan a estar trabajando en la accesibilidad web.

Uno de los principales productos desarrollados por este grupo del W3C son las Web Content Accesibility Guidelines (WCAG), en las cuales, en su versión 1.0 sen incluyen 14 pautas que constituyen los principios generales del diseño accesible. Para cada uno de estos puntos se establecen uno o más puntos de verificación que explican como se aplica esa determinada pauta en determinadas áreas. Cada uno de estos puntos de verificación tiene asignado un valor de prioridad en función de la incidencia que la no aplicación de dicho criterio tiene desde el punto de vista de la accesibilidad.

A continuación, y basados en estos principios y en el post de palantir.net escrito por Alex Brandt, os ofrecemos 10 consejos prácticos para aplicar los criterios generales y básicos de accesibilidad dentro de nuestro sitio web.

 

Ten en cuenta el tipo de contenido y provee de texto alternativo

 

El texto alternativo no debe ser baladí o menospreciado. Para que realmente cumpla con la función para la que fue de concebido, éste debe proveer a nuestra audiencia de contenido y contexto entendible y comprensible de cada imagen, vídeo o audio. Además, éste texto será interpretado por las tecnologías que no pueden ver u oír nuestro contenido (como pueden ser los buscadores o asistentes de navegación).

Como ejemplo, y siguiendo la buenas prácticas, algunos de los textos alternativos que podemos (y debemos) proveer son:

  • Imágenes: proveer de texto alternativo a través de la etiqueta alt.
  • Audios: proveer de la texto alternativo con la transcripción del audio. En el artículo "Audiodescripción y transcripción del contenido multimedia" desarrolloado por accesibilidadweb.es podemos encontrar una explicación detallada de los tipos de transcripciones y audiodescripciones que podemos desarrollar de un modo accesible.
  • Vídeo: proveer de subtítulos y descripción de la acción del vídeo. En la actualidad disponemos de multitud de herramientas software, muchas de ellas open source y gratuitas para poder realizar esta acción.

 

Escribe de manera correcta el texto alternativo

 

En la actualidad todas aquellas personas que trabajan con o para la web conocen la existencia de la etiqueta alt para proveer del texto alternativo que necesitan los navegadores, para ser mostrada cuando no puede cargarse el recurso, y los asistentes que las leen para las personas que no pueden visualizarlos. Pero muchas veces no las utilizamos de manera apropiada, desaprovechando esta funcionalidad. Un buen texto alternativo debe:

  • Ofrece una buena descripción, tan amplia y precisa como sea posible, del recurso y de su contexto, además de su función cuando ésta sirva para algún propósito concreto dentro de la página dónde se encuentra.
  • Si la imagen incluye gráficos o algún otro elemento de visualización de datos, la información más relevante de dichos datos debe ser incluida en el texto alternativo.
  • Evita usar los términos "imagen de" o "dibujo de", o términos similares, ya que estamos empleando un elementos para describir imágenes de, dibujos de, etc, con lo cual estamos desperdiciando posibilidad de comprensión. Recuerda que muchos asistentes de lectura en pantalla sólo leen hasta 125 caracteres en estas etiquetas y además son las empleadas por los buscadores para tratar de entender qué significa dicha imagen.
  • Utilízala para lo que realmente sirve, y es que todos sabemos que el contenidos de las etiquetas alt también sirven para el posicionamiento SEO, pero no debe ser éste nuestro principal objetivo, aunque haciendo bien una cosa también podremos hacer la otra.

 

Establece una jerarquía

 

La forma en que estructuramos el contenido tiene una incidencia directa en cómo éste es comprendido. Si además valoramos que éste puede ser consumido por usuarias y usuarios con algún tipo de limitación del entendimiento y la comprensión, más atención y cuidado deberemos prestar en un contenido altamente estructurado, en el que la información más pertinente se encuentre en la parte superior de la página, la información relacionada se encuentre agrupada en secciones y con sus encabezamientos temáticos, y las ideas hayan sido organizadas y desarrolladas de manera lógica y mediante el empleo de un lenguaje comprensible para el conjunto de nuestras y nuestros visitantes.

 

Usa encabezamientos, listas, secciones y otros elementos estructurales que te ayuden a organizar tu contenido

 

De manera general, tus usuarios y usuarios deben entender qué contenido hay en tu página y puedan acceder rápidamente a la información que desean, y por este motivo ésta debe estar estructurada y organizada. El uso de encabezamientos y subencabezamientos, junto con otros elementos estructurales a nuestra disposición, nos ayudarán a establecer una jerarquía de las ideas y conceptos que estamos mostrando y hacerlo así más comprensible, tanto para los humanos como para las máquinas (el uso de las etiquetas <h> tiene una fuerte incidencia en cómo entienden nuestro contenidos los navegadores por ejemplo).

 

Imagen de la front page de la herramienta WAVE para el análisis de la Accesibilidad de sitio y páginas web

 

Si queremos tener una idea de cómo está estructurada una página de nuestro sitio y cómo ésta es entendida por un asistente de lectura y navegación, podemos emplear la herramienta WAVE. WAVE está desarrollada por la Organización Sin Ánimo de Lucro WebAIM (Web Accesibility in Mind) perteneciente al Centro para Personas con Discapacidad (Center for Persons with Disabilities) de la Universidad de UTAH (Utah State University).

 

Escribe un título descriptivo para cada una de las páginas del sitio

 

Un titular debe ser eso, una frase que anuncie y describa de manera sucinta aquello que viene a continuación y que nos permita hacernos una idea clara de aquello que nos vamos a encontrar. Es uno de los puntos donde se van a detener los lectores de pantalla para que los usuarios puedan tomar decisiones sobre qué hacer a continuación. Sabiendo ésto, un buen titular conseguirá:

  • Que los usuarios con baja visión puedan distinguir con facilidad en qué página se encuentran y de qué habla dicha página.
  • Que usuarios con deficiencias cognitivas, de memoria o problemas de lectura puedan comprender el contenido de la página en la que se encuentran.

 

Haz que los textos de los enlaces sean claros

 

Un texto de un enlace debe dejar claro su propósito y proveer de la información suficiente que nos permita conocer qué va a pasar cuando hagamos clic en él. Cuando el lector de pantalla pasa por un enlace, será el texto de éste el que informe al usuario o usuaria hacia dónde nos va a llevar dicho enlace y qué nos va a permitir ver. Algunas consideraciones adicionales pueden ser:

  • Cualquier información contextual del enlace (hacia donde nos dirige o qué nos vamos a encontrar en el enlace y que no pueda facilitar el propio enlace) deberá darse antes de éste.
  • No se deben ofrecer URLs como enlaces, ya que éstas no ofrecen ninguna información.
  • Debemos evitar escribir largos párrafos repletos de enlaces relacionados con un tema. En este caso es mejor escribir un texto en el que se describa el contenido general seguido de una lista ordenada de enlaces.

 

Evita usar imágenes de texto en vez de texto

 

Si queremos ofrecer una información textual, lo más sencillo, tanto pata nosotros como para los interpretes de pantalla, es que la ofrezcamos en forma de texto mas que como si fuera una imagen. Esta última deberá ser interpretada por el lector de pantalla mediante la etiqueta alt. Además de lo anterior, esto tiene fuertes implicaciones en el SEO de nuestro sitio.

Se pueden establecer evidentes excepciones a lo anterior, como puede ser el caso del logo de la página. En estos casos, podemos ofrecer texto alternativo con la etiqueta alt.

 

Evita modismos, jergas y abreviaciones.

 

Podemos tener la tentación de mostrar nuestro vasto conocimiento sobre un tema usando para ello un buen número de modismos, vocabulario especializado, o emplear abreviaciones que damos por hecho que nuestros interlocutores van a conocer. ¿Pero de verdad estamos hablando para un grupo reducido de personas que tienen los mismos conocimientos que nosotros?

Si vamos a emplear un vocabulario muy técnico o emplear abreviaturas durante el texto, es conveniente que las expliquemos cuando expresemos el término o abreviatura por primera vez para que nuestros lectores o lectoras tengan claro a qué nos referimos cuando hacemos mención de ellas a lo largo del texto.

 

Crea contenido claro

 

Demos adaptar nuestros contenidos para una audiencia con una capacidad lectora media y no considerar que la gran mayoría de nuestros lectores o lectoras van a ser capaces de entender complicados y eruditos materiales. Y aunque así fuera, si estudiamos el comportamiento de los usuarios en la web, nos daremos cuenta en que éstos no tienen paciencia para leer complicados textos y van saltando de unas partes del texto a otras. Si además de lo anterior, tenemos en cuenta que puede haber usuarios que discapacidades cognitivas que muestren algún problema lector, nos daremos cuenta que debemos escribir textos sencillos que puedan ser entendidos por la mayoría.

Un caso paradigmático puede ser cuando queremos describir la funcionalidad de un objeto. En vez de escribir un largo párrafo lleno de tecnicismos, lo mejor es escribir un pequeño párrafo fácilmente entendible para la mayoría seguido de una lista con las principales características o funcionalidades de aquello que estemos describiendo.

 

Las etiquetas de los campos de formularios deben ser claras

 

Un etiqueta de un campo de formulario debe describir de manera clara qué información se nos está pidiendo y qué información debemos introducir en dicho campo. Por ejemplo, si se nos pide una fecha se nos debe informar del formato de la fecha que debemos introducir. Este punto, que es útil para los usuarios con algún tipo de discapacidad visual o cognitiva, también es imprescindible para el conjunto de nuestra audiencia.

 

A veces pensamos que la accesibilidad es complicada y por eso no nos la planteamos a la hora de desarrollar nuestros proyectos web o no los exigimos a la hora de demandarlos porque pensamos que eso va a encarecer sustancialmente el producto. Pero nada mas lejos de la realidad. Aplicar los principios de accesibilidad básicos es sencillo, están perfectamente resueltos por la tecnología y sólo precisan de una voluntad de aplicarlos. Aplica estos principios que hemos enumerado y mejorarás sustancialmente la accesibilidad de tu sitio para todos tus usuarios, pero de manera especial para aquellos que tienen algún discapacidad o dificultad temporal.

¿Tu aplicas algún otro criterio práctico de accesibilidad en tu web que quieras compartir con nosotros?

Añadir nuevo comentario

Este campo sólo es para verificar que usted es una persona. No será almacenado ni utilizado con ningún otro propósito

HTML Restringido

  • Etiquetas HTML permitidas: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Saltos automáticos de líneas y de párrafos.
  • Las direcciones de correos electrónicos y páginas web se convierten en enlaces automáticamente.

Documentación Hoy le informa que los datos facilitados por usted en este formulario serán tratados informáticamente por Documentación Hoy con el objetivo de publicar su comentario a este contenido. Para poder llevar a cabo esta acción necesitamos su consentimiento explícito. Los datos proporcionados se conservarán mientras no solicite el cese de la actividad. Los datos no se cederán a terceros salvo en los casos en que exista una obligación legal. En cualquier momento usted puede ejercitar su derecho a acceder, rectificar, limitar o borrar sus datos enviándonos un e-mail a info@documentacionhoy.com. Usted puede encontrar más información en nuestra Política de Privacidad.