Selezionare dall elenco<sito web a pagina singola> e clic su OK Come possiamo vedere il percorso è in C\\ documenti.

Transcript

1 1 Creare un sito con front page 2003 (Usiamo questo software molto facile da usare e che per la semplicità sceglieremo quello a pagina singola,senza andare nel professionale.prendiamo un esempio a caso,supponiamo di volere creare questo sito per reclamizzare una edicola giornali, che chiameremo <la mia edicola> verrà impostata solo la Home page<index> e una prima pagina,per semplicità (in seguito, per crearne altre usare lo stesso procedimento ) Nota) il programma di default lo creerà in documenti con il nome di Mio Web seguito da un numero che varierà ogni volta che andremo a creare un nuovo sito.) Una volta ultimato,possiamo cambiare nome al sito e cambiare posizione e salvarlo -esempio su una partizione del nostro Hard Disk. Lanciare Microsoft Front Page 2003 Clic file / nuovo

2 2 Clic al lato destro su <sito web a pagina singola> Selezionare dall elenco<sito web a pagina singola> e clic su OK Come possiamo vedere il percorso è in C\\ documenti.

3 3 Dalla barra del menù,facciamo clic su<visualizza/ spostamento > Clic sinistro sull icona al centro pagina di <index.htm> Andiamo ad inserire lo sfondo alla pagina,facendo clic su<formato >

4 E dal menù a discesa scegliamo <Tema> 4

5 5 Dal lato destro scegliamo il tema sfondo pagina esempio<braccato> Facciamo clic sulla X alla finestra del lato destro per chiuderla.quindi clic sulla barra del menù alla voce inserisci E dal menù a discesa scegliamo <inserisci componente web>

6 6 Scegliamo <testo scorrevole> e clic su fine Digitiamo del testo,esempio< visita la mia edicola virtuale> quindi clic su <stile/formato/carattere/ scegliamo <tahoma>/ grassetto/24pt/colore Dal menù a discesa automatico, scegliamo <il colore blu>

7 Confermare su OK /OK/OK per chiudere le varie finestre. Ora iniziamo ad inserire i vari bottoni del programma nella Home Page<Index.htm> Useremo solo 2 opzioni per avere una idea,in seguito useremo altri modelli. Facciamo clic su<inserisci /immagine/ word art/ 7

8 8 Dal menù a discesa scegliamo Word Art Selezioniamone uno a caso e confermiamo su OK Digitiamo del testo ad esempio <Chi Sono>

9 9 Scegliamo il formato,la dimensione e confermiamo su OK Ripetiamo le stesse operazioni per altri eventuali pulsanti.ora proviamo ad usare altro metodo di pulsante.dal menù <inserisci> scegliamo <inserisci pulsante interattivo>

10 10 Alla voce <testo> digitiamo <la mia edicola> Modifichiamo,tipo/stile/dimensione- carattere,colore originale/colore al passaggio del mouse/ colore al clic del mouse/ e confermiamo su OK. Per modificare la grandezza del testo,facciamo clic sopra con il tasto destro,quindi < proprietà pulsanti> e modifichiamo la grandezza facendo clic su <immagine>

11 11 Portiamo la<larghezza a 305 e altezza a 61> e confermiamo su OK (se non aggiungiamo altri pulsanti).salviamo la pagina da <file/ salva con nome> Controlliamo che ci siano le voci<miosito2> e <index>,quindi clic su <salva>

12 12 Confermare su<si> Confermiamo su OK. Ora proviamo a testare il programma,prima di proseguire. Lanciamo il programma da <file /visualizza anteprima browser/internet Explorer / Noteremo che il pulsante <visualizza la mia edicola virtuale> che si muoverà dal lato destro al lato sinistro,mentre il pulsante <la mia edicola >al passaggio del mouse,varierà di colore. Visto che la prima parte del programma funziona,chiudiamolo da <file/chiudi> Sospendiamo momentaneamente questa pagina index,portandoci nella cartella< documenti> Dove noteremo una cartella dal nome< Siti Web> nel quale è racchiuso il nostro sito.

13 Facciamo clic su <siti web> 13

