scarica testo - Benvenuti sul sito del corso Master di primo livello in

VERIFICA
CORSO: MASTER DI PRIMO LIVELLO IN TECNOLOGIE DI SICUREZZA WEB E NETWORKING
CODICE CORSO: B22-75-2008-0
UNITA’ FORMATIVA: LE TECNOLOGIE WEB LATO CLIENT
DOCENTE: DANIELA REMOGNA
DATA: 28 APRILE 2008
ALLIEVO: _________________________________________________________________________
VALUTAZIONE: _____________
1
SPECIFICHE
Progettare e sviluppare il sito web dell’azienda SoftTech, un’azienda di consulenza informatica che opera
nell’ambito dello sviluppo software.
Il sito web dovrà essere sviluppato utilizzando linguaggi web lato client come HTML/CSS/JAVASCRIPT e
dovrà funzionare su qualsiasi server web (Apache, IIS) in una qualsiasi cartella del server.
LAYOUT GENERALE
Il layout generale del sito è rappresentato nella figura sottostante:
2
SPECIFICHE PER L’INTESTAZIONE
L’intestazione è rappresentata nella figura sottostante:
Al posto della scritta LOGO va inserito il logo dell’azienda nominato logo.jpg che trovate all’interno della
cartella IMG. Inserire una descrizione alternativa opportuna.
Inoltre il logo è anche un collegamento ipertestuale che punta alla HOME PAGE del sito.
Specifiche CSS per l’intestazione
Larghezza
Colore di sfondo
800px
#8CC5EA
SPECIFICHE PER IL MENU
Le sezioni principali del sito sono le seguenti:
NOME SEZIONE
NOME FILE
HOME
index.html
AZIENDA
company.html
SERVIZI
service.html
CONTATTACI
contact.html
DOWNLOAD
download.html
REGISTRATI
subscrive.html
DESCRIZIONE
Home Page SoftTECH – Consulenza
Informatica e Sviluppo Software – Torino
Conosci SoftTECH – Consulenza Informatica e
Sviluppo Software – Torino
I servizi di SoftTECH – Consulenza
Informatica e Sviluppo Software – Torino
SoftTECH – Torino – Consulenza Informatica
e Sviluppo Software
SoftTECH – Torino – Consulenza Informatica
e Sviluppo Software
SoftTECH – Torino – Consulenza Informatica
e Sviluppo Software
NB: i nome dei file devono corrispondere a quelli indicati nella colonna NOME FILE.
SPECIFICHE PER L’AREA RISERVATA
L’area riservata è rappresentata da un modulo composto da due caselle(una di tipo testo e l’altra di tipo
password) e due pulsanti, uno che invia i dati con il metodo post al file server side “login.php” e l’altro
che cancella in modo del tutto automatico i dati digitati dall’utente all’interno del form.
Specifiche Javascript per l’area riservata
Gestione dell’evento onsubmit
Nel momento in cui il navigatore clicca sul pulsante ENTRA verificare attraverso l’evento onsubmit del
FORM che entrambi i campi (user e password) siano stati compilati. In caso negativo segnalare l’errore
tramite una finestra popup.
3
Specifiche CSS per l’area riservata
Colore di sfondo
Colore del testo
#FFFF99
#000033
SPECIFICHE PER I CONTENUTI DELLA HOME PAGE
I testi da inserire nell’home page sono contenuti all’interno del file testo_home_page.txt
SPECIFICHE PER IL PIE’ DI PAGINA
Impostazione del css identiche all’intestazione.
Riportare l’indirizzo dell’azienda: Softech srl - Via Cibrario 6 – Torino
e il nome e cognome dell’autore della pagina.
Specifiche CSS GENERALI
Nome oggetto
Tutti i moduli di tipo input (Caselle di
tipo testo, menu a tendina, textarea,
radio, checkbox etc)
Pulsanti di tipo submit
Pulsanti di tipo reset
I titoli H1,H2,H3
Colore di sfondo di tutte le pagine
Voci del Menu Principale
Voci del Menu principale al passaggio
del mouse
Paragrafi dell’home page:
Caratteristiche
Colore di sfondo: #98BADD
Colore di sfondo: #000033
Colore del testo: #FFFFFF
Colore di sfondo: #FF0000
Colore del testo: #FFFFFF
Colore di sfondo: #0066FF
Colore del testo: #FFFFFF
Larghezza: 400px
Spazio tra testo e bordo: 5px
Colore bordo: #000000
Font: Verdana
#FFFFFF
Larghezza: 107px
Spazio tra bordo e testo: 5px
Colore di sfondo: #DDDDFF
Font: Trebuchet MS
Bordo: colore #000000
Nessuna sottolineatura
Larghezza: 107px
Spazio tra bordo e testo: 5px
Colore di sfondo: #7070FE
Colore del testo: #FFFFFF
Font: Trebuchet MS
Bordo: colore #000000
larghezza: 300px
spazio tra bordo e testo: 5px
allineamento testo: giustificato
Font: trebuschet Ms
dimensione carattere: 12px
colore di sfondo: #D9D9D9
bordo: 1px di colore nero
4
SPECIFICHE PER LA PAGINA SERVIZI
Titolo della pagina: I servizi offerti da SoftTECH
A livello di contenuti è presente un elenco puntato così strutturato:
• Sviluppo Software
• Corsi di Formazione
• Creazione di siti Internet
• Installazione di reti wifi
• Sicurezza informatica
La pagina prosegue con un LISTINO PREZZI.
Creare una tabella con i dati seguenti:
Nome Servizio
Sviluppo sito internet
Installazione di reti wifi
Corsi di formazione
Descrizione
Progettazione e sviluppo di siti
web personalizzati
Installazione e configurazione di
Acess Point CISCO
Corsi sul pacchetto Office
Prezzo
Dai 500 € in su
50€/h
30€/h
Specifiche CSS sulla tabella
Colore di sfondo della prima riga:
#BEDFF3
Colore di sfondo della seconda
riga:
Colore di sfondo della terza riga:
#FFFF99
#FFCC66
Colore di sfondo della quarta riga:
#FFFF99
Caratteristiche tabella:
Senza bordi e font Tahoma con dimensione 12px.
SPECIFICHE PER LA PAGINA REGISTRATI
Titolo della pagina: Registrati per riceve le nostre offerte
La pagina registrati contiene un modulo composto dai seguenti campi:
Nome campo
Nome
Cognome
Data di nascita
Sesso
Indirizzo
Citta’
Provincia
Interessi
Condizioni Privacy
Consenso per presa visione
della Tutela della Privacy:
REGISTRATI
ANNULLA
Descrizione
Casella di testo
Casella di testo
Casella di testo
Pulsante di opzione singola (F o M)
Casella di testo
Menu a tendina con le seguenti opzioni:
Torino – Milano – Venezia – Genova
Menu a tendina con le seguenti opzioni:
TO – MI – VE – GE
Pulsante di opzione multipla:
Musica, Informatica, Cucina
Textarea con le condizioni contrattuali riportate nel file
condizioni_privacy.txt
Pulsante di opzione accetto con clausola SI o NO
Pulsante che invia i dati al server
Pulsante che azzera i dati inseriti nel modulo
5
Specifiche Javascript
Gestione evento onsubmit del form
Nel momento in cui l’utente clicca sul pulsante REGISTRA verificare tramite il Javascript che l’utente
abbia dato il consenso per la privacy. In caso negativo segnalare l’errore tramite una finestra popup.
SPECIFICHE PER LA SEZIONE DOWNLOAD
Titolo: Sezione Download
Creare una lista numerata composta dalle seguenti voci:
1. Scheda tecnica Siti Web
2. Scheda tecnica Reti Wifi
Cliccando sulla parola sottolineata Siti Web l’utente ha la possibilità di scaricare il file pdf nominato
“web.pdf” memorizzato all’interno della cartella “Schede”.
Cliccando sulla parola sottolineata Reti Wifi l’utente ha la possibilità di scaricare il file pdf nominato
“wifi.pdf” memorizzato all’interno della cartella “Schede”.
Nota: entrambi i file devono essere aperti in una nuova finestra del browser.
Inoltre creare un form con la struttura rappresentata in figura:
Tale modulo serve a calcolare lo sconto di un importo.
Programmare tale modulo in javascript di modo che quando l’utente clicca sul pulsante CALCOLA sia
richiamata una funzione js che calcola l’importo scontato in base ai valori digitati nella casella IMPORTO
e % DI SCONTO. Infine la funzione deve scrivere il risultato all’interno della casella IMPORTO SCONTATO.
SPECIFICHE PER LA SEZIONE AZIENDA
Titolo: La nostra azienda
Inserire delle immagini seguendo lo schema riportato nella figura sottostante:
6
FOTO INGRANDITA
FOTO PICCOLA
azienda.jpg
azienda_small.jpg
azienda2.jpg
azienda2_small.jpg
azienda3.jpg
azienda3_small.jpg
EVENTO
Al passaggio del mouse su “Foto1
piccola” deve essere caricata la
foto ingrandita indicata nella
prima colonna.
Al passaggio del mouse su “Foto2
piccola” deve essere caricata la
foto ingrandita indicata nella
prima colonna.
Al passaggio del mouse su “Foto3
piccola” deve essere caricata la
foto ingrandita indicata nella
prima colonna.
Programmare una o più funzioni javascript che rispondano alle specifiche dettate nella colonna evento.
Al caricamento della pagina, la prima foto ingrandita visualizzata sarà quella di foto1.
CARICARE IL SITO ONLINE
Caricare utilizzando il protocollo FTP il vostro lavoro su internet:
nome host: www.ictmaster.altervista.org
user: ictmaster
pass: opensource
porta: 21
Una volta collegati creare una cartella nominata come il vostro cognome e caricate il vostro lavoro.
Indicare l’URL per accedere al sito:
___________________________________________________________________________________________
SPAZIO RISERVATO AL DOCENTE:
7