Accesibilidad

Una página o sitio web es accesible cuando está diseñada y codificada para que sus contenidos y servicios estén disponibles para cualquier persona, con independencia de su contexto de navegación.

Accesibilidad

Información de ayuda para los gestores finales que les ayudará a conseguir que los contenidos web sean accesibles para todos los usuarios, con independencia de sus circunstancias personales (calidad de la visión, manejo del ratón, conexión, navegador, dispositivo, etc.). Estas recomendaciones de accesibilidad han sido extraídas del Observatorio de Accesibilidad del Portal de Administración Electrónica del Gobierno de España (Guía de cuestiones básicas de accesibilidad para editores finales de contenidos).

Accesibilidad

¿Qué es la accesibilidad?

La accesibilidad puede definirse como “la posibilidad de que un sitio o servicio web pueda ser visitado y utilizado de forma satisfactoria por el mayor número posible de personas, independientemente de las limitaciones personales que tengan o de aquellas limitaciones que sean derivadas de su entorno” (Guía de cuestiones básicas de accesibilidad para los editores finales de contenidos).

La accesibilidad es un elemento esencial que favorece la igualdad de oportunidades de las personas con discapacidades y es una obligación legal establecida en el Real Decreto 1112/2018 sobre accesibilidad de los sitios web y aplicaciones para dispositivos móviles del sector público. Por este motivo, EducaMadrid procura que todos los miembros de su equipo técnico y todos los docentes conozcan y apliquen los estándares de accesibilidad para facilitar a todos los usuarios el ejercicio del derecho de acceso a los contenidos educativos de cualquier herramienta de la Plataforma.

Una de las particularidades de EducaMadrid es que basa casi todos sus servicios en Software Libre. Uno de los valores más importantes del Software Libre es su compromiso de no excluir a nadie, por lo que se convierte en el firme promotor de acceso universal a las Tecnologías de la Información. Precisamente por este motivo, gestiona automáticamente la accesibilidad, basándose en las normas internacionales de accesibilidad y adaptándose a las preferencias o necesidades de los usuarios.

En el caso de las demás herramientas que constituyen desarrollos propios, EducaMadrid ha adquirido el compromiso de garantizar la calidad y el nivel de accesibilidad conforme al nivel AA (doble A) de las Directrices de Accesibilidad definidas por el grupo de trabajo permanente Web Accessibility Initiative (WAI), perteneciente al Consorcio para la World Wide Web (W3C). Información sobre la accesibilidad de las herramientas propias de EducaMadrid.

No obstante, no todos los aspectos de accesibilidad pueden ser revisados de forma automática mediante un gestor de contenido. Será, en última instancia, el editor final - el docente en nuestro caso - quien determine la adecuación, por lo que su figura será imprescindible para garantizar la accesibilidad final de una herramienta.

No todos los aspectos de accesibilidad pueden ser revisados de forma automática mediante un gestor de contenido. Será, en última instancia, el editor final - el docente en nuestro caso - quien determine la adecuación, por lo que su igura será imprescindible para garantizar la accesibilidad final de una herramienta.

Todas las recomendaciones recopiladas a continuación han sido extraídas del Observatorio de Accesibilidad del Portal de Administración Electrónica del Gobierno de España, Guía de cuestiones básicas de accesibilidad para los editores finales de contenidos.

Accesibilidad

Pautas de accesibilidad

La clave principal para mantener la accesibilidad de los contenidos radica en utilizar las opciones que proporciona cualquier gestor de contenidos (textos alternativos, listas, tablas, encabezados, etc.) y no introducir obstáculos que impidan la generación de contenidos accesibles.

Las Pautas de Accesibilidad al Contenido en la Web (WCAG) son unos documentos que explican cómo hacer que el contenido Web sea accesible para personas con discapacidad. La versión más actual disponible es WCAG 2.1, publicada en 2018 para reemplazar la segunda versión publicada en 2008.

