Addaw, ir a inicio Donar

Técnica HTML WCAG 2.2

H80Identificar el propósito de un enlace mediante el texto del enlace combinado con el encabezado que lo precede

En resumen

Esta técnica permite que enlaces con textos poco descriptivos («Mapa», «Fotos», «Leer más») resulten comprensibles gracias al encabezado que los precede, por ejemplo el nombre de un hotel o el titular de una noticia. Beneficia a quienes usan lectores de pantalla y navegan por encabezados. Úsela cuando varios bloques de contenido repiten los mismos enlaces, aunque siempre es preferible que el texto del enlace sea claro por sí mismo.

Aplicabilidad

HTML

Descripción

El objetivo de esta técnica es describir el propósito de un enlace a partir del contexto que proporciona su encabezado. El encabezado que precede al enlace aporta contexto a un enlace que, de otro modo, no estaría claro. La descripción permite al usuario distinguir este enlace de otros enlaces de la página web que llevan a otros destinos y le ayuda a decidir si desea seguir el enlace.

Siempre que sea posible, proporcione un texto de enlace que identifique el propósito del enlace sin necesidad de contexto adicional.

Ejemplos

Bloques de información sobre hoteles

La información de cada hotel consta del nombre del hotel, una descripción y una serie de enlaces a un mapa, fotos, cómo llegar, opiniones de los huéspedes y un formulario de reserva.

<h2><a href="royal_palm_hotel.html" id="royal-heading">Royal Palm Hotel</a></h2>
<nav aria-labelledby="royal-heading">
  <ul>
    <li><a href="royal-palm-hotel_map.html">Map</a></li>
    <li><a href="royal-palm-hotel-photos.html">Photos</a></li>
    <li><a href="hroyal-palm-hotel-directions.html">Directions</a></li>
    <li><a href="royal-palm-hotel-reviews.html">Guest reviews</a></li>
    <li><a href="royal-palm-hotel-book.html">Book now</a></li>
  </ul>
</nav>	
<h2><a href="hotel-three-rivers.html" id="rivers-heading">Hotel Three Rivers</a></h2>
<nav aria-labelledby="rivers-heading">
  <ul>
    <li><a href="hotel-three-rivers-map.html">Map</a></li>
    <li><a href="hotel-three-rivers-photos.html">Photos</a></li>
    <li><a href="hotel-three-rivers-directions.html">Directions</a></li>
    <li><a href="hotel-three-rivers-reviews.html">Guest reviews</a></li>
    <li><a href="hotel-three-rivers-book.html">Book now</a></li>
  </ul>
</nav>

Un documento disponible en tres formatos

<h2>Annual Report 2006-2007</h2>
<p> 
  <a href="annual-report-0607.html">HTML</a>
  <a href="annual-report-0607.pdf">PDF</a>
  <a href="annual-report-0607.rtf">RTF</a>
</p>

Sitio web de un periódico

<div class="card-link">
   <h2><a href="market-2023-09-27.html">Stock market soars as bullishness prevails</a></h2>
   <p>This week was a stellar week for the stock market as investing in gold rose 2%.</p>
</div>

Se utiliza un script para localizar cada elemento con la clase card-link y añadir un párrafo adicional con un enlace «Read more» (leer más) al final del div con la clase .card-link, que lleva al mismo destino que el enlace del encabezado.

Pruebas

Procedimiento

Para cada enlace del contenido que utilice esta técnica:

  1. Localizar el elemento de encabezado que precede al enlace.
  2. Comprobar que el texto del enlace, combinado con el texto de ese encabezado, describe el propósito del enlace.

Resultados esperados

  • La comprobación n.º 2 es verdadera.

Cómo lo comprobamos en ADDAW

En las auditorías de accesibilidad de ADDAW revisamos cada criterio de conformidad siguiendo este catálogo de técnicas: comprobamos si la web aplica una técnica suficiente y documentamos cada fallo común con capturas y el código afectado, para que el equipo de desarrollo sepa exactamente qué corregir. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.

Solicitar una auditoría

Fuente y licencia

Traducción al español, no oficial, realizada por ADDAW a partir de la técnica H80 del documento «Techniques for WCAG 2.2» del W3C (versión del repositorio público del W3C a 22/10/2026). Copyright © W3C® (MIT, ERCIM, Keio, Beihang). Se publica conforme a la licencia de documentos del W3C. El texto normativo de referencia es el original en inglés; si detecta un error en la traducción, escríbanos.

Financiado por la unión europea Gobierno de españa red.es Plan de recuperación transformación y resilencia kit digital