Creación de sitios web accesibles e inclusivos para nuestra comunidad

¿Cómo hacer que su sitio web sea accesible para cualquier persona y cuáles son los estándares de accesibilidad del sitio web?

Quizás se esté preguntando: ¿qué es la accesibilidad y la inclusión de un sitio web?

No todo el mundo puede acceder a Internet de la misma manera que lo hace una persona típicamente desarrollada. Una gran parte de nuestra sociedad, el 20 % en Australia, vive con algún tipo de discapacidad. Esto significa que al menos el 20% de todos los australianos son menos capaces o incapaces de consumir, acceder, leer, escuchar o comprender el contenido de Internet, porque tienen menos capacidad para ver, escuchar o digerir cognitivamente el contenido que se encuentra en línea. Esto puede deberse a una discapacidad permanente o temporal, una lesión o una barrera del idioma, o complejidades innecesarias con el sitio web con el que se interactúa.

La accesibilidad del sitio web significa que los sitios web, las herramientas y la tecnología pueden ser percibidos, entendidos, navegados, interactuados y contribuidos por todos, independientemente de quiénes sean. La accesibilidad apoya la inclusión social de aquellos que de otro modo podrían estar en riesgo de aislamiento y, cuando los sitios web y las herramientas web se diseñan de manera inclusiva, las personas con discapacidad pueden utilizarlos plenamente.

En este articulo:

1. ¿Por qué debemos hacer que nuestros sitios web sean más accesibles?

La Accesibilidad es Ley

La accesibilidad es un derecho humano

2. Problemas comunes de accesibilidad

Audiencia

Viendo

Comprensión

navegando

Discurso

3. ¿Cómo hacemos que nuestros sitios web sean más accesibles?

4. Maneras de escribir páginas web que sean accesibles para todos

5. Pautas de accesibilidad al contenido web (WCAG)

6. Resumen de las WCAG: formas de hacer que el contenido web sea accesible para todos

7. ¿Cuándo es justificable no cumplir con las WCAG?

8. Prueba de accesibilidad web

9. 6 formas sencillas de probar manualmente la accesibilidad web

Volver arriba

1. ¿Por qué debemos hacer que nuestros sitios web sean más accesibles?

Debemos hacer que nuestros sitios web sean más accesibles por 3 razones principales:

• Es bueno para el lector: todo el mundo tiene derecho a usar Internet de una manera tan completa como cualquier otra persona y, cuando esto sucede, aumenta la calidad de vida y la felicidad del lector. Se sienten conectados e incluidos porque estamos haciendo que nuestros sitios web sean “coherentes con las obligaciones de la sociedad de eliminar la discriminación y promover los derechos humanos”.

• Es bueno para el negocio: si más personas pueden acceder al contenido que creamos para nuestros clientes, más personas estarán expuestas a la marca para la que estamos creando el sitio web. Una mayor exposición significa mayores ventas, pero además de esto, una mayor accesibilidad muestra que la marca para la que estamos creando tiene en mente la inclusión. Esto conducirá a un aumento en la percepción positiva de la marca.

• Es un derecho humano y un requisito de la ley. Esto es extremadamente importante.

Volver arriba

La Accesibilidad es Ley

Según la sección 24 de la Ley de Discriminación por Discapacidad (1992), es “ilegal que una persona que, ya sea a cambio de pago o no, proporcione bienes o servicios, o ponga a disposición instalaciones, discrimine a otra persona por motivos de discapacidad de la otra persona:

1. al negarse a proporcionar a la otra persona esos bienes o servicios oa poner esas instalaciones a disposición de la otra persona;
2. en los términos o condiciones en que la persona mencionada en primer lugar proporcione a la otra esos bienes o servicios o ponga esas instalaciones a disposición de la otra persona; o
3. en la forma en que la persona mencionada en primer lugar proporciona a la otra esos bienes o servicios o pone esas instalaciones a disposición de la otra persona.

En lenguaje sencillo, esto significa que una empresa puede ser procesada en virtud de la Ley si decide no poner las instalaciones a disposición de una persona en función de su discapacidad, dentro de lo razonable.

