Cómo publicar un sitio web hecho con Gemini

Introducción

Mucha gente está usando Gemini para hacer sitios web. Cuando activas la herramienta Canvas, Gemini te entrega un único archivo HTML o React con una vista previa al lado. Pero una vez que tienes el código, el siguiente paso no es evidente. Todavía necesitas alojarlo en algún lugar, conectar un dominio, hacer que funcione en móvil y averiguar cómo seguir editándolo después.

Las herramientas tradicionales de desarrollador como GitHub y Netlify pueden alojar el archivo en línea, pero entonces cada edición requiere gestionar archivos de código, despliegues y detalles técnicos. La mayoría de la gente preferiría no lidiar con todo eso.

En esta guía te mostraré cómo convertir un sitio web hecho con Gemini en un sitio web real y publicado usando una nueva herramienta de IA llamada Repaint. Te permite partir de tu código, publicar el sitio y hacer ediciones chateando con IA.

Por qué publicar desde Gemini es difícil

Gemini puede generar código, pero no es un constructor de sitios web completo. Te redirige a otras plataformas cuando le preguntas cómo publicar en tu propio dominio. Suele recomendar herramientas de desarrollador como GitHub, Netlify y Vercel, o sugiere reconstruir en un constructor tradicional como Framer, Wix o Squarespace. Ninguna opción es ideal.

Las herramientas de desarrollador son atractivas porque pueden ejecutar directamente el código que genera Gemini. La desventaja es que cada cambio requiere editar archivos de código específicos. Para quienes no programan, esto significa estar pasando archivos constantemente entre Gemini y el código desplegado solo para hacer ediciones simples con IA.

La mayoría de la gente evita la complejidad del código usando un constructor como Wix, Squarespace o Webflow. Estas plataformas facilitan publicar ediciones. El problema es que no pueden ejecutar sitios generados por Gemini, así que tienes que reconstruirlo todo a mano. Y a partir de ahí, todo lo tienes que editar manualmente.

Por eso deberías usar un constructor de sitios con IA como Repaint. Te da la flexibilidad de ejecutar código personalizado y la comodidad de editar y publicar en un solo lugar.

¿Qué es Repaint?

Repaint es una plataforma de IA para crear sitios web. Está construida en torno al mismo flujo de trabajo basado en chat que hace útil a Gemini. Puedes pedir cambios en lenguaje natural, revisar el resultado y seguir iterando hasta que el sitio se vea bien.

Pero Repaint es una plataforma de sitios web completa, no solo un lugar para generar código. Eso significa que se encarga de las partes de manejar un sitio web que Gemini no cubre:

• Publica tu sitio para que la gente realmente pueda visitarlo online.
• Te permite conectar un dominio personalizado, para que el sitio viva en tu URL real.
• Mantiene el sitio editable con IA, para que puedas hacer cambios más adelante.
• Ayuda a gestionar detalles de SEO como títulos de página, descripciones y estructura del sitio.
• Puede crear nuevas páginas cuando tu sitio necesite crecer.

Esa es la diferencia entre generar un archivo de código y tener un lugar real para gestionar tu sitio a lo largo del tiempo.

Paso 1: Importa el código desde Gemini

Cuando Gemini hace un sitio web, muestra el código y una vista previa en vivo en un panel de Canvas. Por defecto la salida es HTML, pero puedes pedir React en su lugar. Una peculiaridad que vale la pena conocer: Gemini no abrirá Canvas automáticamente cuando le pidas un sitio web. Tienes que activar la herramienta Canvas desde el menú desplegable junto al cuadro de mensaje, y luego volver a pedirlo.

Para obtener el código, haz clic en el botón Share en la parte superior del Canvas, luego haz clic en Copy contents. Ve al importador de código de Repaint y pégalo allí. Esto inicia el proceso de construcción del sitio. Repaint usará tu código para crear un sitio web completo que podrás publicar y seguir editando.

Si todavía no has hecho un sitio web en Gemini, te recomiendo pedirlo en React. Está más cerca del formato que usa Repaint, por lo que hay menos posibilidades de que se pierdan pequeños detalles de diseño en la traducción. HTML también funciona, aunque cualquier problema se puede arreglar después chateando con Repaint.

Paso 2: Planifica lo que Repaint debe construir

Después de pegar tu código, Repaint te hará algunas preguntas antes de construir el sitio. Esto te da la oportunidad de decidir si quieres usar la versión de Gemini tal cual, usarla como inspiración general, o convertirla en un sitio más grande con más páginas.

Planifica el contenido

