Actualizaciones gub.uy

Ajuste en la Grilla con fondo potencia esta herramienta de diseño

Se ajustó el diseño de la grilla con fondo, ya que el contenedor único no se adaptaba a su altura y generaba un espacio en blanco muy notorio.

La Grilla con fondo es la única que permite usar una imagen de fondo que ocupa toda la superficie; es una estructura diseñada para un impacto visual muy fuerte. La imagen de fondo a toda superficie crea inmediatamente un punto de atención dominante. Eso ayuda a presentar un único mensaje, campaña o llamado a la acción como prioridad absoluta en la página.

Con este ajuste, el contenedor se alinea correctamente, mejorando la presentación visual y la coherencia del diseño. La imagen debe tener un tamaño mínimo de 1280x200 px y un peso menor a 2 MB. La grilla muestra tres columnas pero solo se puede ocupar una de las 3 columnas con uno de los siguientes contenedores:  Acceso destacado, Destacado 3, Destacado 4, Formato completo, Agenda, Listado de enlaces, Listado de accesos, Listado de trámites y Datos numéricos.

Esta herramienta estructurada para dar mucho peso visual a un mensaje específico propone un uso controlado del contraste entre imagen y texto o botón. Los contenedores permitidos están pensados para leer sobre esa imagen sin saturar.

El requisito técnico de tamaño mínimo y peso controla la calidad visual y la performance. 1280 px de ancho evita baja resolución en pantallas grandes; menos de 2 MB evita cargas muy pesadas que afectarían velocidad.

Cuándo y cómo conviene usarla la Grilla con fondo
  • Campañas, eventos, convocatorias, mensajes urgentes o tan importantes que merecen prioridad visual absoluta. La foto no es solo adornar: es el contexto emocional o simbólico que sostiene ese único mensaje.
  • Si se cuenta con fotografía o imagen de alta calidad que transmita la identidad, el tema o el tono que se quiere resaltar. El objetivo no es embellecer por embellecer, sino que la foto aporte significado semántico y refuerce el contenido del botón o texto.
  • Cuando se necesita un punto de entrada muy claro hacia otra sección o formulario. El botón o enlace es el actor central; la foto atrae, el botón guía.
A tener en cuenta
  • Accesibilidad y legibilidad: con imágenes de fondo siempre hay que revisar contraste de texto o botones. Se aconseja asegurar suficiente contraste y evitar que la foto dificulte la lectura.
  • Si no cuentan con una foto relacionada con el mensaje, la grilla perderá poder. Ese requisito de la foto hace que la grilla sea poderosa, pero también exige buenas imágenes y planificación.
     

Etiquetas