14 14 Facciamo altro clic su <miosito2> per aprirlo Come possiamo notare in fondo all elenco noteremo il file con l icona di Explorer<index> che sarà quello che ci permetterà l avvio del nostro sito in costruzione e apportare le modifiche. Ora è giunto il momento di creare tante cartelle quanti pulsanti andremo ad inserire nella home page e altri collegamenti ipertestuali. Per questo esercizio al momento ne creeremo solo 2 cartelle che nomineremo : <archivio chi sono> e <archivio la mia edicola> al cui interno andremo ad inserire i vari file attinenti alla cartella e pulsante.(per prova metteremo dei file di testo e immagini che andremo a sostituire con file originali al sito vero tanto per testare i collegamenti ipertestuali). Ora riproviamo a lanciare il programma,nella cartella<documenti> facendo clic su< index> Nota)ogni volta che lanciamo il programma,apparirà la finestra dei Popup il quale ci chiederà il consenso di visualizzare il contenuto bloccato Subito confermiamo su OK,a seguire facciamo clic sulla barra di explorer

15 15 Apparirà la finestra <avviso di protezione> confermiamo su SI.(si avvierà il sito come se fossimo collegati direttamente ad internet sfruttando il Browser interno di Internet Explorer,ma non lo siamo.)facciamo clic su file/ modifica con front page/ riduciamo ad icona la prima finestra di explorer che è statica. Apparirà la finestra di Explorer in movimento che andremo a chiudere e andremo a riaprire la finestra che abbiamo ridotto ad icona. Facciamo clic sul primo pulsante<chi sono> e dal menù a discesa scegliamo <collegamento ipertestuale>

16 16 e nella finestra seguente dove fare il collegamento ipertestuale Controlliamo che sia attiva la voce <miosito2> e dall elenco interno individuiamo la cartella < archivio chi sono> la apriamo e selezioniamo il suo file all interno (che in questo caso è uno solo ma potrebbero essere molti) Come si evince il file in oggetto è selezionato,dobbiamo solo confermare su OK.

17 17 Passiamo al secondo pulsante <la mia edicola> Dal menù a discesa scegliamo <collegamento ipertestuale> Come si evince in questo caso abbiamo il percorso precedente che non va bene in questo caso

18 18 cerchiamo la cartella <archivio la mia edicola>,apriamola e individuiamo il suo file all interno In questo caso possiamo confermare su OK.

19 19 Facciamo clic su file/salva con nome,nella finestra che appare,controlliamo che il percorso sia quello giusto <miosito2> ed in basso <index> Ci viene indicato che il file esiste già,sostituirlo,confermiamo su <SI> Ora andiamo nuovamente a testare il sito se funzionano i collegamenti ipertestuali. Facciamo clic su file/visualizza anteprima nel browser/con Microsoft Internet Explorer Proseguiamo come in precedenza con la stessa finestra protezione,confermiamo si. Facciamo clic sul primo pulsante <chi sono> Come si evince è apparso il file in esso contenuto. Facciamo altra prova sul secondo pulsante <la mia edicola>

20 20 Come si evince,anche in questo caso appare il file al suo interno. Andiamo a creare una seconda pagina(tenendo presente che con le stesse operazioni se ne possono aprire all infinito ). Apriamo nuovamente il sito in lavorazione facendo clic su <la mia edicola >che nel frattempo gli abbiamo provato a cambiarci nome. Lanciamo il file <index> nella cartella documenti Appariranno le solite finestre di avviso

21 21 Confermiamo su OK Confermiamo su <SI> partirà la visualizzazione del sito sfruttando il browser di Explorer. Adesso facciamo clic su file/modifica con front page Riduciamo ad icona la prima finestra e chiudiamo la seconda finestra quella di explorer.

22 22 Come possiamo vedere le due finestre sopra hanno una visione diversa. Riattiviamo la prima finestra ridotta ad icona e facciamo clic su<visualizza / Dal menù a discesa scegliamo <spostamento >

23 23 Facciamo clic con il tasto destro sopra l icona <index> E dal menù a discesa scegliamo <nuovo /pagina >

24 24 Per prima cosa andiamo a rinominare la pagina appena creata.per questo esercizio la rinomineremo <elenco riviste> Ora andiamo a formattare questa nuova pagina che si presenterà vuota. Facciamo doppio clic sulla nuova pagina rinominata<elenco riviste>

