Estados y propiedades de ARIA

Esta página enumera las páginas de referencia que cubren todos los atributos de WAI-ARIA discutidos en MDN.

Los atributos ARIA permiten modificar los estados y las propiedades de un elemento tal como se define en el árbol d

Nota: ARIA solo modifica el árbol de accesibilidad, modificando cómo la tecnología de asistencia presenta el contenido a sus usuarios. ARIA no cambia nada sobre la función o el comportamiento de un elemento. Cuando no use elementos HTML semánticos para su propósito previsto y funcionalidad predeterminada, debe usar JavaScript para administrar el comportamiento, el enfoque y los estados ARIA.

Tipos de atributos ARIA

Hay 4 categorías de estados y propiedades ARIA:

  1. Atributos de widgets

  2. Atributos de región en vivo

  3. Atributos de arrastrar y soltar

  4. Atributos de relación

Atributos ARIA globales

Algunos estados y propiedades se aplican a todos los elementos HTML independientemente de si se aplica una función ARIA. Estos se definen como atributos "Globales". Los estados y propiedades globales son compatibles con todos los roles y elementos de marcado base.

Muchos de los atributos anteriores son globales, lo que significa que se pueden incluir en cualquier elemento a menos que se deshabilite específicamente:

Por "deshabilitar específicamente" se refiere a que, todos los atributos anteriores son globales excepto las propiedades aria-label y aria-labelledby, que no están permitidas en elementos con rol presentation ni su sinónimo el rol none.

Estados y propiedades definidas en MDN

Las siguientes son las páginas de referencia que cubren los estados y propiedades de WAI-ARIA discutidos en MDN.

Usando el atributo aria-required

El atributo aria-required es usado para indicar al usuario que un input es requerido en un elemento antes de que un form pueda ser enviado. Este atributo puede ser usado en un form con cualquier elemento HTML típico; no se limita a elementosque tengan un role ARIA asignado.

Utilizando el atributo aria-label

El atributo aria-label se utiliza para definir una cadena que etiqueta el elemento actual. Úselo en los casos en que no haya una etiqueta de texto visible en pantalla. Si hay texto visible etiquetando el elemento, utilice aria-labelledby en su lugar.

Véase también