Según estas pautas, los contenidos en la web deben ser:

  1. Perceptibles: que todos puedan percibirlos. Por ejemplo, una persona que no ve no podría percibir una imagen a la que no se le ha dado un texto alternativo.
  2. Operables: fácilmente navegables, que den tiempo suficiente para hacer lo que haya que hacer, que sean navegables utilizando el teclado.
  3. Comprensibles: fácilmente legibles, de estructura predecible.
  4. Robustos: que puedan ser interpretados por diferentes agentes de usuario (incluidas las tecnologías asistivas, como lectores de pantalla, etc.).

Para más información, puedes acceder a los contenidos de un curso presencial impartido por Ignacio Gros en INTEF.

Accesibilidad

Inclusión de imágenes

Toda imagen incluida en una página web, ya sea informativa, funcional o decorativa, debe proporcionar un texto alternativo que aporte la misma información o función que la imagen. Este texto alternativo se mostrará en caso de no mostrarse la imagen: por ejemplo, los navegadores gráficos que tengan las imágenes desactivadas o no puedan mostrarlas, y los navegadores de texto usarán el texto alternativo en su lugar. Por otra parte, los lectores de pantalla leerán en voz alta el texto alternativo de las imágenes.

Propiedades de la imagen: descripción alternativa de la imagen.

El texto alternativo de las imágenes debe tener las siguientes características:

Las imágenes simplemente decorativas deberán tener el campo de texto alternativo vacío y no se debe proporcionar ningún título a la imagen.

Si las imágenes funcionan como enlaces, el texto alternativo, en combinación con el texto del enlace (si lo hay), debe identificar claramente el destino o función del enlace, evitando redundancias de información innecesarias. En este caso, podemos diferenciar varios casos:

Título del documento (En formato PDF.,  2Mb)

En este ejemplo, el texto alternativo adecuado para la imagen podría ser “En formato PDF” ya que dicha información no se está proporcionando en el texto del enlace.

Título del documento ( , en formato PDF, 2Mb)

En el caso de este ejemplo, la imagen no aporta información adicional porque el texto del enlace ya está informando de que el documento está en formato PDF, por lo que la imagen se dejaría como decorativa para no repetir información.

En ocasiones, es necesario introducir imágenes complejas que transmiten mucha información (gráficas, diagramas, mapas, etc.) que debe ser descrita en pocas palabras. En estos casos, además de ofrecer una alternativa textual que identifique brevemente el tipo de información transmitida por la imagen, se debe proporcionar una descripción detallada en una página aparte o en la misma página de la imagen.

La descripción detallada se podrá incluir de diferentes formas:

Campo de la "Descripción larga URL" de una imagen compleja.

Como vemos, es posible dotar de alternativa textual y descripción detallada a las imágenes de un sitio mediante un gestor de contenidos. A pesar de ello, el gestor de contenidos no puede verificar si la accesibilidad es adecuada, por lo que esa tarea deberá llevarse a cabo de forma manual por el propio editor que se encargará de garantizar que cada imagen disponga de una alternativa textual equivalente a su contenido o funcionalidad.

Además de la alternativa, es aconsejable indicar las medidas finales de la imagen para asegurarse de que se carguen correctamente en el navegador.

En resumen, para la correcta inclusión de imágenes, es necesario:

Accesibilidad

Definición de encabezados o títulos

Si las páginas contienen un volumen de información elevado, es recomendable dividirlas en una serie de capítulos, apartados, secciones y párrafos. Estos fragmentos de información constituyen la estructura de la página que es más cómoda para navegar para los usuarios invidentes y con otras discapacidades. De este modo, pueden acceder de forma más sencilla a la información que necesitan sin tener que esperar a que el lector de pantalla les lea la página completa.

En (X)HTML, la estructura de una página se define a través de elementos de encabezado o título, con diferentes niveles de profundidad, que permiten acceder a diferentes secciones.

