Presidencia de la Nación

Hipervínculos

Los enlaces y los botones son recursos que, bien utilizados, brindan un servicio al usuario y hacen más navegables los contenidos.


En esta página


Qué tipos de hipervínculos usamos en Argentina.gob.ar

En Argentina.gob.ar podemos insertar manualmente dos tipos de hipervínculos:

  • enlace de referencia: lo que conocemos como link.
  • botón: enlace destacado que informa al usuario que va a concretar una acción si hace clic (por ejemplo, descargar un archivo, enviar un formulario o inscribirse a un curso).

Si bien los atajos y los listados son tipos de hipervínculos, usamos esos recursos de navegación exclusivamente para permitir que un usuario pase de una homepage de organismo o una landing de producto o temas a los niveles inferiores de su estructura de pirámide invertida (de un ministerio a sus secretarías, de un producto a sus sección temática) o a un sitio externo. Por eso solo pueden insertarlos los usuarios con rol maquetador.

Enlaces y botones, en cambio, son recursos de navegación que podemos insertar en cualquier parte de un contenido o texto para vincular toda información que al usuario le resulte útil o necesaria, y los pueden insertar usuarios con menos permisos de gestión de contenidos (redactor, editor, editor de servicios).

Volver al índice


El enlace

El enlace es un recurso cliqueable que referencia un contenido (una página, un documento) que se encuentra dentro o fuera de Argentina.gob.ar. Es lo que conocemos como link.

Los contenidos «servicio» publicados en Argentina.gob.ar se listan en la sección «Tramitar».

De acuerdo con Huei-Hsin Wang, de Nielsen Norman Group, los botones activan acciones, mientras que con los enlaces se navega entre páginas.

Los textos de los enlaces deben ser breves e informar qué va a encontrar el usuario si hace clic. Por eso debemos evitar los hipervínculos con textos genéricos, del estilo «hacé clic aquí».

Es incorrecto escribir «Para conocer las actividades que te ofrece el Parque Nacional Los Glaciares, hacé clic acá», porque el enlace no informa qué hay en el destino.

Es incorrecto escribir «Para conocer las actividades que te ofrece el Parque Nacional Los Glaciares, ingresá a su sitio web», porque el enlace es demasiado largo.

Es correcto escribir «Para conocer las actividades que te ofrece el Parque Nacional Los Glaciares, ingresá a su sitio web», porque el enlace es breve y dice con claridad qué hay en el destino.

Los enlaces pueden estar en medio de un párrafo (como en los ejemplos anteriores) o en un párrafo breve aparte.

Querés conocer las actividades que te ofrece el Parque Nacional Los Glaciares?

Ingresá a su sitio web

Si el hipervínculo lleva a un sitio fuera de Argentina.gob.ar o a un archivo pdf y el usuario no debe regresar al contenido que tiene el hipervínculo, es una buena práctica que el enlace abra en la misma pestaña (que «se vaya» de Argentina.gob.ar).

Si el usuario, en cambio, debe permanecer en el contenido de Argentina.gob.ar además de tener abierto el sitio externo o el pdf, podés hacer que el enlace se abra en una nueva pestaña del navegador (así el usuario se «queda» en Argentina.gob.ar en una pestaña a la vez que tiene abierto el enlace de referencia en otra).

Insertá enlaces con markdown

Volver al índice


El botón

El botón es un hipervínculo destacado que le informa al usuario que va a lograr u obtener un resultado tras hacer clic en el recurso.

Por eso en UX se lo denomina «llamado a la acción» (call to action en inglés).

El resultado para el usuario puede ser conocer una información de utilidad (ingresar a un contenido que informa sobre un beneficio, un programa o un trámite), conseguir un documento (descargarlo) o enviar datos en un formulario que completó.

Comparado con un hipervínculo, el botón tiene mayor jerarquía: si el hipervínculo referencia otro contenido o sección, el botón llama la atención del usuario y lo estimula a hacer clic.

El botón siempre funciona en contexto, nunca de forma aislada. Antes del botón debe haber información que le permita comprender al usuario qué va a obtener tras hacer clic.

Por ejemplo: si hay un botón «Descargar» debajo del título de un libro, el usuario interpreta que va a descargar ese libro; si hay un botón «Inscribite» debajo de la descripción de los contenidos de un curso, el usuario interpreta que va a inscribirse a ese curso.

La Ley 26653 de Accesibilidad Web determina que los sitios web públicos deben ser accesibles.

Leé la norma

Los botones pueden tener cuatro colores y tres tamaños.

Los colores tienen una función semántica, no estética; cada color brinda una información diferente al usuario:

El botón azul (.btn-primary) enlaza un contenido informativo dentro de argentina.gob.ar o un archivo descargable.

Descargá el manual

El botón verde (.btn-success) enlaza un formulario en línea, una plataforma transaccional (como las del Sistema Nacional de Turnos o de la ARCA) o un sitio fuera de argentina.gob.ar al que el usuario debe dirigirse sí o sí para conseguir algo (obtener un beneficio, hacer un trámite o inscribirse a un curso o evento).

Inscribite

El botón gris (.btn-link) enlaza un sitio externo.

C3 - Centro Cultural de la Ciencia

También puede enlazar una entrada de un menú de navegación, como los botones «Volver al índice» de esta página que llevan de regreso al menú superior.

El botón rojo (.btn-danger) enlaza una acción de emergencia, una que no se puede revertir o cancela una acción.

Cancelá tu turno

Respecto de los tamaños, el uso más adecuado es el normal.

Llamá la atención

El tamaño más chico llama menos la atención del usuario.

Llamá menos la atención

En casos excepcionales, con prudencia, podés usar el tamaño grande para llamar mucho la atención del usuario.

Llamá mucho la atención

Usado con criterio y con los colores y tamaños correctos, es un recurso útil para ayudar al usuario a que obtenga lo que quiere.

Insertá botones con markdown

Volver al índice

Activar: 
0
Template: 
caritas3
Scroll hacia arriba