▧ Progetto finale

Mini sito finale

Crea un mini sito di quattro pagine collegate da un menu comune.

Obiettivo

Mettere insieme struttura, navigazione, contenuti e organizzazione dei file.

Traccia

Crea un mini sito di quattro pagine collegate da un menu comune.

Requisiti richiesti

  • Prepara quattro file: home, chi-siamo, servizi, contatti.
  • Ripeti lo stesso menu in tutte le pagine.
  • Usa percorsi relativi corretti.
  • Controlla che ogni pagina abbia title e h1 specifici.
Consiglio: prima scrivi il contenuto in modo semplice, poi controlla la gerarchia dei titoli e solo alla fine pensa alla grafica.

Procedura guidata

  1. Crea un nuovo file con nome chiaro, ad esempio 10-mini-sito-finale.html.
  2. Inserisci la struttura base del documento o lavora dentro il main se il layout è già pronto.
  3. Aggiungi titoli, paragrafi, liste, immagini o form richiesti dalla traccia.
  4. Apri il file nel browser e verifica che i contenuti siano nell’ordine corretto.
  5. Valida il codice e correggi eventuali tag non chiusi o attributi mancanti.

Base di partenza

Il codice seguente non è l’unica soluzione possibile: usalo come riferimento e personalizzalo.

<header>
  <nav aria-label="Menu principale">
    <a href="index.html">Home</a>
    <a href="chi-siamo.html">Chi siamo</a>
    <a href="servizi.html">Servizi</a>
    <a href="contatti.html">Contatti</a>
  </nav>
</header>
<main>
  <h1>Studio Web Locale</h1>
  <p>Realizziamo pagine web semplici, chiare e facili da aggiornare.</p>
</main>

Checklist di controllo

  • Semantica: i tag descrivono il ruolo reale dei contenuti.
  • Accessibilità: immagini, form e link sono comprensibili anche fuori dal contesto visivo.
  • Ordine: c’è un solo h1 e i titoli non saltano livello senza motivo.
  • Percorsi: link, immagini e file collegati usano nomi corretti.

Continua gli esercizi

Passa alla traccia precedente o successiva mantenendo lo stesso metodo: struttura, controllo, miglioramento.