Inicia sesión


Como usar aria-label para fines de enlace

Como usar aria-label para fines de enlaceEl objetivo de esta técnica es describir el propósito de un enlace utilizando el atributo aria-label. El atributo aria-label proporciona una forma de colocar una etiqueta de texto descriptivo en un objeto, como un enlace, cuando no hay elementos visibles en la página que describen el objeto. Si hay elementos descriptivos visibles en la página, se debe usar el atributo aria-labelledby en lugar de aria-label. Al proporcionar una etiqueta de texto descriptivo, el usuario puede distinguir el enlace de los enlaces en la página web que conducen a otros destinos y ayuda al usuario a determinar si debe seguir el enlace. En algunas tecnologías de asistencia, el valor de la etiqueta aria se mostrará en la lista de enlaces en lugar del texto del enlace real.

De acuerdo con la especificación WAI-ARIA y la Guía de implementación de las API de accesibilidad de HTML a plataforma, el texto con etiqueta de aria anulará el texto proporcionado dentro del enlace. Como tal, el texto suministrado se utilizará en lugar del texto de enlace de AT. Debido a esto, se recomienda iniciar el texto utilizado en aria-label con el texto utilizado en el enlace. Esto permitirá una comunicación consistente entre los usuarios.

Ejemplo


Describir el propósito de un enlace en HTML usando el elemento aria-label. En algunas situaciones, los diseñadores pueden optar por disminuir la apariencia visual de los enlaces en una página utilizando un enlace más corto y repetido, como "leer más". Estas situaciones proporcionan un buen caso de uso para aria-label, ya que el texto más simple y no descriptivo de "leer más" de la página se puede reemplazar por una etiqueta más descriptiva del enlace. Las palabras "leer más" se repiten en la etiqueta aria (que reemplaza el texto de anclaje original de "[Leer más ...]") para permitir una comunicación constante entre los usuarios.
<h4>Tutoriales En Linea</h4>
<p>Tutoriales En Linea es un portal web de tutoriales, cursos online y de aprendizaje que pretenden simular al maestro mostrando al usuario el desarrollo de algún procedimiento o los pasos para realizar determinada actividad...
<a href="index.html" aria-label="Leer más...">[Leer más...]</a>
</p> 
<p> hagalo usted mismo, tutorias online.
<a href="index.html" aria-label="Leer más...">[Leer más...]</a>
</p>


  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-07-15
  • Categorias: Diseño Web html5 WebSite webmasters Noticias Tutorial



Información
Usuarios que no esten registrados no pueden dejar comentarios, te invitamos a que te registre!






Peinado Pompadour

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-10-12
  • Categorias: Moda Estilo Trucos y tips Noticias Tutorial

Instalación de cableado eléctrico

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-10-12
  • Categorias: Bricolaje Electricidad Noticias Tutorial

Características de la configuración, instalación y mantenimiento de alarmas contra incendios

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-10-12
  • Categorias: Bricolaje Noticias Tutorial

Como crear una web con el lenguaje HTML

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-08-21
  • Categorias: Diseño Web Lenguajes De Programacion CSS3 html5 Html WebSite webmasters Cursos Noticias Tutorial

Curso intensivo para principiantes en HTML5

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-08-03
  • Categorias: Diseño Web html5 Html WebSite Cursos Tutorial

Mejorar la presencia online de tu empresa: curso para principiantes

  • Autor:
  • Editor:
      Tutoriales En Linea
  • Fecha:2019-06-25
  • Categorias: Marketing SEO Cursos Noticias Tutorial