Gemini a menudo hace sitios de una sola página donde los enlaces se desplazan a secciones en lugar de abrir páginas nuevas. Pero la mayoría de los negocios necesitan más que una sola página. Así que si tienes un sitio de una sola página, deberías considerar pedirle a Repaint que lo construya como varias páginas.

También puedes aprovechar este momento para añadir más contenido. Gemini normalmente no hace grandes conjuntos de páginas como entradas de blog. Cuando importas el sitio a Repaint, puedes ampliar el alcance para incluir todo lo que quieras.

Cualquier página nueva coincidirá con el estilo que ya tienes.

Planifica el estilo

Por defecto, Repaint copiará el estilo de tu original. Eso significa que conservará el mismo aspecto: colores, diseño, tipografía y espaciado.

Pero no tienes que mantener el estilo. Si no estás satisfecho con él, puedes pedirle a Repaint que rediseñe tu sitio. Repaint puede:

• Recrear el original lo más fielmente posible
• Imitar el estilo de otro sitio web que te guste
• Crear un estilo personalizado para tu contenido
• Elegir un estilo de la biblioteca de estilos de Repaint
• Elegir por ti

No te estreses demasiado. Si no te gusta lo que hace, puedes pedirle más versiones después.

Revisa el plan

Antes de generar nada, Repaint detalla exactamente lo que va a construir: qué páginas, qué contenido y qué estilo. Revísalo y haz los últimos cambios. Es mucho más rápido corregir el plan que regenerar todo el sitio.

Una vez que confirmes, ¡Repaint construirá tu nuevo sitio web!

Paso 3: Genera tu sitio web

Una vez que confirmas el plan, Repaint comienza a construir tu sitio. Verás mensajes de progreso mientras trabaja en cada página. Una página de inicio sencilla puede tardar uno o dos minutos. Un sitio más grande con más páginas puede tardar más.

Repaint no se limita a alojar el código que pegaste. Usa la versión de Gemini como material de origen y luego construye el sitio descrito en tu plan. Si pediste una recreación exacta, intentará igualar el original lo más posible. Si pediste más páginas o un estilo diferente, usará la versión de Gemini como punto de partida.

A veces los detalles pueden perderse en la traducción durante la generación. Ocurre con más frecuencia si tu archivo original es HTML, ya que React está más cerca de lo que usa Repaint. Si se pierden detalles importantes, puedes corregirlos en el siguiente paso.

Paso 4: Edita tu sitio web con IA

Una vez que Repaint genera la primera versión, la verás en el lado derecho de tu pantalla. Ahora puedes hacer cambios de la misma forma que lo harías en Gemini. Escribes lo que quieres cambiar, Repaint actualiza el sitio y luego revisas el resultado.

Por ejemplo, puedes pedirle a Repaint que:

• Añada una nueva página
• Cambie los colores o las tipografías
• Añada un formulario de contacto
• Genere imágenes
• Reescriba el texto

Puedes seguir haciendo cambios hasta que el sitio esté listo para publicar.

Paso 5: Publica tu sitio web

Cuando el sitio esté listo, haz clic en el botón Publicar. Repaint pondrá el sitio en línea y te dará una URL que podrás compartir con cualquiera. Se verá algo así: https://xxxxxx-xxxxxx-xxxxxx.sites.repaint.com

Este es el punto en el que tu trabajo se convierte en un sitio web real en internet. Puedes abrirlo en tu teléfono, enviárselo a alguien o probarlo en un navegador real.

Tampoco necesitas exportar código ni desplegar archivos en otro lugar. A partir de ahora, Repaint es donde editas y publicas el sitio. Si quieres hacer cambios más adelante, puedes pedirle a Repaint que actualice el sitio y luego publicar la nueva versión con el mismo botón.

Paso 6: Conecta tu dominio

Cuando estés listo para usar tu propia URL, ve a Configuración del sitio > Dominios y haz clic en Conectar un dominio personalizado. Esto requiere un plan de pago. Puedes ver los detalles de precios aquí.

Tu dominio se gestiona en una plataforma externa, tanto a Gemini como a Repaint. Está registrado con un proveedor de dominios como GoDaddy, Namecheap o Cloudflare. No necesitas moverlo a ningún lado. Solo actualizas la configuración en tu proveedor de dominios para que el dominio apunte a tu sitio de Repaint.

Si nunca has hecho esto antes, no te preocupes. Pídele a Repaint que te guíe. Te dirá exactamente qué hacer, paso a paso.

El cambio puede tardar unas horas en aplicarse. Una vez que Repaint muestre tu dominio como verificado, tu sitio web estará en vivo en tu propio dominio.

