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  
 
 

Tecniche di progettazione del sito

  Fase 4: Costruzione della mappa - gerarchia
 
  Una volta identificato lo schema organizzativo delle informazioni, si passa alla definizione di come queste saranno collocate nel sito e delle reciproche relazioni. In buona sostanza, cominciamo a tracciare davvero la nostra mappa. Esistono tre tipi di struttura per organizzare il sito: la gerarchia, l'ipertesto e la sequenza lineare.

La gerarchia, madre dell'ordine
Una gerarchia ben progettata costituisce la base per una valida architettura informativa. Aiuta il navigatore a orientarsi fornendogli un contesto familiare, in netta contrapposizione con la fluidità dei collegamenti ipertestuali che, per loro natura, tendono a confonderlo e disorientarlo. Una sana gerarchia dovrebbe contenere categorie reciprocamente esclusive, vale a dire ogni canale e sezione del sito dovrebbe contenere informazioni che non sono presenti negli altri canali o sezioni.

Esistono sempre eccezioni, naturalmente, tuttavia maggiore è la pulizia dell'approccio, più efficace sarà il risultato. Ciò richiede una chiara definizione della cosiddetta "tassonomia" del sito, vale a dire la definizione delle categorie e delle relative sottocategorie, dei termini, delle etichette e dei contenuti. Per esempio, i piselli appartengono alla categoria generale delle verdure oppure a quella più specifica dei legumi? Quest'ultima è una sotto-categoria delle verdure, oppure va mantenuta a parte?

Una gerarchia è caratterizzata da due dimensioni: larghezza e profondità. Una gerarchia a sviluppo verticale avrà poche voci nel primo menu e avrà numerosi livelli di approfondimento progressivo prima di arrivare all'informazione vera e propria. Una gerarchia a sviluppo orizzontale, invece, offrirà molte opzioni già nella home page e le informazioni saranno immediatamente disponibili uno o due livelli sotto.

Le due caratteristiche vanno bilanciate poiché una gerarchia troppo stretta costringe l'utente a eseguire numerosi clic prima di arrivare a destinazione ed è probabile che il navigatore abbandoni lungo il percorso, una gerarchia molto "larga" invece rischia di confondere il navigatore costringendolo a scegliere immediatamente tra numerose opzioni, per poi deluderlo nella profondità/precisione dell'informazione che viene fornita.

Tra le due, per un nuovo sito si finisce quasi sempre per tendere verso una gerarchia ampia e poco profonda che mostri subito al navigatore tutto quel che il sito offre e che aumenti di profondità solo al crescere in dimensioni del sito. Tale approccio si sposa bene anche con il criterio pratico secondo cui metà dei navigatori si ferma alla home page e perciò questa deve essere la più ricca possibile d'informazioni, compatibilmente con lo spazio a disposizione sul video e limitando il numero di scrolling (solitamente uno) che il navigatore è disposto a fare sulla pagina iniziale.

Ogni volta che si scende di un livello, empiricamente si scopre che perdiamo circa metà dei navigatori (ciò naturalmente cambia a seconda dei contenuti, ma trova spesso conferma nei log delle statistiche di traffico). Ciò significa che in una pagina di secondo livello avremo circa metà del traffico complessivo registrato sulla home e che in una pagina di terzo livello saremo scesi al 25%, e via dicendo. Si capisce, quindi, che esiste un limite fisiologico al numero di livelli che si possono aggiungere in verticale.

I valori ottimali consigliati dagli esperti di usabilità sono cinque livelli in profondità e dieci o dodici categorie in orizzontale. Se il vostro sito deve crescere oltre, sia in larghezza sia in profondità, tanto vale crearne uno nuovo, che raccolga una parte di quello originale e che sia collegato a questo unicamente a livello di home page, disponendo poi di una gerarchia verticale separata. In questo caso si parla di confederazione o costellazione di siti.

