Saltar al contenido

Above the fold: cómo revisar la primera pantalla de una landing

Una guía para diseñadores y agencias: qué explicar al abrir una landing, cómo elegir la imagen y cómo revisar móvil sin meter toda la página arriba.

PlatformActualizado
Above the fold: cómo revisar la primera pantalla de una landing

Above the fold es la parte de una página que se ve antes de desplazarse. No tiene una altura fija: cambia con la pantalla, el navegador y la configuración de la persona. Al diseñar una landing para un cliente, úsala como una pregunta de comunicación: ¿qué entiende alguien nada más llegar?

El primer bloque debe situar la oferta y permitir decidir si merece seguir. No necesita contener todos los beneficios, el catálogo completo y cada posible llamada a la acción. El resto de la página también forma parte de la explicación.

Define qué tiene que quedar claro

Escribe una frase sobre qué se ofrece y otra sobre para quién o en qué situación sirve. Comprueba que el título, la imagen y el siguiente paso responden al mismo encargo.

Si una campaña promete fotografía para restaurantes, abrir con una composición de bodas, retratos y edificios obliga a la persona a buscar la conexión. Una imagen de ese tipo de trabajo, acompañada de un titular específico, permite presentar el servicio con menos ambigüedad. Es un criterio de coherencia, no una garantía de conversión.

Elige una imagen por su función

En un ejemplo ilustrativo, una agencia prepara la página de un fabricante de mobiliario. Puede necesitar mostrar el producto completo, un detalle constructivo o cómo queda en un espacio. Esas imágenes contestan preguntas distintas; decide cuál necesita resolver primero el visitante.

Revisa también el recorte móvil. Si desaparece el elemento que justificaba la imagen, cambia la composición o usa otra variante. Conserva la identificación del original para que el siguiente diseñador pueda preparar adaptaciones sin partir de una captura de la web.

Revisa una secuencia, no una captura aislada

Abre la página en móvil y escritorio con contenido real. Después:

  1. Lee el titular y explica con tus palabras qué se ofrece.
  2. Comprueba que la imagen aporta información o contexto al mensaje.
  3. Sigue el CTA y verifica que cumple lo que anuncia.
  4. Desplázate: debe resultar comprensible dónde continúa la explicación.
  5. Amplía el texto y revisa que no se oculten datos o controles importantes.

Un banner de consentimiento, una traducción más larga o el menú pueden cambiar el espacio disponible. Inclúyelos en la revisión en vez de aprobar únicamente una maqueta limpia.

Presenta al cliente decisiones, no reglas universales

En la entrega, explica qué pregunta resuelve el primer bloque, qué información aparece después y por qué se eligió la imagen. Marca como hipótesis lo que todavía requiera observar a usuarios. No afirmes que nadie hace scroll ni que todo tiene que caber en un número concreto de píxeles.

Pide a una persona del público previsto que describa la oferta y encuentre cómo continuar. Si su explicación no coincide con la intención, revisa el mensaje antes de añadir más elementos. La legibilidad ayuda a comprobar el conjunto de texto y presentación.