Botón para abrir el Menú Botón para cerrar el Menú
Logo da empresa Alura
Iniciar Sesión Nuestros Planes
Formaciones Conoce a Luri
  • Programación _
  • Front End _
  • Data Science _
  • DevOps _
  • Innovación y Gestión _
Artículos de Tecnología > Front End

Directrices de Accesibilidad web

Directrices de Accesibilidad web
Tatiani Meneghini
Tatiani Meneghini
26/10/2022

Compartir

Imagen ilustrada con logos de accesibilidad

Cuando el tema es accesibilidad web lo que existe técnicamente son documentos con sugerencias para identificar los problemas de accesibilidad y algunas recomendaciones con soluciones más accesibles. Esos documentos orientan a los desarrolladores y diseñadores para utilizar algunos recursos disponibles que van a depender de cada aplicación web que estén involucrados.

Vamos a hablar de algunos de esos documentos, de manera a aclarar sus características generales y sus estructuras más generales.

WCAG

La Guía de Accesibilidad de Contenido Web (en inglés Web Content Accesibility Guidelines) tiene como objetivo identificar e implementar técnicas para quitar problemas de accesibilidad para personas con discapacidad. Es un documento extenso, además existen textos complementarios y está orientado en relación con la distinción de contenido web.

Principios

La base del WCAG es definido por 4 principios:

  1. Perceptible - representan las informaciones y los componentes de la interfaz percibidas por el usuario. Ejemplos: campos de un formulario, contenido textual como alternativa de contenidos no textuales.
  2. Operable - los componentes de la interfaz y la navegación por el usuario deben ser operables. Ejemplo: navegación por el teclado.
  3. Comprensible - posibilitar la información correcta para que el usuario no tenga pérdida de comprensión del contenido. Ejemplo: uso adecuado de los colores.
  4. Robustez - el contenido debe ser robusto para ser interpretado de manera confiable por una amplia variedad de usuarios. Es aquí que se incluye el uso de las tecnologías asistidas, como por ejemplo, lectores de pantalla.

Directrices

Para dejar el contenido web en conformidad con los cuatro principios arriba descritos, es necesario proporcionar objetivos básicos para cada uno de ellos. De esa manera se encuentran las 4 diretrizes agrupadas en sus temas específicos:

Directriz 1.1 Alternativas en texto - fornece opciones para cualquier contenido textual. Ejemplos: tamaño mayor en los textos, braille, habla, símbolos o lenguajes más simples.

Directriz 2.1 Accesible por teclado - tornar posible que todas funcionalidades estén disponibles por la navegación con el teclado.

Directriz 3.1 Legible - el contenido textual debe ser legible y comprensible.

Directriz 4.1 Compatible - tornar compatible entre los actuales y futuros agentes de usuarios, incluyendo tecnologías asistidas.

Criterios de éxito

Son 3 niveles de conformidad para cada directriz:

  • Nivel A - nivel mínimo de conformidad. Ya alcanza un gran conjunto de barreras de accesibilidad para que algunas personas con discapacidad logren acceder al contenido web.
  • Nivel AA - segundo nivel con una ampliación mayor que el nivel A. Más personas pueden acceder al contenido
  • Nivel AAA - satisface los criterios de los niveles anteriores, contemplando más personas. No se recomienda que sea el nivel utilizado como política de accesibilidad para sitios web sino que sólo algunas áreas cuando sea necesario.

WAI-ARIA

Con la evolución de los recursos técnicos de aplicaciones web ha cambiado también la idea de cargar una aplicación en su totalidad. Surgió la necesidad de identificar y tratar los eventos que ocurren sólo en áreas específicas de la página web. De esa manera este documento fue creado para los contenidos dinámicos de aplicaciones web, sigla que significa Aplicación de Internet Enriquecida Accesibles (en inglés Accessible Rich Internet Applications).

La WAI-ARIA ofrece reglas para tornar las aplicaciones web accesibles, divididos en dos categorías.

Atributo role

El atributo rolees la representación semántica de su función. Así que un elemento es definido por una expectativa de comportamiento con base en su aplicación. Ejemplo: role=img que define el comportamiento de imágen de un elemento.

Pueden tener papeles: abstractos, de widget, de estructura de documento, de áreas de marcación, de regiones activas y de ventana emergente.

Estados y propiedades

Son atributos con valores relacionados a los papeles definidos por el atributo role, que proporciona información para el usuario por su tecnología asistida. Pueden ser atributos: de widget, de regiones activas y de relación.

Otras directrices

