Homework 1, Il sito del gruppo

In questa pagina vengono spiegate le motivazioni delle scelte prese nella creazione di questo sito e ne vengono documentati i risultati. Nel preparare questo sito sono state seguite delle specifiche che ci sono state fornite e che sono leggibili a questa pagina:

Specifiche del sito : copia locale - link remoto




Struttura della pagina

I contenuti di ogni pagina sono organizzati secondo uno modello comune, che divide ogni pagina in 4 aree:
  1. head : intestazione della pagina
  2. menu : menú di navigazione (link alle sezioni principali)
  3. main : corpo principale della pagina (i contenuti specifici della pagina)
  4. tail : fine pagina (informazioni generiche aggiuntive)
Le aree menu (2) e tail (3) hanno un contenuto che è lo stesso per tutte le pagine, mentre le aree head (1) e main (3) vengono modificate a seconda del contenuto specifico della singola pagina. Il modello che abbiamo previsto prevede che l'area menu (2) contenga delle sotto aree (div.menuitem) che hanno lo scopo di organizzare le varie voci del menù.

Utilizzando i fogli di stile CSS è si può personalizzare in modo molto versatile la presentazione della pagina, creando dei layout anche molto diversi tra loro. Tre possibili esempi di questa personalizzazione possono essere:

primo esempio di layout personalizzato con fogli di stile CSSesempio 1

secondo esempio di layout personalizzato con fogli di stile CSSesempio 2

terzo esempio di layout personalizzato con fogli di stile CSSesempio 3




Struttura del sito

Grazie all'area men� descritta nella sezione precedente � possibile accedere alle sezioni principali del sito. I 4 link presenti nel men� sono:
  1. HOME -> La sola pagina principale (Home Page) del sito.
  2. TEAM -> La pagina del gruppo (con la descrizione del gruppo e le pagine dei membri).
  3. PROJECTS -> La pagina dei progetti.
  4. MAP -> La sola mappa dettagliata di tutte le pagine del sito.
Per quanto riguarda la gerarchia delle pagine del sito si è deciso di lasciare tutte le pagine nella directory di root (/). Le uniche eccezioni sono le pagine non consistenti con la grafica del resto del sito, i documenti di stile e i file multimediali che sono stati posti in delle sottodirectory.




Accessibilità delle pagine

Raggiungibilià --> Come si può notare osservando la pagina della sezione MAP ogni pagina interna del sito è raggiungibile con un massimo di 3 click a partire dalla Home Page e con uno solo click a partire dalla pagina MAP stessa.
Visibilità --> nei limiti del possibile abbiamo cercato di rispettare dei criteri precisi nella generazione delle pagine; La grafica è snella, i colori e le immagini non sono fondamentali per la fruizione dei contenuti (l'unica funzione dei colori è quella di distinguere le varie sezione del sito, ma questa notazione è ridondante).




Validità delle pagine (a.k.a. aderenza ai DTD XHTML)

Il DTD che abbiamo usato per tutte le pagine di questo sito è:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Ogni pagina consistente con il sito segue le specifiche di tale DTD ed è stato validata in due passaggi:

  1. Validatore locale: durante la fase di sviluppo del sito.
  2. Validatore online: subito prima della release della prima versione definitiva.
Il validatore online utilizzato è il The W3C MarkUp Validation Service messo a disposizione dal consorzio w3c. Nell'area in fondo ad ogni pagina è presente il riferimento al validatore che certifica l'aderenza della pagina al DTD indicato.




Presentazione

L'aspetto del sito è stato organizzato con l'utilizzo di fogli di stile CSS. Abbiamo utilizzato un foglio con le proprietà base comuni a tutte le pagine. Ogni foglio di stile specifico importa le caratteristiche del foglio base. Ogni sezione del sito ha un suo foglio specifico che modifica alcuni dettagli rispetto al foglio base.




Strumenti di sviluppo utilizzati




Piattaforme sulle quali è stato testato il sito

Pagina XHTML Strict 1.0 valida! Pagina valida per lo standard XHTML Strict 1.0!