Programma Informatica 1 Esercitazione WEB n. 1: Word e HTML

Programma Informatica 1
Esercitazione WEB n. 1: Word e HTML
Scopo: Creare un semplice sito web con Microsoft Word. Il sito web è composto da una home
page, contenente due hyperlink a due altre pagine (curriculum e hobby). Oltre all’inserimento
degli hyperlink esterni, verranno provate altre funzionalità (inserimento sfondo della pagina,
inserimento immagini, inserimento hyperlink interni).
A – Inizio
1.
2.
3.
4.
Crea una directory di lavoro sul disco fisso e chiamala Esercitazione word-web.
Avvia MS Word e crea un nuovo documento. Scegli il modello “Pagina Web”.
Realizza una semplice home page, inserendo alcuni tuoi dati personali.
Salva il file come “Pagina web” nella directory di lavoro precedentemente creata
(menù File > Salva come Pagina Web, nome file pghome); assegna un titolo alla pagina
(pulsante “Cambia titolo”); il file viene salvato con estensione .htm. Chiudi il file.
B – Inserimento hyperlink esterni ed interni
5.
Apri il documento word testo1.doc fornito e salvalo come “Pagina web” nella directory
di lavoro (menù File > Salva come Pagina web, nome file curriculum).
6. Inserisci un collegamento alla home page creata in precedenza (pghome.htm): seleziona
il testo “Torna alla home page”, quindi menù Inserisci > Collegamento Ipertestuale.
All’interno della finestra di impostazione, scegli File Esistente o Pagina Web, seleziona
il file pghome.htm (imposta riferimento relativo senza percorso), quindi clic su OK.
7. Crea ora due hyperlink “interni” al documento, ossia dei collegamenti che, partendo da
ciascuna riga del mini-indice iniziale, puntano a delle posizioni interne al documento
stesso, corrispondenti in questo caso al titolo di ciascuna delle due sezioni del curriculum
(1. Titoli di Studio, 2. Esperienze Professionali). Procedi come segue: identifica il titolo
di ciascuna delle due sezioni con un segnalibro (seleziona il testo quindi menù Inserisci >
Segnalibro, dai un nome al segnalibro quindi clic su Aggiungi).
Seleziona ora la prima riga del mini-indice Titoli di Studio, quindi dal menù Inserisci,
scegli Collegamento Ipertestuale. All’interno della finestra di impostazione del
collegamento ipertestuale, fai clic su Inserisci all’interno del documento, quindi nella
lista delle posizioni interne, seleziona la corrispondente posizione creata in precedenza.
8. Ripeti per la riga successiva (Esperienze Professionali). Alla fine di ciascuna delle due
sezioni del curriculum crea un hyperlink “interno” che riporti all’inizio del documento.
9. Salva e chiudi il file Curriculum.htm.
10. Sempre con MS Word, crea un’altra pagina web, con una descrizione dei tuoi hobby.
11. Salva il file come “Pagina web” nella cartella precedentemente creata (menù File > Salva
come Pagina web, nome file hobby).
12. Inserisci un link ipertestuale alla home page creata in precedenza (pghome.htm).
C – Completa il sito web e naviga nel sito
13. Apri nuovamente il file pghome.htm (con Microsoft Word); aggiungi un riferimento
ipertestuale al file curriculum.htm ed un altro al file hobby.htm. Salva e chiudi.
14. Prova ora a navigare all’interno del semplice sito web di tre pagine da te creato. Avvia
Internet Explorer, menù File > Apri, quindi con il pulsante Sfoglia localizza il file
pghome.htm (in alternativa, localizza il file pghome.htm e fai doppio click sulla sua
icona per aprire il file all’interno del browser Internet Explorer).
15. Fai clic sui due hyperlink della home page e verificane il funzionamento. Verifica, che sia
dalla pagina curriculum che dalla pagina hobby, è possibile tornare alla home page.
D – Aggiunta di formattazione alla home page
16. Apri la home page con il browser e fai clic sul pulsante Modifica con Word nella barra
degli strumenti di Internet Explorer. Si apre il file pghome.htm all’interno di MS Word.
17. Applica alcune caratteristiche di formattazione (font Comic Sans, colore del testo e
dimensioni, allineamento) per migliorare l’aspetto estetico della home page. Salva.
18. Torna alla home page visualizzata nel browser Internet Explorer e clicca sul pulsante
Aggiorna per caricare l’ultima versione della pagina dopo le modifiche. Verifica che la
pagina caricata presenti le caratteristiche di formattazione impostate al punto precedente.
E – Aggiunta di un file immagine “.jpg” alla home page
19. Con PowerPoint realizza una slide che illustri la struttura del sito web creato ed i link tra
le pagine. Salva la slide come file “jpeg” (menù File > Salva con nome, Tipo file jpeg).
20. Riapri il file pghome.htm con MS Word e posiziona il cursore alla fine del file.
21. Inserisci il file immagine jpg appena creato: menù Inserisci > Immagine> Da File e
localizza il file da inserire. Dopo aver inserito il file immagine, salva e chiudi.
22. Torna alla home page visualizzata con il browser Internet Explorer e clicca sul pulsante
Aggiorna. Verifica che la pagina caricata contenga l’immagine inserita.
23. Apri “Risorse del Computer” e verifica che è stata creata dal sistema una sotto-directory
alla directory principale di lavoro Esercitazione word-web, contenente il file jpeg.
F – Aggiunta di un link ad un messaggio di posta elettronica
24. Apri il file curriculum.htm con MS Word ed inserisci un hyperlink ad un indirizzo di email: menù Inserisci > Collegamento Ipertestuale, quindi all’interno della finestra di
impostazione, clicca su Indirizzo di posta elettronica e inserisci i dati richiesti (indirizzo
di posta elettronica e oggetto del messaggio). Salva il file curriculum.htm.
25. Torna alla pagina visualizzata con il browser e clicca sul pulsante Aggiorna. Verifica che
la pagina contenga l’hyperlink inserito. Fai clic sull’hyperlink e verifica che il client di
posta elettronica (MS Outlook) mostri il messaggio e-mail da completare. Chiudi.
G – Aggiunta di uno sfondo alla pagina degli hobby
26. Apri il file hobby.htm con MS Word e inserisci uno sfondo alla pagina: in MS Word,
seleziona menù Formato > Sfondo, quindi Effetti di Riempimento.
27. Nella finestra seguente, seleziona la sotto-directory Immagine, pulsante Seleziona
Immagine per scegliere il file di sfondo (usa il file sfondo1.jpg fornito). Salva.
28. Torna alla pagina hobby visualizzata nel browser; clicca sul pulsante Aggiorna.
29. Apri “Risorse del Computer” e verifica che è stata creata un’altra sotto-directory alla
directory principale di lavoro “Esercitazione word-web”, contenente il file di sfondo.
H – Accesso al codice HTML
30. Accedi ora al codice HTML delle tre pagine create (apri i tre file .htm con Blocco Note
oppure all’interno del browser Internet Explorer seleziona menù Visualizza > HTML).
31. Ricerca le righe del codice HTML relative ai seguenti elementi delle pagine: titoli delle
pagine, hyperlink esterni, hyperlink interni, esempi di formattazione del testo,
inserimento file immagine, hyperlink a posta elettronica, sfondo.
I – Copia su floppy disk e verifica finale
32. Copia i file del sito web sul tuo floppy disk e cancellali dal disco fisso. Prova di nuovo a
navigare tra le pagine del sito (sul floppy), verificando che gli hyperlink siano corretti.