Enlaces

Un elemento interactivo con funcionalidad de navegación. Al hacer clic, lleva al usuario a otra página de un servicio externo o interno. Con menor frecuencia, navega al usuario a una sección diferente de la página.

Tiene tres tipos: normal (acento), primario (negro) y secundario (gris).

Normal

Es el patrón de usuario más común y conocido. Se utiliza para distinguir visualmente elementos dentro de texto, tablas y como parte de la navegación. También se usa en páginas de error y estados nulos.

Primario

Se utiliza cuando es obvio para el usuario que un elemento es interactivo, pero los enlaces de color acento sobrecargarían visualmente la interfaz y alterarían el equilibrio de los elementos de la página.

Secundario

Similar a los enlaces primarios, este tipo se utiliza cuando es obvio para el usuario que el elemento es interactivo y el objetivo no es distraer al usuario de los elementos de énfasis de la página. Generalmente se usa en breadcrumbs o al mostrar atributos secundarios.

Estados

Los enlaces siempre tienen dos estados: por defecto y al pasar el ratón por encima (hover).

Frame 507123500.jpg

Puedes habilitar el etiquetado para enlaces visitados, si es necesario.

Se puede usar como:

  • elementos independientes
  • parte del texto

Puede incluir un icono para indicar un enlace externo

Frame 507123501.jpg

Tamaño

La fuente utilizada para los enlaces debe ser proporcional al texto circundante y alinearse con la jerarquía general de la página.

Recomendaciones

El texto del enlace debe ser autoexplicativo incluso cuando se usa sin el resto del texto y debe indicar al usuario a dónde lleva el enlace (nombre del servicio, título o descripción de la sección).

AnteriorEtiqueta
SiguienteLista y elemento de lista