gub.uy ayuda Sitio de apoyo para la comunidad de referentes

¿Cuándo usar botones con estilo en lugar de enlaces simples?

Los botones deben utilizarse cuando el enlace cuando el usuario debe realizar una tarea concreta o se espera una interacción directa. Ejemplos:
●    Acciones clave: “Iniciar trámite”, “Enviar formulario”, “Descargar documento”.
●    Llamadas a la acción (CTA): “Conocer más”, “Ver calendario”, “Acceder al portal”.
●    Accesos destacados: enlaces a  otros sitios, plataformas externas o secciones prioritarias.
Evitar el uso de botones para enlaces que simplemente llevan a otra página informativa sin urgencia ni relevancia especial.

Criterios de destaque

Para decidir si un enlace debe destacarse como botón, considerar:
●    Jerarquía visual: ¿Es una acción principal en la página?
●    Frecuencia de uso: ¿Es una acción que los usuarios realizan con frecuencia?
●    Contexto de navegación: ¿El botón ayuda a guiar al usuario en su recorrido?
Evitar el uso excesivo de botones, porque puede generar ruido visual y dificultar la comprensión del contenido.
 

Buenas prácticas de uso por estilo

1.  Primario — uso y reglas

Uso: la acción más importante del contenido (Call to action real dentro del contenido). Ej.: “Descargar informe”, “Inscribirse al registro”, “Acceder a ficha”.

Máximo: 1 por bloque de contenido (ej. 1 por noticia ).

Ubicación recomendada: al final del contenido justo después del párrafo que explica la acción.

Redacción: verbo + objetivo, 3–5 palabras máximo.

Ejemplo de microtexto: “Acceder a informe completo”.

2. Secundario — uso y reglas

Uso: acciones relevantes pero subordinadas a la primaria: por ejemplo “Otros recursos”, “Ficha técnica”, “Contactar responsable”.

Máximo: 1–2 por bloque, siempre menos visual que el primario.

Ubicación: cerca del primario o en un listado de recursos al final.

Redacción: clara y breve; evitar ambigüedades.

3. Inverso — uso y reglas

Variante visual pensada para dar contraste sin cambiar el fondo de página (es el único estilo que cambia de blanco a azul si nos paramos sobre él)

Uso: cuando necesitás otra forma de destacar que no compita con el primario, por ejemplo para una acción auxiliar con importancia media.

Regla: no usar más que el primario por página; usar Inverso sólo si aporta jerarquía visual clara.

4. Blanco — uso y reglas

Estilo más discreto (normalmente apariencia menos saturada) pensado para acciones de bajo peso dentro del contenido.

Uso: enlaces-botón informativos (p. ej. “Acceder a listado de preguntas”, “Cronograma”) cuando no se necesita un peso visual grande.

Regla: evitar uso de Blanco si la acción es "crítica"; no sustituir a Primario por estética.

5. Enlaces externos — uso y reglas

Uso obligatorio cuando el destino es fuera de gub.uy.

6. Abrir en nueva ventana (Enlace simple)

Es el hipervínculo tradicional, sin aplicar estilo de botón.
Sigue siendo una opción válida y necesaria, sobre todo para casos donde no se busca destaque visual sino simplemente dar acceso complementario a otro contenido.
Se usa cuando el objetivo no requiere destaque visual ni una llamada a la acción principal.

Cuándo usarlo

• Enlaces dentro del cuerpo de texto (por ejemplo: “más información en el portal del MEC”).
• Enlaces a referencias, fuentes, notas complementarias, documentos o sitios externos que amplían información, pero no son el foco principal del contenido.
• Cuando se busca mantener una lectura fluida, sin interrumpir con elementos visuales (botones).
• En textos donde ya existen botones destacados y no se desea recargar la página con más llamados visuales.

Recomendaciones editoriales

• Si el enlace está dentro de un párrafo, no usar mayúsculas ni puntos finales.
• Evitar duplicar el mismo enlace más de una vez en el texto.

Reglas comunes para todos los botones

• No usar punto final (.) dentro del texto del enlace-botón.
• Separación del texto: poner el enlace botón en su propia línea o con suficiente espacio vertical para evitar que rompa la lectura. Ej.: párrafo explicativo + salto de línea + botón.
• Máximo de botones por contenido: sugerencia práctica — máx. 2 botones “importantes” (1 primario + 1 secundario). Si hay más recursos, listarlos como enlaces de texto normal o en una lista de recursos.
• Texto del enlace: evitar “Clic aquí” o “Más”; preferir “Acceder al informe”, “Leer guía”, “Informe completo”.  

Al publicar, comprobar:

• ¿La acción del botón es realmente la principal del contenido? → si no, usar Secundario o enlace normal (Opción abrir en ventana nueva).
• ¿El texto del botón es claro y tiene verbo?  si no, reescribir.
• ¿Hay más de 2 botones con peso visual en la misma página?  Reducir.
• ¿El botón está en su propia línea o tiene separación suficiente? Ajustar.   

Casos erróneos a evitar

• Usar estilos para enlaces internos sin relevancia (por ejemplo, “Más noticias”).
• Aplicar múltiples estilos en una misma página sin criterio claro.
• Utilizar enlaces botones en exceso porque genera confusión visual.
• Usar enlaces botones en párrafos de texto, interrumpiendo la lectura.