Volver arriba

La accesibilidad es un derecho humano

Además de la Ley de Discriminación por Discapacidad, la accesibilidad en todas sus formas es un derecho humano. La Convención sobre los derechos de las personas con discapacidad (CDPD) fue adoptada por las Naciones Unidas en 2006. El artículo (4)(1)(g) de la Convención llama a las partes a “Promover el acceso de las personas con discapacidad a nueva información y comunicaciones tecnologías y sistemas, incluido Internet”. Australia fue uno de los primeros signatarios de la Convención pero, como señala la Comisión Australiana de Derechos Humanos (AHRC), todos tenemos la obligación de defender los derechos establecidos por la convención.

Volver arriba

2. Problemas comunes de accesibilidad

El contenido en línea generalmente se compone de texto, audio, video e imágenes, y generalmente en un formato no lineal (en otras palabras, los sitios web no suelen estar en una lista de arriba a abajo de la página, hay enlaces, secciones separadas, botones y otros medios repartidos) y varios elementos de un sitio web serán inaccesibles para algunas personas.

Audiencia

Una persona con discapacidad auditiva o sorda no necesariamente comprenderá los clips de audio o los clips de vídeo que contengan audio. El audio puede ser música, sonidos que transmiten un mensaje, como partituras musicales, o ruidos que se activan cuando se hace clic en elementos de una página web, o habla, o incluso sonidos de advertencia de la computadora.

Viendo

Del mismo modo, una persona con discapacidad visual o ceguera parcial o total no necesariamente podrá leer un texto, ver videoclips o navegar por un sitio web de manera eficiente. Pueden tener dificultades para leer textos con poco contraste o pueden ser sensibles a las imágenes intermitentes.

Comprensión

Comprender un sitio web se reduce a la complejidad del sitio web. Mucha gente tendrá dificultades para navegar por un sitio web si tiene una jerga inexplicable, fuentes pequeñas, lugares poco obvios para hacer clic y moverse por el sitio web, malos sistemas de backlinks, falta de estructura de títulos, mal contraste de texto, porciones ocultas. Una persona puede tener problemas en estas áreas si tiene problemas cognitivos, falta de experiencia con la tecnología o tiene problemas de visión. Sin embargo, cualquiera puede tener problemas en un sitio web con cualquiera de estos defectos de diseño.

navegando

Un sitio web se vuelve difícil de navegar con deficiencias de diseño, pero una persona que vive con un desafío cognitivo o que tiene desafíos visuales tendrá dificultades para navegar por una página web. Aún más personas pueden tener factores de función motora que afecten su capacidad para usar un mouse o un teclado.

Discurso

Algunas partes de Internet se activan por voz y, recientemente, las voces se están utilizando como una forma de contraseña (autenticación de voz de Centrelink, por ejemplo), pero es posible que este aspecto cada vez mayor del acceso a Internet no sea utilizable por personas con habla limitada o discapacidad auditiva. o que usan el inglés como segundo idioma.

Volver arriba

3. ¿Cómo hacemos que nuestros sitios web sean más accesibles?

Está claro que muchas personas corren el riesgo de ser excluidas de parte, la mayoría o todo el contenido de Internet a menos que los programadores y diseñadores web se esfuercen por encontrar formas de aumentar la inclusión en su producto.

La manera de hacer que nuestros sitios web sean accesibles para tantas personas como sea posible es siguiendo las pautas internacionales para mantenernos dentro de la ley según lo establecido por el World Wide Web Consortium (W3C).

Volver arriba

4. Maneras de escribir páginas web que sean accesibles para todos

Con solo un poco de investigación, los diseñadores y desarrolladores web pueden tomar una mano más activa en la creación de productos que más personas puedan usar. Hay algunos recursos fantásticos disponibles en línea para ayudar con esto y ayudarnos a todos a mejorar en la creación de sitios web que:

• Proporcione títulos de página únicos e informativos
• Use encabezados para transmitir significado y estructura
• Hacer que el texto del enlace sea significativo
• Escriba alternativas de texto significativas para las imágenes.
• Crear transcripciones y subtítulos para multimedia
• Proporcionar instrucciones claras
• Mantenga el contenido claro y conciso

