Cómo crear un sitio web solo frontend con formularios Lumo (sin servidor)

Los sitios modernos suelen ser frontend puro: HTML, Astro, Hugo o una exportación estática de Next.js en Netlify, Vercel o GitHub Pages. Obtienes velocidad y bajo coste—pero en cuanto necesitas un formulario de contacto, los tutoriales te empujan hacia funciones serverless, APIs de terceros o un CMS completo. LumoPages te ofrece un camino más simple: mantén el sitio estático y deja que un Lumo gestione cada interacción de formulario.

Por qué este flujo funciona hoy

El hosting estático destaca en rendimiento y seguridad (sin servidor que parchear). La brecha siempre es la entrada dinámica: solicitudes de contacto, reservas de demo, registros de newsletter. LumoPages cierra esa brecha alojando el runtime del formulario, validación, estructura consciente del spam y almacenamiento de respuestas. Pegas un snippet de embed o enlazas—sin variables de entorno, sin base de datos, sin factura de Lambda.

Las actualizaciones de campos o copy ocurren en LumoPages y se reflejan en el formulario integrado automáticamente tras guardar—sin redeploy del sitio estático para ajustes de copy.

Qué necesitarás

• Un sitio estático o constructor que permita embeds HTML personalizados (o botones de enlace)
• Una cuenta de LumoPages (el nivel gratuito soporta proyectos reales)
• Objetivos claros para cada formulario: contacto general vs lead cualificado vs soporte
• La URL de la página de contacto de tu dominio donde vivirá el embed

Paso a paso: construye el Lumo

Etapa 1 — Contexto: Titular ("Get in touch"), párrafo corto sobre tiempo de respuesta, image block opcional con tu equipo u oficina.

Etapa 2 — Detalles: Nombre, email, empresa (opcional), dropdown de asunto (Sales / Support / Partnership), mensaje (textarea). Añade un Phone block solo si realmente devuelves la llamada—campos extra reducen la completitud.

Etapa 3 — Confirmación: Content block de agradecimiento; configura el email de notificación en ajustes del proyecto para que los envíos lleguen a tu inbox al instante.

Marca el Lumo para que coincida con tu sitio: tipografía, color primario, logo header block. Usa diseño multipaso para que usuarios móviles vean una pantalla enfocada a la vez en lugar de un formulario largo con scroll.

Publica y copia el código embed de las opciones de compartir de LumoPages (ver Help: Embedding Your Lumo on a Website).

Conéctalo a tu stack

Embed: En tu página de contacto, cambia a vista HTML/código y pega el iframe o script embed donde debe aparecer el formulario. Prueba en móvil—los Lumos son responsive por defecto.

Direct link: Para sitios mínimos, usa un ítem de nav "Contact" que enlace a la URL pública del Lumo (abre en la misma pestaña o nueva según tu UX).

Multiple forms: Crea Lumos separados para "Book a demo" vs "General inquiry" para que Inbox y exportaciones permanezcan segmentados sin lógica de routing backend.

Ejemplos que funcionan bien: Astro + Netlify, HTML plano en S3, sitio de marketing Webflow con embed Lumo en sección dedicada.

Gestiona respuestas sin backend

Todos los envíos aterrizan en LumoPages Inbox con timestamps y diseño de campos legible. Marca ítems Resolved cuando respondas. Exporta a Google Sheets o CSV para revisión semanal de ventas. Sin logs de servidor que monitorizar, sin endpoint de formulario que asegurar.

Si añades un CRM después, usa exportación o importación CSV de tu herramienta de automatización—aún sin necesidad de alojar procesamiento de formularios en tu stack estático.

---

Empieza a construir

Lanza el sitio estático rápido que quieres y delega la infraestructura de formularios a Lumo. Construye tu Lumo de contacto, intégralo una vez y mantente sin servidor.