Crea tu primera web con Claude Code en una tarde

Lo que vas a construir

Una web sencilla de una sola página para ti o tu negocio: presentación, servicios, galería y un botón de contacto. Lo bastante simple para terminarla en una tarde y lo bastante real para enseñarla.

Solo necesitas Claude Code funcionando (si aún no lo tienes, mira primero la guía de instalación) y una idea clara de lo que quieres contar.

El método en 6 pasos

1. 1. Escribe la idea en cinco líneasAntes de abrir Claude Code: para quién es la web, qué tiene que conseguir (que te escriban, que compren, que te sigan), las secciones que quieres, dos webs que te gusten y los colores de tu marca.
2. 2. Pide un plan, no códigoCrea una carpeta vacía, abre Claude Code dentro, activa el modo plan (Mayúsculas + Tab) y pega el primer prompt de abajo. Lee el plan y pide cambios hasta que te convenza.
3. 3. Construye por partesAprueba el plan y deja que cree la primera versión. Después mejora una sección cada vez: es mucho más fácil corregir algo pequeño que rehacerlo todo.
4. 4. Mírala en tu navegadorPídele: «¿Cómo veo la web en mi navegador?». Normalmente basta con abrir el archivo index.html o con un comando que él mismo ejecuta. Revísala también con la ventana estrecha, como si fuera un móvil.
5. 5. Pule los detallesTextos, fotos, colores, tipografía. Describe lo que no te gusta como se lo dirías a un diseñador: «el título se ve pequeño en el móvil», «quiero más aire entre secciones».
6. 6. Publícala gratisPídele que te guíe para publicarla en un servicio gratuito como GitHub Pages o Vercel. Te dirá qué cuentas crear y qué botones pulsar. En unos minutos tendrás una dirección para compartir.

Los prompts del proceso

Quiero crear una web de una sola página para quién eres o tu negocio. Su objetivo es que los visitantes lo que quieres que hagan: me escriban / reserven / me sigan en Instagram. Secciones: lista de secciones. Estilo: moderno, minimalista, colorido…, con estos colores: colores. Me gustan webs como ejemplos. Tiene que verse perfecta en el móvil. No sé programar: usa la solución más sencilla posible (HTML y CSS si basta) y explícame el plan antes de crear nada.

5 consejos que te ahorrarán horas

1. Una petición, un cambio. Si pides diez cosas a la vez, alguna saldrá mal y no sabrás cuál.
2. Guarda versiones. Pídele «guarda esta versión en git» cada vez que algo funcione. Si luego algo se rompe, podrás volver atrás.
3. Si se atasca, empieza de cero. Escribe /clear y explícale la tarea otra vez, más corta y concreta.
4. Pídele que te explique. «¿Qué has cambiado y por qué?» te ayuda a aprender y a detectar errores.
5. Nada de claves en el código. Si tu web usa algún servicio con contraseña o clave, pídele que la guarde en un archivo aparte que no se publique.