Volver arriba

5. Pautas de accesibilidad al contenido web (WCAG)

W3C es una comunidad internacional donde las organizaciones miembro, el personal de tiempo completo y el público trabajan juntos para desarrollar estándares web. La misión del W3C es llevar la Web a su máximo potencial y ejecuta la Iniciativa de Accesibilidad Web (WAI). Las pautas de WAI para la accesibilidad web son:

• Pautas de accesibilidad al contenido web (WCAG) 2.0: una guía para hacer que los sitios web sean accesibles para personas con discapacidades.
• Mejores prácticas de web móvil (MWBP): una guía para hacer que los sitios web se puedan usar desde un dispositivo móvil.
• Mejores prácticas para aplicaciones web móviles (MWABP): una guía para desarrollar y entregar aplicaciones web en dispositivos móviles.

Los detalles completos de las pautas son muy intrincados y complejos y van mucho más allá del alcance de este artículo. Por esta razón, este artículo resumirá y discutirá los puntos principales de los artículos, como un trampolín para su comprensión de la accesibilidad web y como punto de partida para lecturas adicionales. Aquí están los enlaces a los documentos completos:

WCAG (Pautas de accesibilidad al contenido web) Documento completo

Documento completo de MWBP (mejores prácticas de web móvil)

MWABP (Prácticas recomendadas para aplicaciones web móviles) Documento completo

Quizás se pregunte por qué existen pautas de accesibilidad basadas en la creación de páginas, aplicaciones o herramientas web para dispositivos móviles, pero el W3C y la Comisión Australiana de Derechos Humanos (AHRC) están de acuerdo en que "las personas con discapacidades que usan computadoras tienen limitaciones de interacción similares a las de las personas sin discapacidades que están usando dispositivos móviles”. Hay tanta superposición, de hecho, que el W3C ha creado pautas para dispositivos móviles que se adaptan a personas con diferentes capacidades y desarrollo típico, porque todos enfrentamos problemas de accesibilidad en teléfonos móviles, en comparación con las computadoras.

Volver arriba

6. Resumen de las WCAG: formas de hacer que el contenido web sea accesible para todos

Esta es una manera simple de verlo, una regla general simple: esfuércese por usar múltiples tipos de medios para transmitir cada mensaje en un sitio web en el que trabajamos, para incluir múltiples formas de acceder a un elemento en un sitio web y evitar causar agravio a cualquier condición.

Las WCAG enumeran estos como 4 principios fundamentales que se pueden lograr en un nivel bueno, muy bueno o excelente (indicados en las Directrices como A, AA y AAA respectivamente). En este documento, solo se enumeran las soluciones A y AA, ya que todos los grados 'aprueban' los requisitos de accesibilidad y algunas soluciones AAA tienen un tiempo o un costo prohibitivos. El sitio web del gobierno australiano afirma que cumple con AA y trabaja para cumplir con AAA, por ejemplo.

Para presentar una queja ante las WCAG, la información y el funcionamiento de la interfaz de usuario deben ser:

1. Perceptible (a través de la vista, el sonido o ambos)
2. Operable (por ratón y teclado)
3. Comprensible (la escritura debe ser fácil de entender)
4. Robusto (interpretado por una amplia variedad de agentes de usuario)

Principio 1 – Un sitio web y su navegación deben ser perceptibles

Use alternativas de texto para cualquier contenido que no sea de texto, como:

• Letra grande, Braille, Voz
• simbolos
• Lenguaje más simple

Use alternativas de medios basados ​​en el tiempo para medios basados ​​en el tiempo como:

• Subtítulos pregrabados o en vivo
• descripciones de audio
• lenguaje de señas pregrabado
• descripciones de audio extendidas

Cree contenido web adaptable que se pueda presentar de múltiples maneras sin perder información o estructura:

