Una landing page de la A a la Z: estructura, copy y conversión

Nuevo cliente, nueva misión: convertir

La landing de Sereno surtió efecto: el fundador la mostró a su red, y un nuevo cliente empuja la puerta de Studio Mango. Atelier Lume, una marca de velas artesanales de cera de soja, lanza una suscripción mensual — una vela de temporada entregada cada mes — y quiere una landing page que transforme a los visitantes en suscriptores. Esta vez, el director te confía todo: la estructura, el diseño… y los textos. « Una landing que no convierte es un cartel bonito. Quiero un argumentario. »

Es el capítulo donde todo confluye. Tienes el design system, el prototipado, el código, la tipografía, el color, el motion — te falta la dimensión que los diseñadores más descuidan: la persuasión. Una landing page no es un escaparate que presenta; es una conversación ordenada con un visitante escéptico, que termina en una acción única. Cada sección responde a una pregunta que el visitante se hace en ese momento preciso — y el diseño pone en escena esa conversación.

La anatomía de una página que convierte

Imagina al visitante tipo: llega desde un anuncio de Instagram, concede cinco segundos antes de decidir si se queda, y se hace preguntas en un orden previsible. « ¿Qué es esto? » « ¿Es para mí? » « ¿Qué gano yo? » « ¿Por qué creerte? » « ¿Y si no me gusta? » « ¿Cuánto? » La estructura de una landing eficaz no es otra cosa que la respuesta a esas preguntas, en ese orden:

• Hero: la promesa — qué resultado, para quién, en qué se diferencia. Título + subtítulo + CTA + visual. Cinco segundos para convencer de hacer scroll.
• Prueba social temprana: una línea de reaseguro ya en la hero (nota media, número de suscriptores, mención en prensa) — antes incluso de los argumentos.
• Beneficios: de tres a cuatro tarjetas orientadas a resultado, no a características técnicas.
• Funcionamiento: tres pasos simples — la suscripción desmitificada (elijo, recibo, cancelo cuando quiero).
• Testimonios: voces reales, específicas, con nombre y contexto.
• Objeciones y FAQ: responder frontalmente a los frenos — precio, cancelación, alergias, envío.
• Oferta y CTA final: el precio encuadrado por su valor, la garantía y el último botón.

flowchart TD
  H["Hero: la promesa en 5 segundos"] --> PS["Prueba social: por qué creerte"]
  PS --> B["Beneficios: lo que el visitante gana"]
  B --> F["Funcionamiento: 3 pasos simples"]
  F --> T["Testimonios: voces reales"]
  T --> O["Objeciones y FAQ: levantar los frenos"]
  O --> CTA["Oferta y CTA final: pasar a la acción"]

El título hace el 80 % del trabajo

Si el visitante solo lee una cosa, es el título de la hero. Un buen título de landing no es un eslogan creativo: es una promesa de valor — el resultado concreto que el producto aporta, formulado en la lengua del cliente. La estructura que funciona: resultado + especificidad + diferenciación. « Una vela de excepción cada mes, vertida a mano en Francia » gana por goleada a « Ilumina tu día a día », porque el primero dice qué, cómo y por qué esa — el segundo podría vender cualquier cosa, tanto bombillas como yoga.

Desconfía del creativo oscuro: el juego de palabras elegante que pide tres segundos de reflexión ya ha perdido — los tres segundos eran el presupuesto total. La regla de las landings: la claridad vence a la inteligencia. Y es un terreno donde la IA sobresale como generador de volumen: pide veinte títulos, elimina dieciocho, afina los dos supervivientes. La selección sigue siendo tu oficio; la materia prima se vuelve gratuita.

Genera títulos de hero para Atelier Lume — suscripción mensual de velas artesanales de cera de soja, vertidas a mano en Francia, aromas de temporada, cancelable en cualquier momento. Público: urbanos de 28-45 años, sensibles a la artesanía y a los rituales acogedores, decepcionados por las velas industriales.

Da 10 títulos repartidos en 3 ángulos:
- ángulo RITUAL: el placer de la cita mensual
- ángulo ARTESANÍA: la calidad frente a lo industrial
- ángulo SENSORIAL: el ambiente, el aroma, la temporada

Restricciones: de 6 a 10 palabras, resultado concreto + elemento diferenciador, nada de juegos de palabras oscuros, nada de superlativos huecos (« increíble », « revolucionario »).
Para cada título, añade un subtítulo de una frase que precise la oferta, y termina recomendando el mejor dúo con dos frases de justificación.

Beneficios, no características

Segunda ley de la copy: el visitante no compra lo que el producto es, compra lo que el producto cambia para él. « Cera de soja » es una característica; « arde el doble de tiempo, sin humo negro » es un beneficio. « Aromas de temporada » es una característica; « tu salón huele a otoño antes incluso de que te quites el abrigo » es un beneficio. La gimnasia sistemática: para cada característica, preguntar « ¿y entonces? » hasta alcanzar un resultado que el cliente pueda sentir.

La IA hace esta traducción notablemente bien — a condición de darle la materia prima: la lista de características reales Y el retrato preciso del público. Sin público, produce beneficios para todo el mundo (« simplifícate la vida »); con un público encarnado, escribe frases que el cliente habría podido pronunciar él mismo. Y ese es exactamente el objetivo.

