¿Cuál es la diferencia entre los atributos aria-label y title? [duplicar]


Esta pregunta ya tiene una respuesta aquí:

Estoy acostumbrado a usar el atributo title="" en mis enlaces/buttons/... para detallarlos. Pero bootstrap usa muchos atributos aria-label="", por razones de accesibilidad hasta donde yo entendí.

Así que vengo a 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 se ve simplemente feo. ¿Cuál debo elegir y por qué?

Author: Deduplicator, 2015-01-15

1 answers

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

Las Aplicaciones de Internet Enriquecidas accesibles (ARIA) definen formas de hacer Web contenido y aplicaciones web (especialmente las desarrolladas con Ajax y JavaScript) más accesible para las personas con discapacidad. Por ejemplo, ARIA permite puntos de referencia de navegación accesibles, widgets JavaScript, formulario sugerencias y mensajes de error, actualizaciones de contenido en vivo, y mas.

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

Para responder a tu pregunta, cuál debes usar, usa solo el atributo title -. Debido a que este atributo se utiliza si el ratón pasa por encima del botón y muestra el texto de title como una información sobre herramientas. Con aria-label no se soporta de esta manera.

 12
Author: tjati,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-01-14 22:28:09