• Utilice la secuencia de lectura correcta.
• Proporcione equivalentes de texto o audio para las instrucciones que se basan únicamente en la forma, el color, el tamaño, la ubicación visual, la orientación o el sonido.
• Use retrato Y paisaje (a menos que una orientación de pantalla específica sea esencial).
• Etiquete los campos de entrada .

Facilite que los usuarios vean y escuchen el contenido:

• Incluya controles de sonido para audio de más de 3 segundos de duración.
• Use audio de fondo bajo o nulo.
• Separe el primer plano del fondo.
• Solo use color con palabras como medio visual para transmitir información, una acción, una respuesta o un elemento visual.
• Use texto para describir presentaciones visuales.
• Utilice una relación de contraste en la copia de al menos 4,5:1
• Habilite el cambio de tamaño del texto de copia hasta un 200% sin pérdida de contenido o funcionalidad.
• Evite la necesidad de que los usuarios se desplacen en dos dimensiones.
• Espaciado:
  • Interlineado: 1,5 o más
  • Espaciado final de párrafo: 2 x tamaño de fuente o más
  • Espaciado entre letras: 0,12 o más
  • Espaciado entre palabras: 0,16 x fuente o más
• Haga que el contenido flotante sea descartable, flotante y persistente.

Volver arriba

Principio 2 – Un sitio web y su navegación deben ser operables

Haga que el contenido web sea accesible a través del mouse y el teclado:

• Haga que todo el contenido y la funcionalidad estén disponibles mediante un teclado y un mouse .
• Permita el movimiento libre del enfoque del teclado usando el teclado y el mouse.
• Los accesos directos se pueden habilitar o deshabilitar, reasignar o activar solo en foco.

Proporcione a los usuarios suficiente tiempo para leer y usar el contenido:

• Tener la capacidad de apagar, ajustar o extender cada límite de tiempo que establece el contenido.
• Dar al usuario una advertencia sobre el final del límite de tiempo.
• Pause, detenga u oculte la información en movimiento, parpadeante, desplazable o actualizada automáticamente.

Diseñar contenido que no provoque convulsiones o reacciones físicas:

• Los elementos parpadean menos de 3 veces por segundo , o asegúrese de que el destello esté por debajo de los umbrales de destello general y destello rojo.
• Agregue una opción para deshabilitar animaciones no esenciales .

Proporcione formas de ayudar a los usuarios a navegar, encontrar contenido y determinar dónde están:

• Agregue una opción para omitir bloques de contenido repetido.
• Asegúrese de que las páginas web tengan títulos descriptivos precisos .
• Asegúrese de que los componentes enfocables conserven el significado y la operabilidad.
• Asegúrese de que cada enlace se pueda determinar a partir del texto o contexto preciso del enlace .
• Asegúrese de que existan varias opciones de ubicación de páginas web dentro de un sitio web (excepto cuando la página web sea el resultado de un proceso o un paso en él).
• Asegúrese de que el indicador de enfoque del teclado esté visible.

Facilite a los usuarios operar la funcionalidad a través de múltiples entradas más allá del teclado:

• Los gestos de puntero multipunto o basados ​​en rutas se pueden operar con un solo puntero sin un gesto basado en rutas.
• Las etiquetas de texto de las imágenes de texto deben contener el texto que se presenta visualmente.
• La funcionalidad de movimiento del dispositivo o del usuario también puede ser operada por otros componentes de la interfaz de usuario.

Volver arriba

Principio 3 – Comprensible

La información y el funcionamiento de la interfaz de usuario deben ser comprensibles.

Haga que el contenido del texto sea legible y comprensible:

• El usuario puede cambiar el idioma humano predeterminado de cada página web.
• El lenguaje humano de cada pasaje o frase del contenido se puede traducir (excepto los nombres, la jerga y la jerga).

Haga que las páginas web aparezcan y funcionen de manera predecible:

• Los componentes de la interfaz de usuario no inician un cambio de contexto cuando reciben el foco.
• Cambiar la configuración de los elementos no provoca automáticamente ningún cambio de contexto no especificado.
• Los mecanismos de navegación que se repiten en múltiples páginas web dentro de un sitio web ocurren en el mismo orden relativo cada vez, a menos que el usuario inicie un cambio.
• Los componentes que tienen la misma funcionalidad en un sitio web se identifican de forma consistente.