Los gestores de contenido suelen disponer de funcionalidad de marcado de encabezados o títulos:

Imagen que representa diferentes niveles de encabezados o títulos en un gestor de contenidos.

El editor de contenidos es quien tiene que fijar los niveles de encabezado para establecer la correcta jerarquía de la información y establecer de este modo las diferentes secciones según el nivel de profundidad y sin que se produzcan saltos en los niveles.

En resumen, para estructurar correctamente la información en una página, es necesario:

Accesibilidad

Inclusión de enlaces

Los usuarios invidentes y con otras discapacidades se ayudan en la navegación de herramientas que les permiten mostrar un listado de todos los enlaces de una página. Por lo tanto, la descripción del enlace debe ser lo suficientemente buena para comprender su utilidad fuera del contexto.

Por otro lado, se debe evitar la apertura de enlaces en nuevas ventanas del navegador porque:


En el caso de que un enlace se abra en una ventana nueva, se recomienda informar al usuario. Esto puede ocurrir en los siguientes casos:

En resumen, para la correcta inclusión de enlaces es necesario:

Accesibilidad

Inclusión de ficheros adjuntos

Al igual que sucede con las imágenes, es recomendable que los ficheros adjuntos tengan un peso lo más reducido posible, de modo que se facilite su descarga.

Los formatos de documentos deberán ser estándares abiertos y, de forma complementaria, estándares de uso generalizado: .odt, .pdf, .xml, .csv, etc.

Los ficheros adjuntos que se pueden descargar deberán disponer de un texto de enlace descriptivo del fichero que se vincula. Normalmente, este texto descriptivo será el nombre o el contenido principal del fichero adjunto y debe ser comprensible fuera de contexto o dentro de su contexto más inmediato.

El acceso a determinados ficheros adjuntos provoca la aparición de un plugin en el navegador o de una herramienta propia de escritorio para el manejo del documento. Esto puede provocar cierta confusión ya que el usuario puede pensar que ha perdido la página web o directamente perder el hilo de navegación. Por esta razón, en estos casos se recomienda que los ficheros adjuntos se abran en nueva ventana y avisar al usuario de este hecho, como se ha explicado en la sección “Inclusión de enlaces”.

Además de un texto descriptivo del fichero, es recomendable incluir en el título del enlace una indicación sobre el formato. Por ejemplo: “Normas del proceso de admisión. Fichero PDF”.

Siempre que sea posible, es recomendable añadir información complementaria sobre el tamaño del fichero adjunto de forma que los usuarios decidan si desean descargarlo o no en base a sus circunstancias personales.

También es recomendable que los enlaces a ficheros adjuntos sean diferenciados visualmente del resto mediante algún estilo o icono representativo de su formato.

Por último, es recomendable proporcionar la información más relevante o el resumen del fichero en formato (X)HTML para que los usuarios puedan conocer la información principal sin necesidad de descargar el fichero.

En resumen, para la correcta inclusión de ficheros adjuntos, es necesario:

Accesibilidad

Identificación de listas

Las listas identifican grupos de elementos que tienen alguna relación entre sí, lo que ayuda a comprender la estructura del contenido. Los usuarios invidentes cuentan con herramientas que les permiten navegar por el contenido de las listas de forma estructurada y cómoda: los lectores de pantalla reconocen una lista e informan a los usuarios de su presencia y del número de elementos que la componen.

En (X)HTML se distinguen cuatro tipos de lista:

El editor final de contenidos debe verificar manualmente que:

En resumen, para ordenar grupos de elementos es necesario: 

Accesibilidad

Inclusión de tablas de datos

En (X)HTML, las tablas sirven para mostrar información tabular y no para dotar de presentación a los contenidos (maquetar).

Cada celda de encabezado debe identificarse como tal (en HTML, con elemento TH). Con ello se consigue:

