Cómo crear una página web con Claude y publicarla gratis

Antes de abrir Claude, escribe en cuatro líneas qué necesitas: para qué es la web (presentarte, vender un servicio, anunciar un evento), qué secciones lleva, qué estilo te gusta y el contenido real (nombre, textos, enlaces, correo). Con eso Claude acierta a la primera mucho más que con un 'hazme una web bonita'. Después elige el camino. Una web de una sola página (un portafolio, una landing, la web de un negocio pequeño) se hace entera en claude.ai, y es lo que cubre este tutorial. Una web con varias páginas, blog o un formulario que guarde respuestas se queda corta en el chat: para eso está el paso 7.

Abre claude.ai, inicia un chat y pega un prompt como el de abajo con tus datos. Pide un solo archivo HTML con todo dentro: así Claude lo muestra en el panel de artefactos, a la derecha del chat, y ves la web funcionando sin guardar nada ni instalar nada. Pide también que se vea bien en el móvil, que es desde donde la va a abrir la mayoría.

Crea la web de una sola página para mi negocio,
en un único archivo HTML con el CSS y el JavaScript
dentro y sin librerías externas.

Datos:
- Negocio: Estudio de yoga Lúa, en Valencia
- Secciones: portada con frase y botón, clases
  y horarios, precios, opiniones, contacto
- Contacto: hola@estudiolua.es y WhatsApp
- Estilo: cálido y tranquilo, tonos arena y verde
- Que se vea bien en el móvil y tenga un menú
  arriba que lleve a cada sección

La primera versión casi nunca es la final. Mira la web en el panel, apunta lo que cambiarías y pídelo en el mismo chat, todo en un mensaje y con detalle: qué cambiar, dónde y cómo. Claude rehace el artefacto y guarda las versiones anteriores, así que si un cambio no te gusta puedes volver a la de antes desde el propio panel. Si un cambio rompe algo, dilo tal cual: 'el menú desapareció con el último cambio, arréglalo sin tocar lo demás'. Tres o cuatro rondas suelen bastar.

Sobre la web que hiciste:
1. Pon la foto de la portada a todo el ancho.
2. Haz más grande el botón de reservar y que abra
   WhatsApp con un mensaje ya escrito.
3. Cambia el verde por uno más suave.
4. Añade una sección de preguntas frecuentes
   antes del contacto.

La vía más rápida para enseñarla: abre el artefacto, comprueba que estás en la versión que quieres, pulsa Publish (Publicar) y copia el enlace. Cualquiera con el enlace la ve sin tener cuenta de Claude. El artefacto queda además en la sección Artefactos de la barra lateral, para encontrarlo fuera del chat. Sirve para enseñar una propuesta a un cliente o pasar un enlace por WhatsApp, pero la dirección es de claude.ai y no se le puede poner tu dominio. Para una web de verdad, sigue con el paso 5.

Copia el código del artefacto (o descárgalo desde el panel) y guárdalo en una carpeta nueva con el nombre index.html: es el archivo que los servidores buscan como página principal. En el Bloc de notas de Windows elige Tipo: Todos los archivos al guardar, o quedará como index.html.txt y verás código en lugar de la web. Crea una cuenta gratuita en Netlify, entra en app.netlify.com/drop y arrastra la carpeta. En unos segundos tienes la web en una dirección del tipo nombre.netlify.app, y para cambiarla después vuelves a arrastrar la carpeta con el archivo nuevo.

mi-web/
  index.html
  fotos/
    portada.jpg

Claude no compra dominios ni paga hosting: esa parte es tuya. Compra el dominio en un registrador (Namecheap, Dinahosting, GoDaddy o el que prefieras), entra en tu sitio de Netlify, abre la configuración de dominios y añade el tuyo. Netlify te dice qué registros DNS poner en el registrador o te ofrece usar los suyos. El certificado para que la web cargue con https lo pone Netlify solo. Los cambios de DNS pueden tardar unas horas en verse en todas partes. Si no cargan, pídele ayuda a Claude pegándole lo que te muestran Netlify y tu registrador.

Una página con varias secciones va bien en el chat. Varias páginas, un blog o un formulario que guarde las respuestas ya no caben cómodos en un solo archivo, y copiar y pegar se vuelve un riesgo. Para eso está Claude Code, que trabaja directamente en una carpeta de tu ordenador: crea los archivos, los edita y te deja la web lista para subir a Netlify o Vercel. Necesita un plan de pago o una cuenta de la consola de Anthropic. Para el formulario, recuerda que una web estática no guarda nada sola: hace falta un servicio que reciba las respuestas, como Netlify Forms o Formspree, y Claude te deja el formulario conectado si le dices cuál usas.

Crea en esta carpeta la web del Estudio Lúa con
tres páginas: inicio, clases y contacto. Usa el
diseño de index.html, comparte el menú y el pie
entre las tres y deja el formulario de contacto
preparado para Netlify Forms.