Asistencia de entrada: ayude a los usuarios a evitar y corregir errores:

• Identificar y describir al usuario todos los errores detectados automáticamente.
• Proporcione etiquetas o instrucciones cuando el contenido requiera la intervención del usuario.
• Los errores de entrada se detectan automáticamente y se proporcionan sugerencias de corrección, a menos que pongan en peligro la seguridad o el propósito del contenido.
• Las transacciones jurídicas o financieras son reversibles, comprobadas y confirmadas antes de finalizar.

Volver arriba

Principio 4 – Robusto

El contenido debe ser lo suficientemente sólido como para que pueda ser interpretado por una amplia variedad de agentes de usuario, incluidas las tecnologías de asistencia.

Maximice la compatibilidad con los agentes de usuario actuales y futuros, incluidas las tecnologías de asistencia:

• Los elementos de marcado deben:
  • tener etiquetas de inicio y finalización completas;
  • anidarse de acuerdo con sus especificaciones;
  • no contener atributos duplicados;
• Los ID deben ser únicos, excepto cuando las especificaciones permitan estas características.
• Los elementos de formulario, los enlaces y los componentes generados por los scripts deben poder generarse automáticamente.
• Los estados, las propiedades y los valores deben poder establecerse mediante programación o manualmente.
• La notificación de los cambios en estos elementos debe estar disponible para los agentes de usuario, incluidas las tecnologías de asistencia.
• En el contenido implementado mediante lenguajes de marcado, los mensajes de estado deben poder determinarse mediante programación de modo que puedan presentarse al usuario mediante tecnologías de asistencia sin recibir atención.

Este es un breve resumen de las opciones de accesibilidad que tenemos disponibles en Jezweb. Algunos cumplen con el nivel A y otros son AA, pero todos son alcanzables si se escriben en los procesos de diseño web y redacción desde el principio. Es mucho más rápido y fácil incluir la accesibilidad en una etapa temprana que modificar el trabajo existente.

Volver arriba

7. ¿Cuándo es justificable no cumplir con las WCAG?

Existen límites acordados para la construcción de sitios web accesibles, según lo establecido por la Comisión Australiana de Derechos Humanos. En términos de la Ley de Discriminación por Discapacidad (1992), en algunas (pero no en todas) las circunstancias, las obligaciones en virtud de la DDA de brindar igualdad de acceso están limitadas por el concepto de dificultades injustificables.

En otras palabras, si una empresa no puede permitirse el tiempo o el dinero para mejorar algunos elementos específicos de accesibilidad, y puede probarlo , entonces puede haber una causa para no incluir esos elementos. De lo contrario, depende de nosotros como empresa y como individuos hacer que nuestro contenido sea lo más accesible posible para todos.

Para obtener más información sobre el caso legal, teniendo en cuenta que este enlace no es un consejo legal, solo información general, haga clic en humanrights.gov.au/our-work/disability-rights/world-wide-web-access-disability-discrimination -act-advisory-notes-ver#whatis

Volver arriba

8. Prueba de accesibilidad web

Podemos probar nuestros niveles de accesibilidad web de 2 maneras:

• Herramientas de accesibilidad web (para los procesos de herramientas de accesibilidad web, solo consulte a su gerente de línea)
• Auditorías manuales (Comprobación humana, consulte a continuación)

Al desarrollar o rediseñar un sitio web o una aplicación web, evalúe la accesibilidad desde el principio y durante todo el proceso de desarrollo para identificar los problemas de accesibilidad desde el principio, cuando es más fácil abordarlos. Hay herramientas de evaluación que ayudan con la evaluación. Sin embargo, ninguna herramienta por sí sola puede determinar si un sitio cumple con los estándares de accesibilidad. Se requiere una evaluación humana experta para determinar si un sitio es accesible”. (Sitio web del W3C, 9 de abril de 2021)

Volver arriba

9. 6 formas sencillas de probar manualmente la accesibilidad web