La prueba social y el tratamiento de las objeciones

« ¿Por qué creerte? » La respuesta se llama prueba social, y su calidad depende de su especificidad. « ¡Gran producto, lo recomiendo! » no prueba nada — es intercambiable. « La vela de noviembre, canela y madera de cedro, aguantó 6 semanas encendiéndola cada noche » prueba, porque es preciso, vivido, imposible de inventar sin que se note. Elige testimonios que respondan cada uno a una objeción diferente: uno sobre la calidad, uno sobre la duración, uno sobre el servicio de cancelación — la prueba social se convierte entonces en una máquina antiobjeciones.

Las objeciones restantes van a una FAQ estratégica — no una lista de preguntas técnicas, sino el desmontaje frontal de los frenos a la compra: « ¿Puedo cancelar cuando quiera? » (sí, en dos clics), « ¿Y si no me gusta un aroma? » (lo cambiamos gratis), « ¿Cuánto cuesta con el envío? » (precio todo incluido, sin sorpresas). Cada freno levantado en ese punto es un abandono de carrito evitado más abajo.

El CTA: una sola acción, cero fricción

Una landing eficaz tiene un solo objetivo — aquí, iniciar la suscripción — y cada CTA de la página apunta a él. Multiplicar las acciones posibles (suscribirse, seguir en Instagram, leer el blog, descargar una guía) dispersa la atención y hunde la conversión: cada puerta de salida adicional es una fuga. Los enlaces secundarios existen, pero relegados al footer, fuera del camino principal.

La microcopy del botón merece sus cinco minutos de reflexión: « Enviar » o « Validar » no dicen nada; « Recibir mi primera vela » dice el beneficio y compromete. Y alrededor del botón, trata la ansiedad residual — la pequeña línea bajo el CTA que desactiva la última duda: « Sin permanencia · Cancelable en 2 clics · Envío incluido ». Tres reaseguros, ocho palabras, mediblemente decisivas en el momento del clic.

Escribir para el escaneo, no para la lectura

Nadie lee una landing page: se escanea. El ojo baja en zigzag, se engancha a los títulos de sección, a las palabras en negrita, a los inicios de lista — y solo se sumerge en un párrafo si el gancho local lo ha convencido. Consecuencia directa para tu copy: cada título de sección debe portar sentido por sí solo. Si solo se leen los seis títulos de sección, debe entenderse la oferta completa. « Cómo funciona » es un título vacío; « Una vela de temporada en tu casa el 1 de cada mes » cuenta.

El test implacable: el test de los cinco segundos. Muestra la hero cinco segundos a alguien que no conozca el proyecto, oculta la pantalla y pregunta: « ¿Qué es? ¿Para quién es? ¿Qué hay que hacer? » Tres respuestas correctas = la hero funciona. Puedes simularlo con la IA en una primera pasada (« aquí está mi hero; responde como un visitante con prisa que solo la ha visto cinco segundos »), pero nada sustituye a dos humanos reales descubriendo la página.

Ensambla la landing page completa de Atelier Lume en una página HTML/CSS autónoma.

DESIGN SYSTEM: [pega aquí los tokens de Atelier Lume — ambiente cálido artesanal: crema, terracota, marrón profundo]

ESTRUCTURA Y COPY (a integrar tal cual, no reescribir):
1. Hero: título « [título elegido] », subtítulo « [subtítulo] », CTA « Recibir mi primera vela », línea de reaseguro « Sin permanencia · Cancelable en 2 clics · Envío incluido »
2. Banda de prueba social: [placeholder nota media + número de suscriptores POR PROPORCIONAR]
3. Tres beneficios: [pega tus 3 beneficios orientados a resultado]
4. Funcionamiento en 3 pasos: Me suscribo / Recibo mi vela de temporada el 1 de cada mes / Puedo cancelar en cualquier momento
5. Dos testimonios: [TESTIMONIOS DE CLIENTES POR PROPORCIONAR — placeholders visibles]
6. FAQ: 4 preguntas antiobjeciones [pégalas]
7. Oferta: precio todo incluido, garantía de cambio, CTA final

EXIGENCIAS: cada título de sección porta sentido por sí solo (comprensible en escaneo); un solo objetivo de conversión, enlaces secundarios solo en el footer; mobile-first; contrastes AA; microinteracciones sobrias reutilizando transform y opacity.

Medir, y luego iterar

La página en línea no es el final: es el principio del bucle de aprendizaje. Sin hablar siquiera de herramientas de analítica avanzadas, adopta el reflejo de las hipótesis explícitas: « creo que el ángulo ritual convertirá mejor que el ángulo artesanía » es comprobable — dos versiones de hero, una variable cada vez, exactamente la disciplina de iteración del capítulo 3 aplicada a la persuasión. El diseño de conversión no es un arte adivinatorio: es un diálogo entre tus intuiciones, estructuradas por este capítulo, y la realidad medida de los visitantes.

Para Atelier Lume, Studio Mango entrega por tanto tres cosas: la página, el documento de hipótesis (qué ángulo, qué promesa, qué objeciones tratadas — y por qué), y la lista de materiales a proporcionar antes de la puesta en línea (testimonios reales, cifras reales, fotos de las velas). Una agencia que entrega su razonamiento con sus píxeles se vuelve difícil de sustituir — por un competidor o por una IA en bruto.