aprile 2003
HOME  |  INDICE  |  CORSI  |  DIZIONARIO  |  ABBONAMENTI  |  SITO  |  HELP
 
   
  CORSI OPENMASTER
  MUSICA DIGITALE  
  WEBMASTER  
 
Lezione 1  
Lezione 2  
Lezione 3  
Lezione 4  
Lezione 5  
Lezione 6  
Editor HTML  
Esercizi  
Risorse  
 
  WINDOWS EXPERT  
 
 

Progettare la pagina

 

Tecniche consolidate per facilitare la navigazione e la lettura delle informazioni

 
 
Introduzione
1: modelli di pagina
2: impostare gli spazi del "canovaccio"
3: tecniche d'impaginazione
 
 

Una volta definita la mappa del sito e la relativa struttura di directory siamo pronti a realizzare le prime pagine campione che ci serviranno come modello per l'intero sito, il "template" o "modello", così chiamato perché serve da "stampo" per la costruzione di tutte le pagine successive. Nel concreto, il template contiene l'intero codice HTML necessario per l'ossatura di una pagina vuota.

Avrà quindi gli elementi di navigazione e gli spazi in cui inserire successivamente i contenuti (testo e immagini) con anche le eventuali informazioni stilistiche (font, colore, sfondo, eccetera). Ogni volta che sarà necessario produrre una nuova pagina, basterà copiare il template, inserire il contenuto e aggiungere eventuali link.

L'operazione può essere eseguita a mano oppure demandata in automatico agli editor che dispongono della gestione automatizzata dei template. In quest'ultimo caso, ogni volta che aggiorneremo il template, saranno aggiornati anche gli elementi fissi (navigazione, pie' di pagina, eccetera) contenuti nelle pagine prodotte nel frattempo a partire da tale template.

Lavorare con i template offre il duplice vantaggio di garantire uniformità a tutte le pagine del sito e di consentire un più semplice passaggio a un'architettura dinamica, tuttavia aggiunge tempo al ciclo di produzione se usiamo un editor che non li gestisce in automatico.

Quest'ultima infatti si basa unicamente su template ai quali sono stati aggiunti marcatori realizzati in un linguaggio di scripting che prelevano il contenuto da un database, invece che richiedere l'inserimento manuale da parte del Webmaster o del content editor. Da notare che il sito dinamico non avrà altre pagine al di fuori dei template, infatti qualsiasi pagina di contenuto verrà prodotta automaticamente al momento della richiesta da parte del navigatore, travasando nel template le informazioni prese dal database, e cesserà di esistere subito dopo. Per tale motivo, abituarsi a lavorare per template costituisce un'ottima palestra per affacciarsi al mondo del Web dinamico.

Il template parte da un disegno generale, spesso realizzato da un creativo, il Web designer, tuttavia spetta al Webmaster oppure all'Editor tecnico trasformare il disegno in una codifica HTML che possa riprodurre nella finestra del browser ciò che il grafico ha concepito in origine.

La traduzione non è mai perfetta, sia perché gli strumenti stilistici offerti dall'HTML sono più rozzi di quelli disponibili in un programma di disegno o di videoimpaginazione orientato alla stampa su carta, sia perché non esiste alcun modo per controllare esattamente l'aspetto che la pagina avrà quando visualizzata dal browser del navigatore.

A differenza della pagina di una rivista, che giace completamente sotto il controllo dell'impaginatore, la pagina Web, per sua stessa natura, nasce per essere visualizzata sui tipi più disparati di computer, equipaggiati con i browser più diversi e con ogni genere di sistema operativo. Inoltre molti browser offrono al navigatore la possibilità di personalizzare ciò che vede, modificando la risoluzione dello schermo, il numero di colori visualizzati, la dimensione della finestra, la grandezza dei caratteri e altro ancora.

Perciò il progettista deve costruire una pagina che mantenga una propria coerenza anche se sottoposta a vistose alterazioni nel momento in cui viene ricevuta. Inoltre, dovrà anche tenere conto di elementi di usabilità e di navigabilità del sito, che consentano a chiunque arrivi nella pagina direttamente dall'esterno di capire dove si trovi, di che cosa la pagina tratta e dove può andare da quel punto.

Prima ancora di scrivere una riga in HTML è necessario dividere la nostra pagina in aree regolari e possibilmente costanti in cui collocare gli elementi di navigazione, il contenuto vero e proprio e qualsiasi altro elemento che sia necessario (ad esempio banner pubblicitari, e così via).

  < Precedente   Prossimo >

 

Corso - Webmaster
 
  Prima lezione:
  Competenze e strumenti
  Seconda lezione:
  Siti statici e linguaggio HTML
1. Progettare un sito statico
  1. Definire la struttura
  2. Collocare i file grafici e multimediali
  3. Domini reali e virtuali
  4. Cos'è un dominio
  5. Registrare un dominio
  6. Recuperare un dominio perso
  7. Collegamenti assoluti e relativi
2. Progettare la pagina
  1. Modelli di pagina
  2. Impostare gli spazi del "canovaccio"
  3. Tecniche d'impaginazione
3. Pagine HTML e marcatori
4. Sintassi HTML
5. Tag strutturali di pagina
6. Strutturare la pagina: tabelle, frame e form
7. Definizioni di HTML
8. Esercizi
  1. Esploriamo i tag di base
  2. Creiamo una pagina vergine con HTML-Kit
  3. Progettare un sito con Golive 6.0
  4. Riepilogo dei concetti della lezione
  Terza lezione:
 Modelli di pagina e tabelle
  Quarta lezione:
  HTML 4.01 e CSS
  Quinta lezione:
  Design e multimedialità
  Sesta lezione:
  Siti interattivi

 Copyright© PC Open - 2002 - 2003

Credits