Progettazione di un sito web

Progettazione di un sito web
Fattori da considerare nella
progettazione di un sito web
Criteri di progettazione siti web
prof.ssa Marina Marziale
Domande da porsi prima dello
sviluppo di un sito web:
• Qual è la missione dell’azienda?
• In che modo il sito supporterà tale missione?
• Quali sono gli obiettivi più immediati del sito?
• Quali sono gli obiettivi a lungo termine del sito?
• In che modo si misura il successo del sito?
Criteri di progettazione siti web
prof.ssa Marina Marziale
Fasi 1-2-3 del progetto di sviluppo di un sito
1) definizione e pianificazione del sito
 definire scopi e obiettivi
2) architettura delle informazioni
 descrizione dettagliata del contenuto con mappe del sito
 miniature, punti essenziali e sommario
 prototipi delle pagine, bozzetti o modelli della progettazione
grafica
3) progettazione del sito
 ricerca, scrittura, organizzazione dei testi
 grafica dell’interfaccia , d’intestazione, del piè di pagina, logo,
pulsanti, sfondi
 Illustrazioni
 foto
Criteri di progettazione siti web
prof.ssa Marina Marziale
Fasi 4-5-6 del progetto di sviluppo di un sito
4) costruzione del sito
 HTML finito per tutte le pagine con collegamenti ben
verificati (mediante Front-page, Dreamweaver…)
5) marketing del sito




pubblicità sulla stampa, radiofonica, televisiva
bacheche in aree ad alto traffico
biglietti da visita
pubblicazioni e materiali promozionali
6) controllo, valutazione e manutenzione
Criteri di progettazione siti web
prof.ssa Marina Marziale
Elementi fondamentali di ogni pagina web
Ogni pagina web ha bisogno che in essa siano
presenti alcuni informazioni fondamentali:
–
–
–
–
–
titolo informativo
identità del creatore
data di creazione o revisione
almeno un link a una home page locale
l’URL della home page sulle pagine di menù principali
del sito
Criteri di progettazione siti web
prof.ssa Marina Marziale
Criteri per ben progettare le pagine
Nessuna pagina morta
Accesso diretto
(meglio menù con da 5
a 7 link e meglio
schermate cariche di
scelte che molti livelli
di menù)
Informazioni chiare e
utili alla navigazione
Velocità accettabile di
caricamento
Semplicità e coerenza
Stabilità di
progettazione
Feedback e dialogo
Utenti disabili (tag
ALT)
Fornire sempre
l’ubicazione
Pulsanti per tornare
indietro e andare
avanti (inserirli nella
barra dei pulsanti)
Criteri di progettazione siti web
prof.ssa Marina Marziale
Progettazione di un sito
•
•
•
•
Organizzare le
informazioni
Dividere il contenuto in
più unità logiche
Stabilire una gerarchia
d’importanza tra le
diverse unità
Utilizzare tale gerarchia
per strutturare le
relazioni tra le unità
Ci sono 4 strutture
essenziali per creare
un sito
–
–
–
–
Sequenze
Griglie
Gerarchie
Reticolati
Criteri di progettazione siti web
prof.ssa Marina Marziale
Elementi inseribili nel sito
• Home page
• Home page a menù
• Home page basate su
notizie
• Home page basate su
percorso
• Schermate introduttive
• Elenchi di risorse, pagine
di altri siti collegati
• Sommari, indici del sito,
mappe del sito
• Pagine delle novità
• Funzioni di ricerca
• Informazioni di contatto e
feedback
• Indirizzi, numeri di
telefono e fax
• Bibliografie e appendici
• Pagine FAQ
• Pagine personalizzate di
errore
Criteri di progettazione siti web
prof.ssa Marina Marziale
Progettazione di pagina
Coerenza :
• definite una griglia di layout e
uno stile per la gestione del
testo e delle immagini e
applicateli in modo coerente
per creare ritmo e unità in tutte
le pagine del sito
Valori
• dimensioni di pagina: l’area
grafica sicura è di 640 x 480,
per stampare 535 x 295 pixel,
per visualizzare 595 x 295
pixel
• lunghezza pagina : con pagine
lunghe prevedere pulsanti a
intervalli equivalenti a una
pagina piccola (295 pixel) per
tornare all’inizio della pagina
• E’ bene inserire
nell’intestazione di pagina
l’identità del sito e nel piè di
pagina
• griglia di pagina
Criteri di progettazione siti web
prof.ssa Marina Marziale
TABELLE, FRAME E COLLEGAMENTI
Utilizzo di tabelle
• è l’unico metodo per impostare
in modo sicuro la struttura
della pagina; per evitare
problemi
• impostare dimensioni fisse
della larghezza delle celle e
inserire in ogni cella
un’immagine invisibile delle
dimensioni desiderate. Con
l’attributo CELLSPACING si
definisce lo spazio intorno alle
celle, con CELLPADDING si
definisce lo spazio tra la cella
e il suo contenuto
Utilizzo di frame
• In tal modo una pagina viene
divisa in più parti e ogni parte
potrà contenere, alternandole,
più pagine HTML a scelta
dell’utente.
Utilizzo di collegamenti
• I collegamenti tramite parole
vanno inseriti sulla parola più
importante del testo: un
esempio scadente è :”fatte clic
qui per informazioni sui
collegamenti”, buono “i
collegamenti sono potenti”
Criteri di progettazione siti web
prof.ssa Marina Marziale
Regole tipografiche
• Usare in modo discreto il
corsivo e il sottolineato
• Evitare titoli tutti maiuscoli
• L’interlinea ideale si
ottiene aggiungendo da 2
a 4 alla dimensione del
carattere (se è 12
l’interlinea sarà da 14/16)
• Usare per blocchi di testo
e titolo la giustificazione a
sinistra
• Usare tabelle di layout
con celle di testo non
superiori a 365 pixel (così
facendo si produce una
riga di circa 50 caratteri
(con times new roman da
12 punti)
Criteri di progettazione siti web
prof.ssa Marina Marziale
Regole tipografiche
• I tipi di carattere da utilizzare
sono moltissimi ma ricorda che
non tutti i computer sono dotati
dei font che noi usiamo. Meglio
usare caratteri ben leggibili (la
leggibilità è influenzata dalla
cosiddetta altezza x cioè
l’altezza di una x minuscola e
dalla dimensione generale del
carattere). Times New Roman
è accettabile, buoni i caratteri
progettati proprio per lo
schermo Georgia e Verdana.
• Evitate testo colorato
soprattutto nei colori simili a
quelli dei collegamenti (bene
per i titoli di sezione scegliere
varie sfumature di colore scuro
in contrasto con lo sfondo)
Criteri di progettazione siti web
prof.ssa Marina Marziale