Com publicar una web HTML creada amb IA

Una web que funciona a localhost encara depèn del teu ordinador. Per compartir HTML i CSS sense servidor propi, has de publicar els fitxers que carregarà el navegador dels visitants. Un cop allotjada, pots apagar l’ordinador on l’has creada.

Aquesta guia utilitza un exemple original amb llicència MIT. Obre la demo publicada i visita directament la segona pàgina. No inclou inici de sessió, base de dades ni un servei per enviar formularis.

Si el projecte utilitza React i Vite, segueix la guia de publicació des de Git i rutes de navegador, amb un exemple construït i publicat a Hostbrid.

Si has creat el web per a un client, la llista d’entrega d’un web estàtic t’ajuda a revisar el domini, els comptes, el codi i les responsabilitats.

1. Comprova que tens HTML estàtic

L’exemple té index.html, about.html i styles.css a l’arrel del repositori. Els enllaços són relatius: styles.css i about.html. Les rutes que apunten a /Users/... o a localhost depenen del teu equip i no funcionen per als visitants.

Si l’eina d’IA ha generat package.json, una API o un backend extern, aquests passos poden ser insuficients. Consulta quin allotjament necessita una web creada amb IA. Conserva els serveis necessaris; no els eliminis per fer passar una aplicació per estàtica.

2. Desa els fitxers al teu repositori

Copia l’exemple o fes-ne un fork al teu compte de GitHub, mantenint la llicència. Substitueix els textos i les imatges de mostra i comprova que index.html és a l’arrel de la branca que publicaràs. No hi desis contrasenyes, claus privades ni dades de clients.

Projects treballa amb repositoris Git. Descarregar un ZIP no implica que el panell permeti pujar-lo directament. La documentació de Projects descriu la connexió amb el proveïdor i la selecció del repositori. Revisa els permisos que autoritzes.

3. Configura aquest exemple HTML

El preset és HTML pla (estatico). Aquests són els valors comprovats per als fitxers de l’exemple:

No hi afegeixis npm ci ni npm run build: no hi ha dependències ni compilació. Si els teus fitxers són en una altra carpeta, adapta l’arrel i la sortida. . no és la sortida correcta per a qualsevol framework.

4. Comprova l’adreça pública

Obre l’HTTPS del projecte des d’un altre dispositiu. Visita la portada, escriu /about.html directament, recarrega, segueix l’enllaç entre pàgines i comprova que es carreguen els estils. Revisa també el mòbil. L’estat «publicat» no substitueix aquesta comprovació: la primera petició de la nostra prova va retornar 404 abans que les següents servissin correctament la demo.

Prova del 8 d’octubre de 2026: vam descarregar el commit cca391c, publicar-lo amb aquests ajustos i comprovar les dues pàgines i el CSS per HTTPS, la navegació i amplades de 390 i 1280 px. Vam utilitzar el compte intern de Hostbrid. Això verifica la construcció i publicació, però no l’alta OAuth d’un client ni les actualitzacions per push.

Publicat no vol dir indexat

Que la URL s’obri per HTTPS permet comprovar la publicació. No demostra que Google l’hagi indexat ni que aparegui en una posició concreta. Canviar d’allotjament tampoc garanteix recomanacions d’una IA.

Compara l’HTML rebut a la resposta amb el DOM que mostra el navegador després d’executar JavaScript. Un text pot ser al primer o aparèixer després mitjançant un script. Segons la documentació de Google sobre JavaScript, Google pot processar-lo: un HTML inicial sense aquell text no prova que Google sigui incapaç de veure’l. Observar-lo al navegador tampoc prova que Google hagi renderitzat aquella pàgina.

Per a una pàgina que vulguis mostrar deliberadament a la cerca, revisa l’estat HTTP, l’etiqueta meta robots i la capçalera X-Robots-Tag. Un noindex inicial importa encara que JavaScript el retiri després: Google pot ometre el renderitzat quan el troba. Consulta com impedir la indexació abans de modificar aquestes instruccions. No posis noindex a robots.txt; tampoc retiris restriccions de pàgines privades o excloses intencionadament. Si el rastreig està bloquejat, Google pot no llegir la instrucció de la pàgina.

A Search Console, examina la URL amb el responsable autoritzat. Distingeix el resultat desat d’una inspecció en viu: són comprovacions diferents, i una consulta per API no sol·licita automàticament indexació. Un HTTP200 sense noindex continua sense acreditar indexació ni posicionament. Anota què observes i continua amb les comprovacions de formularis o domini que corresponguin.

Consulta l’assaig original MIT: sis rutes sintètiques comparen HTML estàtic, text afegit amb JavaScript, noindex en meta o capçalera, una etiqueta inicial retirada amb JavaScript i un HTTP404 real. Es van comprovar respostes HTTP i dotze vistes de Chrome, a 390 i 1280 px. En el cas de retirada, Chrome mostra el text i elimina l’etiqueta, però això no acredita que Google faci el mateix. Per reproduir només aquest assaig local, segueix el README amb Node 22.23.3, npm 10.9.9 i Chrome; la versió comprovada era 154.0.8037.98. No és un export de Lovable ni una prova de rastreig, indexació o lliurament natiu a Hostbrid.

Formularis i domini propi

L’enllaç de contacte obre el client de correu; no processa formularis. L’inici de sessió, els pagaments i l’enviament de dades requereixen serveis addicionals i proves pròpies. Un domini propi té condicions de pla i costos de registre i renovació: consulta els plans vigents. Per publicar aquests fitxers des de Git, consulta Hostbrid Projects.