Las pruebas humanas se pueden realizar auditando manualmente un sitio web para verificar el cumplimiento de las WCAG (Pautas de accesibilidad de contenido web de la Iniciativa de accesibilidad web, en caso de que haya olvidado lo que significa).

Los detalles de las WCAG son densos. Hay personas que han dedicado carreras enteras a comprenderlo, pero hay algunas cosas sencillas que puedes hacer para probar la accesibilidad de tu trabajo:

1. Desconecte su mouse y/o apague su trackpad

Interactuar con el sitio usando solo TAB o SHIFT+TAB. para navegar y ENTER para seguir un enlace.

• ¿Puedes interactuar con todos los controles, enlaces y menús usando solo el teclado?
• ¿Puedes ver qué elemento tiene el foco en todo momento?
• ¿El orden de enfoque visual coincide con el orden de interacción previsto?

2. Active el modo de alto contraste: esto también elimina los colores del sitio.

Según la Encuesta de Usuarios con Baja Visión de WebAIM, el 30% de los encuestados afirma que utiliza Modos de Alto Contraste.

• ¿Puedes ver fácilmente cada elemento de la página?
• ¿Puedes navegar por el sitio?
• ¿Puedes leer y comprender todos los elementos de la copia?

3. Desactive Imágenes en la configuración del navegador.

• ¿Tiene sentido el contenido?
• ¿El contenido se vuelve más difícil de entender?
• ¿Falta algún contenido ahora?
• ¿Desaparece algún control importante?

4. Verifique los subtítulos o las transcripciones

• ¿Hay subtítulos en el video directamente o hay un control en el reproductor que activa o desactiva los subtítulos?
• ¿Existe una versión alternativa con audiodescripción o un control en el reproductor que active/desactive la audiodescripción?
• Para videos con mucho diálogo, ¿hay una transcripción de texto en la página o un enlace cerca del reproductor de video que lleva a una transcripción?

Existen otros requisitos para escenarios de solo video y solo audio, pero los anteriores cubrirán la mayoría de los medios en la mayoría de los sitios.

Nota: No solo se debe poder acceder al contenido multimedia en sí, sino también al reproductor. Busque una futura publicación de blog sobre la accesibilidad del reproductor multimedia.

5. Haga clic en Etiquetas de campo

Tenga en cuenta el etiquetado faltante o incompleto, el manejo ineficaz de errores y el control de enfoque deficiente.

Haga clic en la etiqueta de texto adyacente al campo:

• Cuando hace clic en la etiqueta junto a una entrada de texto o área de texto, ¿el cursor entra en el campo?
• Cuando hace clic en la etiqueta junto a un botón de radio o casilla de verificación, ¿eso selecciona la opción adyacente?
• Cuando hace clic en la etiqueta junto a un elemento SELECCIONAR, ¿ese lugar se enfoca en SELECCIONAR?

NB: Debe haber una relación uno a uno entre la etiqueta y el control.

6. Desactive CSS en la configuración del navegador. Las imágenes de fondo desaparecerán

• ¿Desapareció contenido importante o desaparecieron controles, íconos u otros elementos accionables?
• ¿Es ahora difícil entender cosas como mensajes de error u otras señales visuales anteriores?
• ¿Se sigue mostrando el contenido en un orden razonable y fácil de entender?
• ¿Queda algún color, incluido el color de fondo?
• ¿Quedan algunos estilos de presentación de texto?

Seguir estas pautas simples es un gran trampolín, pero es solo una descripción general muy simple. Para obtener información más detallada, siempre debe consultar las WCAG.

Volver arriba

Cómo asegurarte de ser un aliado para aquellos con habilidades diferentes

Solicite una auditoría del sitio web y tenga en cuenta las recomendaciones que surgen de ellos. Jezweb cuenta con un equipo de desarrolladores y diseñadores de sitios web altamente experimentados que tienen experiencia en sitios web accesibles y están personalmente apasionados por hacerlos más accesibles a medida que se desarrolla la tecnología. Para obtener más información sobre funcionalidades específicas del sitio web o preguntas, comuníquese con nuestro equipo para conversar.