En tablas de datos complejas (que tienen dos o más niveles lógicos de encabezado) se debe explicar la relación entre las celdas de datos y las celdas de encabezado correspondiente para permitir una correcta interpretación. Dicha asociación se realiza en (X)HTML por medio de los atributos id y headers, de forma que cada celda de datos incluye en su atributo headers el identificador id de todos los encabezados relacionados con esta.

Cuando se crea una tabla con un gestor de contenidos, por defecto no se marcan los encabezados. El editor final puede marcarlos de forma semiautomática o manual revisando el código y añadiendo el etiquetado necesario para que la tabla sea accesible.

Del mismo modo, se debe revisar y añadir manualmente la asociación entre celdas de datos y encabezados.

Configuración de la tabla en un gestor de contenidos.

En el caso de tablas de datos muy complejas, si el editor final no sabe cómo realizar marcados en el código HTML, es recomendable que contacte con su departamento informático para que le ayuden en esta tarea. Si no es posible obtener ayuda profesional, es recomendable usar tablas de datos sencillas para que las celdas de encabezado se identifiquen correctamente con el propio gestor de contenidos y evitar recurrir a la manipulación del código.

Por otro lado, para mejorar la comprensión de la estructura de contenidos de una tabla es muy recomendable incluir un título que describa brevemente la naturaleza de la tabla. En las tablas de datos complejas es necesario incluir un resumen de contenidos e indicar las relaciones entre las celdas.

En resumen, para la correcta inclusión de tablas de datos es necesario:

 

Accesibilidad

Identificación de citas

Una cita es una referencia textual de un fragmento o totalidad del discurso de una persona o el texto de otra fuente.

En (X)HTML existen dos tipos de cita:

No se deben utilizar elementos de cita para producir efectos visuales, como efectos de sangrado en párrafos de texto.

En resumen, para la correcta inclusión de citas:

Accesibilidad

Edición del estilo o aspecto visual de documentos

Los editores visuales disponen de opciones para cambiar aspectos de presentación de los contenidos, pero en muchas ocasiones, al utilizarlos, se genera código incorrecto que dificulta el mantenimiento del sitio y su accesibilidad. Así, se desaconseja aplicar estilos a fragmentos de texto (por ejemplo, el subrayado o el tachado).

Otro caso dentro de la edición de contenidos es la introducción de saltos de línea para crear separaciones visuales en el contenido. Debe evitarse la práctica errónea de generar para ese propósito párrafos vacíos.

Tampoco son elementos estructurales correctos tipo y tamaño de fuente, el color del texto, diferentes espaciados o tabulaciones. Todas estas herramientas no consiguen una presentación estructurada de contenidos que sea accesible a los usuarios que utilizan lectores de pantalla.

Hay que tener especial cuidado con el pegado de textos desde fuentes externas, como procesadores de textos o navegadores web. Algunos gestores de contenidos ofrecen herramientas para realizar una transformación adecuada tanto a nivel visual como a nivel de código.

Si el gestor de contenidos no dispone de esa opción, nunca se debe pegar un contenido directamente sobre el área de edición, ya que se estarían incorporando todos los problemas que pueda tener el código o contenido original, lo que influirá negativamente en la accesibilidad. En este caso, antes de incorporar el contenido en el editor, es necesario pegarlo en un editor de texto plano (por ejemplo, Pluma en MAX) para eliminar cualquier posible formato previo y dejar únicamente el contenido textual.

Hay que recordar que un estilo de presentación similar (mismas fuentes, colores, etc.) en todas las páginas facilitará la identificación de los diferentes contenidos (encabezados, enlaces, etc.) y por tanto, la accesibilidad y la usabilidad del sitio web. Hay que dejar que se apliquen los estilos por defecto definidos para el sitio web, asegurando la homogeneidad en todos los contenidos.

En resumen, el estilo y la presentación de la página debe ser controlado por el gestor de contenidos con hojas de estilo.

El usuario final no debe:

Al pegar texto procedente de fuentes externas: