Cómo hacer una web con ChatGPT: tres formas que funcionan

Para hacer una web con ChatGPT, puedes pedirle que escriba el HTML y el CSS del sitio y luego subir esos archivos tú mismo a un servicio de alojamiento; usarlo para planificar las páginas y escribir el texto antes de construir la web en un constructor; o conectar un constructor con IA como Mythex dentro de ChatGPT para que cree, aloje y publique el sitio por ti desde el mismo chat. La primera forma es gratuita y sirve para una web de una sola página; la tercera es la que necesitas cuando el sitio requiere formularios que guarden datos, inicios de sesión o actualizaciones frecuentes. Esta guía muestra cada método con ejemplos de instrucciones y deja claro dónde se queda corto cada uno.

Lo que ChatGPT puede y no puede hacer por sí solo

ChatGPT es muy bueno escribiendo: código, titulares, textos de páginas y planes. De serie no es una empresa de alojamiento. No le da a tu web una dirección pública, no ejecuta una base de datos y no conserva los archivos de tu sitio entre proyectos como sí hace un constructor. Cada método de abajo es una respuesta distinta a esa carencia.

Método 1: ChatGPT escribe el código, tú lo alojas

Es el enfoque clásico y funciona bien para una web sencilla y estática: un portafolio, una página de aterrizaje, una página de boda.

Paso 1: Pide una página completa en un solo archivo

Sé específico con el contenido y el diseño:

Escribe un sitio web completo de una sola página en un único archivo HTML, con el CSS dentro de una etiqueta style. Es para Maya Haddad, una ilustradora freelance en Amán. Secciones: un encabezado con su nombre y «Ilustración para libros y marcas», una cuadrícula de seis imágenes de portafolio (usa rutas de imagen de marcador que pueda reemplazar), un párrafo breve sobre ella, una lista de tres servicios con precios de inicio y una sección de contacto con su correo como enlace mailto. Limpio, moderno, con mucho espacio en blanco y que funcione en el móvil. Sin frameworks de JavaScript.

Pedir un único archivo lo mantiene sencillo de guardar y subir.

Paso 2: Guárdalo y ábrelo

Copia el código en un editor de texto, guárdalo como index.html y ábrelo en tu navegador. Si algo no se ve bien, descríbeselo a ChatGPT: «la cuadrícula de imágenes es de una sola columna en el escritorio; hazla de tres columnas por encima de 900 px de ancho».

Paso 3: Sustituye los marcadores

Cambia las imágenes de marcador por las tuyas y reemplaza cualquier texto que ChatGPT se haya inventado. Revisa con cuidado los precios, los correos y los nombres; la IA rellena los huecos con mucha seguridad.

Paso 4: Ponlo en línea

Sube el archivo a un hosting estático gratuito, como GitHub Pages, o a cualquier servicio de alojamiento web que ya pagues. Obtendrás una dirección pública. Para usar tu propio dominio, sigue las instrucciones de tu proveedor; nuestra guía sobre cómo conectar un dominio propio explica la parte de DNS.

Dónde se queda corto el método 1

• Formularios que guardan datos. Un formulario de contacto necesita un lugar donde enviar las respuestas. Necesitarás un servicio de formularios o un servidor.
• Inicios de sesión y áreas de socios. Requieren un backend y una base de datos.
• Muchas páginas. Mantener los encabezados y los menús coherentes en diez archivos pegados a mano se vuelve tedioso.
• Actualizaciones. Cada cambio significa pedir código nuevo, pegarlo y volver a subirlo.

Método 2: ChatGPT planifica, un constructor construye

Aquí ChatGPT hace la parte de pensar y escribir, y un constructor web se encarga de crear y alojar.

Paso 1: Planifica la web con ChatGPT

Tengo una pequeña panadería familiar en Manchester que acepta encargos de tartas. Sugiere las páginas que necesita mi web, qué debe decir cada una y la única acción que quiero que haga el visitante en cada página. Limítalo a cinco páginas o menos.

Paso 2: Escribe los textos

Pide el texto de cada página y luego reescríbelo con tu propia voz. Añade los datos reales que ChatGPT no puede conocer: horario, precios, zonas de reparto y lo que hace diferentes a tus tartas.

Paso 3: Constrúyelo en un constructor

Pega el plan y los textos en un constructor web. En una herramienta de arrastrar y soltar, colocas el texto en una plantilla. En un constructor con IA puedes darle todo el plan en un único mensaje y él crea las páginas; por ejemplo, en el constructor de webs de Mythex:

Crea una web para una panadería familiar en Manchester usando este plan y estos textos: [pega aquí]. Incluye un formulario de pedidos que guarde cada solicitud (nombre, teléfono, tipo de tarta, fecha necesaria, mensaje) para que pueda verlas en una página de administración a la que solo yo pueda acceder. Diseño cálido y acogedor, que funcione en el móvil.

El formulario de pedidos aquí se guarda en una base de datos real, algo que un archivo HTML pegado no podría hacer. Para más información sobre esta ruta, consulta cómo crear una web con IA.

Método 3: Crea y publica desde dentro de ChatGPT

La opción más reciente es conectar un constructor a ChatGPT para que ChatGPT pueda usar directamente sus herramientas. Te quedas en la conversación de ChatGPT; el constructor aporta el proyecto, la vista previa, la base de datos y el alojamiento.

Mythex funciona así a través de su aplicación para ChatGPT (un conector MCP). Lo conectas desde Ajustes de la cuenta en Mythex; la conexión funciona en cualquier plan, y las herramientas que ejecutan el entorno de tu proyecto requieren Pro. Una vez conectado, puedes pedirle a ChatGPT algo como:

Usando Mythex, crea una web nueva para mi panadería con una página de inicio, una página de carta con tartas y precios, y un formulario de pedidos que guarde los datos en una base de datos. Enséñame la vista previa y publícala cuando te diga que está bien.

ChatGPT entonces crea el proyecto, escribe el código, lo ejecuta y lo publica en una dirección pública cuando lo apruebes. Los cambios son simplemente más mensajes en el mismo chat. Este mismo enfoque de conector también funciona desde Claude, Cursor y Codex. Para saber más sobre cómo funciona y qué constructores lo admiten, consulta creadores de apps con IA y MCP.

¿Qué método elegir?

Consejos para escribir instrucciones que funcionan con cualquier método

• Da datos reales desde el principio. Nombre, ubicación, servicios, precios y datos de contacto. Cuantos menos datos inventados, menos limpieza después.
• Describe al visitante y el objetivo. «Un padre que busca una tarta de cumpleaños y que debería terminar enviando una solicitud de pedido».
• Pide diseños pensados primero para el móvil. La mayoría de visitantes usan el teléfono.
• Cambia una sola cosa por mensaje una vez que exista la primera versión.
• Pide explícitamente lo básico del SEO: un título y una descripción únicos por página, encabezados reales y texto alternativo en las imágenes. Consulta SEO para webs creadas con IA.

Nuestra guía sobre cómo escribir instrucciones para creadores de apps con IA tiene más patrones.

Problemas comunes y soluciones

• El diseño parece genérico. Dale una referencia: «como una cafetería escandinava tranquila, con mucho blanco y un solo verde apagado».
• El código se ha cortado. Pídele a ChatGPT que continúe desde la última línea, o que divida la página en secciones y te las dé una a una.
• Se ha inventado testimonios o estadísticas. Elimínalos. Las reseñas falsas dañan la confianza y, en muchos lugares, van en contra de las normas de protección al consumidor.
• La web se rompe después de un cambio. Guarda una copia de la última versión que funcionaba antes de pegar código nuevo. Constructores como Mythex guardan puntos de restauración para que puedas volver atrás.

Antes de publicar

Lee cada palabra de cada página. Comprueba que los datos de contacto funcionan. Abre la web en un móvil. Asegúrate de que las imágenes son tuyas o tienen una licencia adecuada. Luego publícala y compártela donde ya están tus visitantes. Si quieres que todo el proceso no cueste nada, cómo hacer una web gratis explica con más detalle las opciones de alojamiento gratuito.

Preguntas