25 25 Ripetiamo le stesse operazioni che abbiamo usato per la prima pagina,con formato/ tema/ scegliere al lato destro il tema,quindi inserire un pulsante interattivo,digitare del testo esempio : Gioia con la grandezza da <immagine> di 150 x 30. Inserisci /Word Art /digitare del testo/tipo di carattere/dimensione/inseriamo icone per il ritorno alla home page<index> inserire immagine da file Selezioniamo <home page animata>clic inserisci (inseriamone un altro a fondo pagina ) e dal menù a discesa (sia per la prima che per la seconda) scegliamo <collegamento ipertestuale>

26 26 Selezioniamo <index> <attenzione quello con l icona di Internet Explorer> confermiamo OK Ripetiamo per la seconda icona fondo pagina. Al termine salviamo il lavoro,da :file /salva con nome/ Controlliamo che sia attiva la voce <la mia edicola> e <nuova_pagina1> quindi clic salva

27 27 Confermare su <si> Proviamo con il sistema precedente se tutto funziona e ricordarsi di creare i collegamenti ipertestuali per le cartelle <archivio Gioia> <archivio Epoca><archivio Gente> e le successive cartelle e file che creeremo. Confermiamo su OK Confermiamo altro OK Ora cambiamo un altra volta il nome la sito con<l edicolante> tenendo presente che quando lo dovremo registrare ufficialmente non potremo mettere gli apostrofi,al massimo si potrà

28 28 mettere dei punti intermedi esempio <www. lo. Edicolante.com>meglio se Possiamo anche inserire in ogni pagina un file audio compreso la home page<index-htm> Sarà sufficiente,fare clic in un punto vuoto della pagina(esempio <chi sono>) Dal menù a discesa, scegliere proprietà pagina- Alla voce<suono di sottofondo> fare clic su <sfoglia> individuare il file audio

29 29 (meglio se nel formato Midi per via della sua ridotta dimensione che facilita una veloce apertura) Selezioniamolo e facciamo clic su<apri> il suono verrà inserito nella pagina che suonerà alla sua prossima apertura dal sito internet,quindi fare clic <file/salva con nome> controllare che corrisponda alla pagina in oggetto e confermare su OK Ora dobbiamo trovare un Web Hosting che trasferisca il nostro dominio(sito)in internet. Quando saremo in possesso del dominio lanciamo il nostro sito a mezzo Front Page.

30 30 apriamolo e andiamo ad individuare <INDEX> (quello con l icona di internet ) dove ci faremo sopra un doppio clic per lanciare il sito.

31 31 (nella copia del nostro sito il firewall ci blocca la connessione e ci chiede il consenso per l accesso,confermiamo su OK Nella barra di Explorer facciamo clic con il tasto destro e dal menù a discesa scegliamo <consenti contenuto bloccato>

32 32 Confermiamo su <SI> Saremo proiettati nella finestra virtuale del browser di internet anteprima di come sarà visualizzato. Facciamo clic su<file /modifica con Microsoft Front Page. Riduciamo ad icona la prima finestra. Chiudiamo la seconda finestra( quella in movimento). Riapriamo la prima finestra ridotta ad icona.

33 33 Facciamo clic su <file> e dal menù a discesa,scegliamo <pubblica sito>. Nella finestra <connessione> controlliamo la URL(indirizzo internet) del nostro sito sia quello valido. confermiamo su OK.(in caso contrario fare clic su<sfoglia> e individuarlo.)

34 34. Digitiamo USER ID e la PASSWORD e confermiamo su OK Facciamo clic in basso al lato destro <Pubblica sito> (vedi freccia blu indicativa>

35 35 Attenzione) se il nostro sito ha un contenuto voluminoso,possiamo selezionare una parte dei file /cartelle -posti al lato sinistro,facendo clic sulla freccetta rivolta al lato destro posta al centro pagina. (vedi freccia rossa indicativa). (controllare la barra del download in basso sino al termine,ripetere per gli altri file. Quando abbiamo finito il trasferimento dei file della copia nostro sito, sul sito vero in internet,proviamo a lanciare il sito da internet.) Nota) consiglio :la copia del nostro sito, ci conviene salvarlo in una partizione del nostro Hard Disk o DVD,anche esterno,in modo che, si il nostro computer andasse in crask,non perderemmo tutto il lavoro fatto ed inoltre serve per inserire le modifiche che andremmo ad apportarvi per poi trasferirle sul sito in Internet. Fine del programma