Conclusión

Gemini facilita crear una primera versión de un sitio web, pero poner ese código online y mantenerlo sigue siendo difícil. Repaint te da una forma de convertir ese código en un sitio web real que puedes publicar, conectar a un dominio y seguir editando con IA. Repaint hace más fácil que nunca convertir código generado en un sitio publicado.

Preguntas Frecuentes

¿Cuánto tiempo lleva publicar un sitio de Gemini con Repaint?

Si tu sitio ya está hecho, debería tomar solo unos minutos. Compartir tu código, planificar el sitio y generar el sitio web suele tomar entre 2 y 5 minutos. Después, el tiempo hasta la publicación depende de cuántos ajustes hagas.

¿Cuánto cuesta publicar con Repaint?

Es gratis importar tu código a Repaint, generar un sitio, hacer ediciones y publicar. Las principales restricciones del plan gratuito son uso limitado, no se permite dominio personalizado y aparece una insignia de Repaint en el sitio. Los planes de pago comienzan en $20/mes con facturación anual, o $25/mes con facturación mensual. Eso incluye mayor uso, soporte para dominio personalizado y elimina la insignia de Repaint.

¿Por qué no usar simplemente GitHub Pages, Netlify o Vercel?

Puedes hacerlo, especialmente si te sientes cómodo gestionando código. Esas herramientas son buenas para poner archivos en línea. Pero cada cambio significativo te envía de vuelta al código, lo que significa que terminas copiando archivos entre Gemini, tu editor y tu herramienta de hosting.

Repaint es diferente porque es una plataforma de sitios web completa, no solo un lugar para servir archivos. Eso significa que puedes seguir editando con IA, publicar cambios desde el mismo lugar, gestionar páginas, actualizar la configuración de SEO, optimizar imágenes, conectar formularios y usar tu dominio personalizado. Está hecho para la gestión a largo plazo de un sitio, no solo para el primer despliegue.

¿Necesito saber programar para arreglar problemas?

No. Repaint está hecho para personas que no programan. Después de importar tu código desde Gemini, nunca más necesitas gestionar código. Si algo se ve mal, puedes arreglarlo chateando con IA. Saber programar puede ayudar si quieres ser muy específico, pero no es obligatorio.

¿El sitio se verá exactamente igual a la versión de Gemini?

Si le dices a Repaint que recree el original, debería verse casi exactamente igual. En ocasiones, algunos detalles se pierden porque Repaint traduce el código a su propio formato de sitio web. Los problemas de traducción son más comunes si el original de Gemini era HTML. Si eso ocurre, deberías poder arreglarlo todo en unos pocos mensajes.

¿Qué pasa si la IA comete un error?

A medida que haces actualizaciones, Repaint guarda cada versión de tu sitio. Puedes pedirle a Repaint que retroceda y revertirá a una versión anterior. O si quieres volver a un punto específico en el tiempo, puedes restaurar cualquier versión anterior de forma manual. Así puedes hacer cambios con libertad sin arriesgarte a arruinar tu sitio.

¿Funcionarán los formularios y botones después de importar?

Sí. Es probable que los formularios de contacto no funcionaran en tu sitio original de Gemini. Pero cuando mueves el sitio a Repaint, puede convertir el formulario en un formulario de contacto real que envía notificaciones por correo electrónico cuando recibes envíos. Los botones deberían funcionar si enlazan a páginas o secciones reales. Si un botón no apunta a ningún sitio, puedes pedirle a Repaint que lo conecte.

¿Puede Repaint manejar imágenes, iconos y otros recursos de mi sitio de Gemini?

Gemini a menudo obtiene imágenes de fuentes como Unsplash y las enlaza por URL en lugar de almacenarlas dentro de tu código. Cuando importas tu código, Repaint puede descargar y guardar copias de esas imágenes para que sigan disponibles de forma permanente en tu nuevo sitio. Repaint también puede generar imágenes si todavía necesitas añadirlas.

¿Puedo añadir configuración de SEO, analítica y metadatos?

Sí. Puedes añadir código personalizado, analítica y metadatos simplemente pidiéndoselo a Repaint. Puede configurar el SEO técnico por ti, y puede añadir scripts e inserciones de otras plataformas. Para añadir Google Analytics, solo comparte tu GA ID.

¿Repaint reemplaza el hosting, o todavía necesito un host aparte?

Repaint es una plataforma de hosting. Ejecuta tu sitio web. No necesitas una plataforma de hosting separada como GitHub Pages, Netlify, Vercel u otro constructor de sitios web.