Prima di procedere con la progettazione della struttura del sito Web, è necessario completare l'Esercizio 1.1:
Creazione di un progetto Web.
Un sito Web è formato da una raccolta di pagine Web. Se nelle pagine Web
si trova il contenuto vero e proprio come, ad esempio,
elementi HTML, immagini e collegamenti, un sito Web è l'organizzazione e la struttura
gerarchiche del modo in cui le pagine Web fit
together. Un sito Web dovrebbe avere un obiettivo di alto livello (ad esempio, fornire
un'area di raccolta organizzata degli
annunci economici) e ciascuna pagina Web
offre il proprio contributo per raggiungere questo obiettivo (ad esempio, vi è una
pagina che esegue ricerche tra i vari annunci).
Il modo migliore per iniziare la progettazione del sito Web consiste nell'identificare
le funzioni che il sito deve supportare per conseguire l'obiettivo prefisso. Per un sito
Web di annunci economici,
è noto che vi sono molte funzioni che si desidera che il sito
esegua. Ad esempio, si desidera che i visitatori del sito possano
effettuare ricerche dei vari elenchi oppure visualizzarli tutti insieme;
inoltre si desidera poter creare e modificare nuovi elenchi.
Per creare un sito Web in grado di eseguire queste funzioni, in questo esercizio si pianificherà la
creazione di quattro pagine che verranno realizzate nell'esercizio successivo.
Queste pagine sono:
- Una home page che visualizzi tutti gli annunci economici del database.
- Una pagina che aggiunge un nuovo annuncio economico al database.
- Una pagina che modifichi o elimini un annuncio presente nel database.
- Una pagina che visualizzi i risultati di ricerca filtrando i risultati di ricerca per categoria.
- Nella vista Selezione progetti, fare clic sul simbolo + accanto al
progetto ClassifiedsTutorial per espanderlo.
- Nella vista Selezione progetti, fare doppio su
Navigazione nel sito Web. Web Site Designer si apre nella vista Navigazione. Con questo strumento
è possibile aggiungere, eliminare e riorganizzare le pagine Web che costituiscono il sito
Web.
- All'inizio, non vi sono icone di pagina visualizzate nella vista
Navigazione. Di solito, la prima pagina che si progetta è la pagina iniziale
oppure la home page del sito. Si tratta della prima pagina a cui accedono
i visitatori del sito Web. Trascinare il componente Nuova pagina
dalla vista Tavolozza e rilasciarlo nella vista Navigazione. Un'icona di
pagina viene visualizzata con il titolo di navigazione della pagina attivo.
- Questa sarà la home page che visualizzerà tutti gli annunci presenti nel
database. Immettere View All Classifieds come titolo di navigazione della
pagina. Successivamente, verrà illustrato come utilizzare il titolo di navigazione
come etichetta della pagina ai fini della navigazione nel sito.
- A questo punto, occorre stabilire in che modo i visitatori possono pubblicare i propri annunci nel sito Web.
A tale scopo, è necessario realizzare una pagina per la creazione delle nuove voci. Aggiungere un'icona per la seconda pagina
trascinando il componente Nuova pagina nella vista Navigazione direttamente
sotto l'icona della pagina View All Classifieds.
- Denominare la pagina Post a Listing. Notare che la nuova pagina
viene visualizzata al di sotto dell'icona della pagina View All Classifieds
e collegata con una linee. Ciò significa che le due pagine presentano
una relazione principale-secondario.
- Inoltre, è necessario creare anche una pagina in cui i visitatori possano modificare oppure
eliminare gli annunci esistenti. Ad esempio, se un visitatore ha aggiunto un annuncio per una bicicletta
e questo annuncio è stato pubblicato per un lungo periodo di tempo senza ricevere alcuna risposta, è
possibile che il venditore desideri diminuire il prezzo richiesto
inizialmente. Aggiungere un'altra icona di pagina accanto
a Post a Listing e denominarla Update Listing. Notare che questa nuova
icona pagina è un elemento di pari livello di Post a Listing e un altro elemento secondario di
View All Classifieds.
- Successivamente, occorre aggiungere una funzione di ricerca al sito Web, in modo che i visitatori
possano effettuare ricerche tra gli annunci esistenti per identificare quelli di maggiore interesse. Per aggiungere
una pagina per visualizzare i risultati di ricerca, inserire un'icona di pagina accanto alla
pagina Update Listing e denominarla Filtered Listings.
Nota: se accidentalmente si inserisce una pagina
nel punto errato oppure si desidera riordinare la struttura della pagina, è possibile
trascinare e rilasciare le icone di pagina in qualsiasi momento per riorganizzare il sito.
- Premere Ctrl+S oppure fare clic sul pulsante Salva
per salvare. La vista Navigazione dovrebbe apparire
come illustrato nella seguente immagine:

Notare la presenza una serie di piccole icone nella parte superiore di ciascuna
icona di pagina. La prima (

) e la seconda icona (

) sono visibili, a indicare
che, per impostazione predefinita, tutte le pagine sono impostate per essere
visualizzate rispettivamente nella navigazione e nella mappa del
sito. La terza icona (

)
rappresenta il primo livello di navigazione. La quarta icona, che non è ancora
visibile, rappresenta i file reali associati all'icona e sarà
visibile solo dopo la
creazione di questi file. Se si crea un file JSP, l'icona è un diamante blu
(

); se crea un file
HTML, l'icona è un gruppo di
parentesi (

).
Sarà possibile acquisire ulteriori informazioni
su queste icone e su altri aspetti relative alla visualizzazione delle
icone di pagina nel corso di questo
modulo.