En resúmen hay otras directrices o buenas prácticas sobre la accesibilidad web para el mundo. Además, hay algunas guías de sugerencias o de evaluaciones sobre accesibilidad web publicadas por los gobiernos de distintos países que se adecuan a las leyes de ellos, como:

  • Argentina: https://www.argentina.gob.ar/jefatura/innovacion-publica/onti/accesibilidad-web

  • Chile: https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=&ved=2ahUKEwiO3eXVlfD6AhVwrJUCHWBMCI8QFnoECBMQAQ&url=https%3A%2F%2Fwww.senadis.gob.cl%2Fdescarga%2Fi%2F3676%2Fdocumento&usg=AOvVaw3SoMA3UJ2CIMkzy5TjRCGy

  • Colombia: https://gobiernodigital.mintic.gov.co/692/articles-160770_Directrices_Accesibilidad_web.pdfMexico: https://www.gob.mx/wikiguias/articulos/accesibilidad-web

  • Peru: https://www.gob.pe/975-accesibilidad-web

  • Uruguay: https://www.gub.uy/ayuda/politicas-y-gestion/accesibilidad-web

ATAG

Sigla de Authoring Tool Accesibility Guideliness ofrece un documento específico para la creación de herramientas que generan contenido accesible. Puede ser un software de edición HTML.

WCAG-EM

Sigla de Website Accesibility Conformance Evaluation Methodology ofrece una orientación sobre la evaluación de conformidad con las Directrices del WCAG 2.0. No es una herramienta de validación sino que una guía para orientar los responsables por auditar la accesibilidad de las páginas web. .

COGA

Sigla de Cognitive and Learning Disabilities Accesibility aborda técnicas de accesibilidad web para contemplar a las personas con discapacidades neurológicas, limitaciones cognitivas y dificultades de aprendizaje.

Mobile Accesibility

Directrices de accesibilidad dirigidas para los dispositivos móviles del propio W3C.

Game Accesibility guideliness

Trata de los tópicos relacionados a los juegos en la web con buenas sugerencias de desarrollo para eliminar las barreras de accesibilidad.

Foto de perfil

Tatiani Meneghini

Soy instructora de accesibilidad web y layouts responsivos en Alura Latam y soy desarrolladora de software. Soy apasionada por el conocimiento a través de sus múltiples plataformas y tecnologías.

Tatiani Meneghini
Tatiani Meneghini

Soy licenciada en Letras (Portugués y Español) en la USP y en Análisis y Desarrollo de Sistemas de Información en la Facultad Impacta. Actuo como Desarrallodora de Software e instructora en Alura Latam.Me encanta compartir conocimiento y contribuir más con el área de desarrollo web.

Artículo Anterior
¿Que es GitOps?
Siguiente Artículo
Accesibilidad web y el posicionamiento en motores de búsqueda

Ver otros artículos sobre Front End

Navegación

  • Planes
  • Instructores
  • Blog
  • Política de privacidad
  • Términos de uso
  • Sobre nosotros
  • Preguntas frecuentes

¡CONTÁCTANOS!

  • ¡Quiero entrar en contacto!

Blog

  • Programación
  • Data Science
  • Front End
  • Innovación y Gestión
  • DevOps

AOVS Sistemas de Informática S.A CNPJ 05.555.382/0001-33

SÍGUENOS EN NUESTRAS REDES SOCIALES

YouTube Facebook Instagram Linkedin Whatsapp Spotify

NOVEDADES Y LANZAMIENTOS

Aliados

  • Programa de aceleração Scale-Up Endeavor
  • En Alura somos unas de las Scale-Ups seleccionadas por Endeavor, programa de aceleración de las empresas que más crecen en el país.
  • Growth Academy 2021 do Google For Startups
  • Fuimos unas de las 7 startups seleccionadas por Google For Startups en participar del programa Growth Academy en 2021
Alura

Powered by

Caelum

AOVS Sistemas de Informática S.A CNPJ 05.555.382/0001-33

SÍGUENOS EN NUESTRAS REDES SOCIALES

YouTube Facebook Instagram Linkedin Whatsapp Spotify

Cursos

Cursos de Programación
Lógica de Programación | Java
Cursos de Front End
HTML y CSS | JavaScript | React
Cursos de Data Science
Data Science | Machine Learning | Excel | Base de Datos | Data Visualization | Estadística
Cursos de DevOps
Docker | Linux
Cursos de Innovación y Gestión
Transformación Ágil | Marketing Analytics

Alura

  • Educação em Tecnologia

    • logo fiap FIAP
    • logo casa do codigo Casa do Código
    • logo pm3 PM3 - Cursos de Produto
  • Mais Alura

    • logo alura start START BY Alura
    • logo alura lingua Alura Língua
    • logo alura para empresas Alura Para Empresas
    • logo alura latam Alura LATAM
  • Comunidade

    • logo tech guide Tech Guide
    • logo 7 days of code 7 days of code
    • logo Hipsters ponto Jobs Hipsters ponto Jobs
  • Podcasts

    • logo Hipster Network Hipster Network
    • logo Hipsters ponto Tech Hipsters ponto Tech
    • logo Dev sem fronteiras Dev sem Fronteiras
    • logo Like a Boss Like a Boss
    • logo IA Sob Controle IA Sob Controle
    • logo Mesa de Produto Mesa de Produto
    • logo Decode Decode
    • logo FIAPCast FIAPCast