Una variante è la creazione all'interno della gerarchia di aree che abbiamo pagine direttamente collegate le une alle altre a creare una sorta di isola all'interno della quale navigare liberamente, con la possibilità di risalire la gerarchia per spostarsi a un'altra area del sito. Questo genere d'impostazione, molto comune, prende il nome di architettura a cluster.

Nel concepire una gerarchia si parte dall'alto e si procede per affinamenti successivi sui livelli inferiori. La progettazione del primo livello è determinante per la funzionalità dei successivi. Perciò questo approccio progettuale viene anche definito approccio top-down.

Il sistema gerarchico presenta naturalmente vincoli che possono impedire il corretto sviluppo del sito perciò, alla pari di quanto abbiamo già visto per gli schemi organizzativi delle informazioni, è consigliabile usare più di uno schema organizzativo anche per le pagine del sito.

Esempio di struttura gerarchica di sito
Qui vediamo lo schema di un sito con struttura gerarchica costruito mediante la funsione di tracciatura diagrammi di Adobe GoLive 6.0. Ogni pagina è collocata in relazione diretta a una pagina superiore (genitore) ed eventualmente a una o più pagine inferiori (figli), con la sola eccezione della home page (index1) che costituisce il punto di partenza per l'intero sito. Una struttura di questo genere è molto ordinata, ma anche molto vincolante.
Nell'esempio abbiamo sfruttato 4 livelli al di sotto della home page, ciņ significa che ci vogliono 4 clic per andare da index a "Strumenti di lavoro". Siamo quindi già vicini limite di profondità (5 livelli) consigliato dagli esperti di usabilità.


Clicca per ingrandire

Esempio di struttura gerarchica di sito - il cluster
Spesso torna utile ricavare una specie di isola all'interno della gerarchia dove sia possibile navigare direttamente tra le pagine così da esplorare un intero argomento senza doversi muovere avanti e indietro sui diversi livelli. Vediamo qui l'esempio delle pagine che compongono la prima lezione del nostro corso, tra loro direttamente collegate. E' possibile risalire, poi, la gerarchia per andare in altri punti del sito.


Clicca per ingrandire

Tutti i documenti relativi a questo articolo:
Introduzione
Fase 1: raccolta d'informazioni sugli scopi del sito
Fase 2: analisi della concorrenza
Fase 3: organizzazione delle informazioni
Fase 4: costruzione della mappa - gerarchia
Fase 4b: mappa - ipertesto
Fase 4c: mappa - struttura lineare
Fase 5: strumenti di navigazione - URL e cronologia
Fase 5b: strumenti di navigazione - preferiti
Fase 5c: strumenti di navigazione - tasti dedicati e altro
Fase 5d: regole di navigazione
Fase 5e: sistemi di navigazione
Fase 5f: elementi di navigazione
Fase 5g: sistemi di labeling

  < Precedente   Prossimo >

 

Corso - Webmaster
 
  Prima lezione:
  Competenze e strumenti
1. Che cosa fa un Webmaster
2. Gli strumenti di lavoro
  1. Editor orientati al testo
  2. Editor visuali semplificati
  3. Ambienti di sviluppo integrati
3. Le altre figure con cui opera
4. Le risorse online
5. Tecniche di progettazione
del sito
  1. Raccolta d'informazioni sul sito
  2. Analisi della concorrenza
  3. Organizzazione delle informazioni
  4. Costruzione della mappa - gerarchia
  4b. Mappa- ipertesto
  4c. Mappa - struttura lineare
  5. Strumenti di navigazione - URL e cronologia
  5b. Strumenti di navigazione
- preferiti
  5c. Strumenti di navigazione
- tasti dedicati e altro
  5d. Regole di navigazione
  5e. Sistemi di navigazione
  5f. Elementi di navigazione
  5g. Sistemi di labeling
6. Definizioni dei termini comuni
7. Esercizi
  1. Riepilogo dei concetti della lezione
  Seconda lezione:
  Siti statici e linguaggio HTML
  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