html - w3school - ¿Cuál es la diferencia entre los atributos aria-label y title?

atributo aria describedby

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Qué es aria-label y cómo debo usarlo? 3 respuestas

Estoy acostumbrado a usar el atributo title="" en mis enlaces / botones / ... para detallarlos. Pero bootstrap usa muchos atributos aria-label="" , por razones de accesibilidad que yo sepa.

Así que subo para crear botones como:

<button
    id="show-raw-result"
    class="btn btn-default btn-sm btn-twigfiddle"
    title="Result was not easily readable so it has been automatically cleaned up, use this button to see the result raw"
    aria-label="Result was not easily readable so it has been automatically cleaned up, use this button to see the result raw">
    <span class="glyphicon glyphicon-asterisk"></span> Show raw result
</button>

Pero copiar / pegar el título para crear una etiqueta aria parece feo. ¿Cuál debería elegir, y por qué?

Answer 1

Las etiquetas ARIA se utilizan para los visitantes discapacitados de su sitio. Es muy bueno de Bootstrap, que lo soportan por defecto.

Las aplicaciones de Internet enriquecidas accesibles (ARIA) definen maneras de hacer que el contenido web y las aplicaciones web (especialmente aquellas desarrolladas con Ajax y JavaScript) sean más accesibles para las personas con discapacidades. Por ejemplo, ARIA permite hitos de navegación accesibles, widgets de JavaScript, sugerencias de formularios y mensajes de error, actualizaciones de contenido en vivo y más.

Fuente: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA

Para responder a su pregunta, cuál debe usar, use solo el title atributo. Porque este atributo se usa si el mouse pasa sobre el botón y muestra el texto del title como información sobre herramientas. Con aria-label no es compatible de esta manera.