La primera versión de una landing de software tenía un H1 enorme y centrado que ocupaba casi toda la pantalla. Más adelante aparecían tres banners de gran tamaño muy seguidos. Cada bloque intentaba llamar la atención y, juntos, conseguían lo contrario: todo parecía tener la misma importancia.
El problema no era solo el tamaño
El hero explicaba qué era el servicio, pero no facilitaba escanear beneficio, prueba y siguiente paso. Los banners repetían fondos, titulares y botones sin introducir suficiente contenido entre ellos.
Una apertura en dos columnas
Reorganicé el inicio con una columna para propuesta, explicación y llamadas a la acción, y otra para una pieza visual o resumen de valor. El título siguió siendo protagonista, pero dejó de ocupar todo el ancho disponible.
Esta composición también permitió incorporar información que ayuda a decidir: para quién es el servicio, qué problema resuelve y cómo empieza el proyecto.
Distribuir las llamadas a la acción
No eliminé las CTA; las situé donde el usuario había recibido suficiente contexto:
- una acción principal en el hero;
- una después de explicar el proceso;
- otra junto a casos o resultados;
- un cierre para solicitar diagnóstico.
De banners a secciones con propósito
Los grandes bloques se transformaron en secciones distintas: enfoque, arquitectura, forma de trabajo y propuesta final. Variar composición y densidad crea ritmo sin depender de colores cada vez más intensos.
Responsive sin reducirlo todo
En móvil las dos columnas se apilan, pero el orden se decide por intención: propuesta, explicación, acción y visual. El tamaño del H1 utiliza valores fluidos y un ancho de línea controlado para evitar palabras aisladas.
Una landing profesional no necesita gritar en cada pantalla. Necesita una secuencia clara que responda dudas y acerque al siguiente paso.