Link

El Link lleva a la persona a otra página, sección o documento. Se muestra siempre subrayado y en color de marca, en tres tamaños.

Propiedades y configuraciones

Cuando usarlo

Úsalo para navegar a otra página o recurso; por ejemplo, la ficha de un trámite, los requisitos de un beneficio, un documento u otro sitio del Estado. Puede ir dentro de un párrafo o como acción de navegación secundaria junto a un botón.

Si la acción envía, guarda o modifica datos, usa Button.

Buenas prácticas

Recomendado: Describe el destino en el texto del enlace

El texto debe anticipar a dónde lleva, para decidir sin leer todo el párrafo y entenderlo fuera de contexto.

Recomendado: Avisa cuando el enlace abre otro sitio o un archivo

Indica en el texto si lleva a un sitio externo, abre una pestaña nueva o descarga un documento (formato y peso).

Recomendado: Usa el tamaño acorde al texto que lo rodea

Dentro de un párrafo, el enlace tiene el tamaño del texto; los tamaños mayores quedan para enlaces sueltos destacados.

Recomendado: Agrupa enlaces relacionados en una lista

Varios destinos relacionados se leen mejor como una lista corta que enterrados en un párrafo largo.

Recomendado: Usa un tooltip si el destino no es evidente

Cuando el texto del enlace es corto o técnico, como el número de una ley, un tooltip puede anticipar a dónde lleva. Solo complementa: el enlace debe entenderse sin él.

Malas prácticas

No recomendado: No uses textos genéricos como “aquí” o “ver más”

No dicen nada del destino y, listados por un lector de pantalla, varios “aquí” son indistinguibles.

No recomendado: No uses un Link para acciones

Enviar, pagar o confirmar son acciones, no destinos: van en un Button, no en un enlace.

No recomendado: No enlaces frases o párrafos completos

Enlazar oraciones largas dificulta la lectura. Enlaza solo las palabras que describen el destino.

No recomendado: No pongas demasiados enlaces en un mismo texto

Un párrafo lleno de enlaces distrae del mensaje y aumenta el riesgo de que la persona abandone el trámite.

No recomendado: No saques a la persona de un formulario a mitad de camino

Un enlace que abre otra página en la misma pestaña puede hacer perder lo que ya se completó. Da la información en el mismo formulario o, si debe ir a otra página, ábrela en otra pestaña y avísalo.

Recomendaciones de accesibilidad

Usa <a href> real
El componente se aplica sobre un <a> con href. Sin href el enlace no recibe foco ni se anuncia como enlace; no uses .cl-link en <span> o <div> con eventos de clic.

Que el texto tenga sentido fuera de contexto
Los lectores de pantalla permiten listar todos los enlaces de la página. Cada texto debe identificar su destino por sí solo, sin depender de la frase que lo rodea.

Anuncia pestañas nuevas y descargas en el texto
Si usas target="_blank" o el destino es un archivo, dilo en el texto visible (“abre en una pestaña nueva”, “PDF, 240 KB”), para que nadie pierda el contexto sin aviso.

No cambies el subrayado
El subrayado permite distinguir el enlace del texto sin depender del color (criterio de uso del color de WCAG). No lo elimines ni lo uses como énfasis en textos que no son enlaces.

Mantén nombres únicos para destinos distintos
Dos enlaces con el mismo texto deben llevar al mismo lugar. Si los destinos difieren, diferencia también el texto.

Cuida el enlace dentro de textos largos
Enlaza frases cortas y precisas: son más fáciles de activar con puntero o toque y más fáciles de reconocer para personas con baja visión o dificultades de lectura.