Ho creato un generatore di siti vetrina con l’IA: ecco cosa succede davvero sotto il cofano
Sono l’autore di WebSir (websir.fr), una piattaforma SaaS che genera un sito vetrina completo, distribuito e raggiungibile in meno di 30 minuti a partire da un brief in linguaggio naturale. Questo articolo è un riscontro tecnico: perché ho costruito questo strumento, come funziona la pipeline di generazione e perché un sito vetrina generato dall’IA può battere sui Web Vitals un sito fatto a mano su Webflow. Bonus finale: un codice sconto del 20 %.
La landing di WebSir: l’utente descrive il proprio progetto in francese all’assistente conversazionale e la generazione parte. Alt text suggerito: «Home page di WebSir con l’interfaccia di chat per creare un sito vetrina conversando con un’IA».
Perché l’ennesimo sito vetrina generato dall’IA?
Come sviluppatore mi sono sentito rivolgere la stessa richiesta per anni da artigiani, freelance e microimprese: «voglio solo un sito semplice, che carichi in fretta, dove posso cambiare un numero di telefono senza chiamare qualcuno». La risposta del settore è stata WordPress più un tema ElementorClick, o più di recente Wix, Webflow e simili. In entrambi i casi il problema resta lo stesso: lo stack è pesante, il DOM renderizzato lato client è obeso e la minima modifica editoriale costringe a navigare in un’interfaccia visuale complessa quanto un Photoshop low cost.
Quando gli LLM sono diventati abbastanza bravi a produrre HTML e CSS strutturati, ho voluto prendere il problema al contrario: invece di insegnare all’utente a usare un builder, chiedergli di descrivere quello che vuole a parole. E dietro, non generare l’ennesimo sito WordPress, ma HTML statico puro, servito dall’edge, senza framework JavaScript lato client. Da qui è nato WebSir.
Il percorso utente, visto da fuori
L’utente si registra (email più password, Google, Facebook o Apple), scrive una frase del tipo «sono osteopata a Lione, voglio un sito sobrio, sui toni del verde salvia, con una pagina di presentazione, una pagina tariffe, una pagina contatti e una pagina note legali» e la chat conversazionale guida il resto. L’agente raccoglie dettagli (colori, tono, settore, struttura desiderata), poi avvia la generazione. L’avanzamento arriva in streaming in tempo reale: l’utente vede l’IA lavorare per fasi successive, struttura, contenuti, design, codice, asset, validazione, senza dover indovinare cosa succede nella scatola nera.
Dopo qualche minuto il sito è pronto per l’anteprima. A quel punto l’utente può chiedere modifiche (sempre in chat, mai un editor visuale imposto), sistemare immagini, colori, alberatura. Quando è soddisfatto entra in un flusso di pubblicazione in 5 passaggi: SEO, dominio, social, pagamento, contatti. Ed è solo al passaggio del pagamento che entra in gioco Stripe: generare un sito completo è del tutto gratuito, solo la pubblicazione effettiva fa scattare la fatturazione. Un modello freemium radicale e dichiarato: se l’IA non riesce a produrre un sito convincente, l’utente non ha speso nulla.
Sotto il cofano: WebForge, il motore di generazione
Qui la cosa si fa interessante per gli sviluppatori. WebForge è un binario Node.js / TypeScript indipendente che ho progettato apposta per questo caso d’uso. Orchestra l’intera generazione del sito: analisi del brief, scrittura dei contenuti, scelta del design, assemblaggio del codice, ottimizzazione degli asset e validazione finale. È tutto pilotato internamente e l’avanzamento viene esposto in tempo reale all’applicazione web, così l’utente non resta mai davanti a una clessidra muta.
Vista dell’editor WebSir durante una generazione: la colonna di sinistra mostra in tempo reale le fasi di WebForge (scrittura del codice, validazione del template, QA), il pannello centrale il sito in fase di assemblaggio. Alt text suggerito: «Editor WebSir che mostra in tempo reale le fasi di generazione WebForge e l’anteprima del sito vetrina creato dall’IA».
Più fasi visibili durante la generazione
Invece di chiedere a una sola chiamata monolitica di produrre un sito completo (ricetta classica per un risultato deludente), WebForge concatena più fasi specializzate. Le vedi letteralmente scorrere nel pannello di sinistra mentre il sito viene generato.
Una parte di queste fasi è guidata dall’IA: quelle che richiedono giudizio creativo o redazionale (inquadrare il progetto, scrivere i contenuti, scegliere il design, produrre il codice). Altre fasi sono del tutto deterministiche, senza alcuna chiamata a un LLM: si occupano di build, validazione e autocorrezione. Sono loro a rimediare agli errori tipici di una generazione con l’IA: una classe CSS inesistente, uno slot dimenticato, una palette di colori incoerente, un ritmo di pagina che impila due volte la stessa sezione.
Il risultato di questa ripartizione è semplice: la creatività resta all’IA, il rigore resta a codice testato. È la chiave per consegnare un sito vetrina generato dall’IA che non allucina e che esce dalla pipeline con un livello di qualità riproducibile invece che affidato al caso.
Una cassetta degli attrezzi su misura per l’agente
L’agente IA non scrive il sito «a mano» in pura modalità completion. Ha a disposizione un set di tool tipizzati che ho definito apposta per la produzione di siti vetrina: lettura, scrittura e modifica di file, istanziazione di componenti da una libreria interna, validazione dei template e tutta una batteria di strumenti per le immagini (generazione di illustrazioni, di logo, di favicon, editing di immagini, rimozione dello sfondo).
L’agente sceglie da solo i tool utili in base alla fase in corso, e un sottoinsieme di tool viene limitato a seconda del contesto: per esempio non vogliamo che una fase di revisione critica si metta a riscrivere codice di nascosto. Questa disciplina sugli strumenti è ciò che distingue una demo per Twitter da un prodotto che regge in produzione.
Una volta generato il sito, l’utente può ovviamente continuare a dialogare con l’IA in chat, ma può anche cliccare direttamente su qualsiasi blocco della pagina per modificarlo in contesto: cambiare un titolo, sistemare una call to action, sostituire un’immagine. L’editor conserva la conoscenza della struttura (hero, servizi, testimonianze, footer…) e propone le modifiche adatte al tipo di blocco selezionato.
Selezione visuale diretta di un blocco «hero» su un sito generato: l’utente clicca sull’area da modificare e l’editor applica il cambiamento senza rompere la struttura. Alt text suggerito: «Modifica in contesto di un blocco hero su un sito vetrina generato dall’IA nell’editor WebSir».
Perché HTML statico nel 2026?
Molte piattaforme equivalenti producono un’applicazione JavaScript mostruosa (Wix carica senza problemi 2 o 3 MB di JS sulla prima pagina). WebSir fa esattamente il contrario: i siti generati sono HTML / CSS / Vanilla JS ES2022+. Zero framework lato client. Zero React, zero Vue, zero Alpine.js, zero jQuery. La regola è applicata dalla CI: uno script blocca qualsiasi merge che reintroduca una dipendenza vietata.
Conseguenze misurabili:
- LCP minimo, niente hydration, nessun bundle JS da analizzare prima di mostrare il contenuto
- FID immediato, poco JavaScript sul main thread
- Bundle leggero, qualche kilobyte di JS per le interazioni (menu mobile, accordion), non di più
- Accessibilità naturale, nessun DOM virtuale, l’HTML è leggibile così com’è dagli screen reader e dai crawler SEO
- Robustezza, un sito che funziona ancora alla perfezione anche con il JS disattivato
Lato infrastruttura, il sito è servito da una rete di distribuzione mondiale (edge CDN). In concreto, ogni pagina viene servita dal punto di presenza più vicino al visitatore, ovunque si trovi nel mondo. Nessun server applicativo da scalare, nessuna cache da invalidare a mano: upload, iniezione dei meta tag, configurazione DNS e purge della cache sono completamente automatizzati a ogni nuovo deploy. I domini personalizzati si gestiscono in pochi clic, con certificato SSL automatico.
Il sistema di variabili tipizzate: un passo avanti sul GDPR
È probabilmente la parte di cui vado più fiero sul piano tecnico, e quella che le altre piattaforme non fanno. Ogni dato pubblico ricorrente di un sito, numero di telefono, email, indirizzo, partita IVA, nome dell’hoster, anno corrente, passa da un tag <var data-key="…"> o da un attributo data-bind-{attr}="key".
L’LLM non vede mai il valore reale. WebForge riceve solo le chiavi e i metadati (etichetta, tipo, obbligatorio o no). La sostituzione vera avviene dopo, al momento del deploy, tramite un motore di rendering che inietta i valori appena prima della pubblicazione.
Vantaggi concreti: i dati personali veri non transitano da un fornitore di IA di terze parti, si può cambiare un numero di telefono su tutto il sito con una sola operazione e si può attivare un flag «dato sensibile» che innesca una cifratura aggiuntiva sulle variabili non destinate alla pubblicazione. Per chi prova a generare un sito vetrina professionale con l’IA restando conforme al GDPR, questa separazione tra contenuti e dati è decisiva.
Sicurezza e igiene operativa
Qualche dettaglio che conta su un blog per sviluppatori:
- 2FA TOTP obbligatoria
- Anti brute force a due livelli: 5 tentativi falliti bloccano l’account per 15 minuti
- Moduli di contatto protetti da più livelli di sicurezza: honeypot, tempo minimo di compilazione, rifiuto dei domini usa e getta, verifica MX, Turnstile, il tutto automatizzato al 100 %
- Upload di file nei moduli: whitelist MIME, dimensione massima per invio, ClamAV lato server
Perché un sito vetrina generato dall’IA può battere un sito fatto a mano
L’argomento intuitivo è: «un essere umano fa sempre meglio di una macchina sulla parte creativa». È ancora in parte vero sul design, ma lo è sempre meno sulla performance tecnica, che è il vero campo di gioco della SEO moderna.
Un freelance che consegna un sito Webflow o un tema WordPress rattoppato ha poche possibilità di battere, sui Core Web Vitals, una pipeline progettata fin dall’inizio per generare HTML statico ottimizzato, validata da una batteria di controlli deterministici e distribuita su un edge mondiale. Aggiungici:
- Marcatura Schema.org iniettata sistematicamente su ogni pagina (LocalBusiness, Article, BreadcrumbList a seconda del contesto)
- Un sitemap.xml generato e inviato in automatico
- Meta tag Open Graph e Twitter Card configurati al passaggio «Social» del flusso
- Un sistema di analytics nativo, senza SDK esterni da caricare
- Immagini servite in WebP o AVIF quando il browser le supporta
…e ottieni un sito che, senza sforzo aggiuntivo, spunta già le principali raccomandazioni di Google Page Experience. Quando arriva un crawler trova HTML leggibile, non uno scheletro React da idratare. Quando un visitatore clicca, la pagina compare in qualche centinaio di millisecondi dal punto di presenza più vicino.
Audit Google Lighthouse di un sito vetrina generato da WebSir: 100/100 su Prestazioni, Accessibilità, Best practice e SEO. Nessuna ottimizzazione manuale, il punteggio esce direttamente dalla fase di generazione. Alt text suggerito: «Punteggio Google Lighthouse 100/100/100/100 su un sito vetrina generato dall’IA di WebSir, misurato su Prestazioni, Accessibilità, Best practice e SEO».
Prezzi e codice sconto (la parte che aspettavi)
L’offerta attiva si chiama semplicemente Site vitrine. 39,90 € netti al mese, con un’opzione annuale a 430,92 € netti all’anno che fa risparmiare il 10 %. Sono inclusi:
- Fino a 20 pagine, note legali e informativa privacy comprese
- Un dominio personalizzato o un sottodominio su
*.websir.fr - Il certificato SSL gestito in automatico
- Una CDN mondiale sull’edge
- Un sistema di analytics nativo, senza banner cookie da mostrare
- Moduli di contatto illimitati, con upload di file e antispam
- Le modifiche illimitate via chat (l’IA resta accessibile dopo la pubblicazione)
- Il supporto via email
Ed ecco la parte che mi ha spinto a scrivere questo articolo oggi: per i lettori di questo blog ho creato un codice sconto del 20 % sul primo abbonamento.
Codice sconto: SITE20
20 % di sconto da inserire al passaggio Checkout del flusso di pubblicazione.
Ricorda: generare il sito è gratis. Puoi creare un account, fare il brief all’IA, vedere il risultato completo, chiedere tutte le modifiche che vuoi e usare il codice SITE20 solo nel momento in cui decidi davvero di pubblicare il sito. Se il risultato non ti convince, non avrai speso nulla.
Cosa (ancora) non c’è in WebSir
Per onestà intellettuale, ecco cosa oggi non esiste. Le offerte sito dinamico ed e-commerce sono previste ma non sono ancora disponibili. La tecnologia di destinazione non è decisa: so già cosa non userò (né WordPress, né PrestaShop, né Shopify) ma non ancora su cosa punterò. Se ti serve un negozio online o un back office gestionale già da oggi, WebSir non è la risposta giusta: preferisco dirtelo prima che tu digiti la carta di credito, non dopo.
Allo stesso modo, WebSir punta in via prioritaria al mercato francofono. I contenuti generati sono in francese per impostazione predefinita, le pagine legali sono ricalcate sul diritto francese e l’agente conversazionale capisce i brief in francese meglio che in altre lingue. Il supporto multilingua arriverà, ma non è la priorità del momento.
Conclusione: cosa cambia per uno sviluppatore
Se sei uno sviluppatore e i tuoi amici non tecnici ti chiedono ancora «non è che mi metti su un sitarello», sai quanto quella richiesta diventi pesante da soddisfare gratis. Consigliare WebSir per l’esigenza «sito vetrina professionale online in fretta, con un dominio e moduli di contatto che funzionano» ti libera il weekend. E se sei tu stesso freelance e prendi lavori di siti vetrina in subappalto, puoi usare WebSir come acceleratore: lascia che l’IA produca la base e fattura al cliente finale il tempo di personalizzazione.
Il codice SITE20 resta valido per tutti i lettori di questo blog. Vai su websir.fr, crea un account, descrivi quello che vuoi e guarda la pipeline al lavoro. Se vuoi approfondire la parte tecnica, WebForge merita probabilmente un articolo dedicato: scrivimelo nei commenti e nel prossimo post entrerò nel dettaglio del sistema di template e del meccanismo di autocorrezione.
Articolo scritto dal creatore di WebSir, per gli sviluppatori che vogliono capire cosa succede davvero quando si genera un sito vetrina con l’IA nel 2026.
