HomeCasa Prompts

Crea un sito web professionale completo

Genera la struttura, i testi e il codice HTML/CSS di un sito web professionale e responsive per la tua attività, con SEO di base e accessibilità. Pensato per ChatGPT, Claude e Gemini. Include 7 variabili personalizzabili e puoi copiarlo gratuitamente con un clic.

Intermedio · Codice · In attesa di revisione editoriale

Pensato per:

Prompt

Agisci come sviluppatore web senior e UX designer specializzato in siti per piccole imprese.

Voglio creare il sito web professionale di {{business}}, un'attività di {{industry}} che si trova a {{location}}.
Pubblico di riferimento: {{audience}}.
Obiettivo principale del sito: {{goal}}.

Consegna, in quest'ordine:
1. Una mappa del sito con le pagine necessarie e lo scopo di ciascuna.
2. Per la home page: la struttura delle sezioni (hero, proposta di valore, servizi, riprova sociale, invito all'azione, contatti) con testi reali, pronti all'uso, in tono {{tone}}.
3. HTML5 semantico e CSS moderno (Flexbox/Grid, variabili CSS, mobile-first) per la home page in un unico blocco, senza framework esterni.
4. Tag SEO: title (max 60 caratteri), meta description (max 155) e dati strutturati JSON-LD di tipo LocalBusiness con campi di esempio segnati come [DA COMPLETARE].
5. Una checklist di accessibilità (contrasto, testi alternativi, navigazione da tastiera) applicata al codice.

Vincoli:
- Non inventare dati di contatto, prezzi o recensioni: usa segnaposto [DA COMPLETARE].
- Palette di colori: {{colors}}.
- Spiega brevemente ogni scelta di design importante.

Come usarlo

  1. Compila le variabili con i dati reali della tua attività.
  2. Incolla il prompt nel tuo assistente di IA.
  3. Rivedi il codice in un editor e sostituisci ogni segnaposto [DA COMPLETARE] prima di pubblicare.
  4. Chiedi modifiche specifiche: «rendi l'hero più compatto su mobile» oppure «aggiungi una sezione FAQ».

Esempio d'uso

Attività: Fisioterapia Lumen · Settore: fisioterapia sportiva · Località: Torino · Obiettivo: ottenere prenotazioni per la prima visita.

Esempio di risultato

1. Mappa del sito

  • Home: presentare lo studio e portare alla richiesta di preventivo.
  • Servizi: ristrutturazione completa, progetto d'interni, consulenza a ore.
  • Progetti: prima e dopo di case reali.
  • Contatti: modulo di preventivo e dati [DA COMPLETARE].

3. Codice della home page (estratto)

<header class="hero">
  <h1>La tua prima casa, pensata per crescere con te</h1>
  <p>Studio Aurora progetta ristrutturazioni per giovani famiglie a Milano: spazi luminosi, pratici e su misura.</p>
  <a class="btn" href="#preventivo">Richiedi un preventivo gratuito</a>
</header>

<style>
  :root {
    --bianco-sporco: #f7f5f0;
    --salvia: #8a9a7b;
    --nero: #1c1c1c;
  }
  body { margin: 0; background: var(--bianco-sporco); color: var(--nero); font-family: system-ui, sans-serif; }
  .hero { display: grid; gap: 1rem; padding: 4rem 1.25rem; max-width: 60rem; margin: auto; }
  .btn { justify-self: start; background: var(--nero); color: var(--bianco-sporco); padding: .9rem 1.4rem; border-radius: .5rem; }
  .btn:focus-visible { outline: 3px solid var(--salvia); outline-offset: 3px; }
  @media (min-width: 48rem) { .hero { padding: 6rem 2rem; } }
</style>

Il pulsante è nero su bianco sporco (contrasto ben oltre 4,5:1); il verde salvia è riservato ai dettagli e all'indicatore di focus, perché su fondo chiaro non basta per il testo.

4. SEO

  • Title: Studio Aurora | Interior design e ristrutturazioni Milano
  • Meta description: Ristrutturazioni e interior design per giovani famiglie a Milano. Spazi luminosi e pratici. Richiedi subito un preventivo gratuito…

Dati chiave

Categoria
Programmazione e sviluppo · Creare siti web
Tipo di output
Codice
Livello
Intermedio
Pensato per
ChatGPT, Claude e Gemini
Verificato in
In attesa di verifica editoriale
Variabili
Nome dell'attività, Settore, Località, Pubblico di riferimento, Obiettivo del sito, Tono e Colori del brand
Lingua
Italiano
Prezzo
Gratuito, senza registrazione
Aggiornato
07/11/2026

Domande frequenti

Posso pubblicare direttamente il codice generato dall'IA?

Usalo come punto di partenza: rivedi il codice in un editor, prova il sito su mobile e desktop, sostituisci i segnaposto [DA COMPLETARE] e controlla contrasto e testi alternativi prima di pubblicare.

Funziona con WordPress o altri costruttori di siti?

Sì. La mappa del sito, i testi e i tag SEO si possono trasferire su qualsiasi costruttore. L'HTML e il CSS servono come riferimento di design o per un sito statico.

Quante pagine dovrebbe avere il sito di una piccola attività?

Dipende dall'obiettivo, ma di solito bastano home, servizi, chi siamo, contatti e pagine legali. Il prompt propone una mappa del sito su misura per il tuo caso.

A cosa serve questo prompt?

Genera la struttura, i testi e il codice HTML/CSS di un sito web professionale e responsive per la tua attività, con SEO di base e accessibilità.

Con quali strumenti di IA funziona?

È pensato per ChatGPT, Claude e Gemini. Non lo abbiamo ancora verificato in questi strumenti, quindi i risultati possono variare da uno all'altro.

Come personalizzo il prompt?

Clicca su «Personalizza» e compila le variabili (Nome dell'attività, Settore, Località, Pubblico di riferimento, Obiettivo del sito, Tono e Colori del brand). Il testo si aggiorna all'istante e poi puoi copiarlo con un clic. I valori vengono salvati solo nel tuo browser.

Serve esperienza per usarlo?

È di livello intermedio: conviene conoscere l'argomento per fornire un buon contesto e valutare il risultato con occhio critico.

Questo prompt è gratuito?

Sì. Tutti i prompt di HomeCasa Prompts sono gratuiti, senza registrazione né abbonamento. Puoi usarli anche in progetti professionali.

Posso fidarmi dell'output dell'IA?

Consideralo una bozza di alta qualità: verifica sempre dati, cifre e affermazioni importanti prima di pubblicare o prendere decisioni.

Prompt correlati