Sito semplice - Babaiaga informatica per principianti

strega con scopa
Informatica per principianti
Babaiaga
prova
Vai ai contenuti

Sito semplice

OldArticle
Articolo non più aggiornato

Possiamo usare qualsiasi template gratuito che troviamo nel web.

Il nostro sito avrà due parti importanti:

Sito locale: una cartella sul disco rigido dove depositare i nostri file ed elaborali.

Sito remoto: cartella del provider che ospita il nostro sito web per poter essere visto in internet.

Iniziamo dal nostro sito locale:

1 - Dal menu sito scegliamo > Gestisci sito vedi foto menu sito

2 - Scegliamo Nuovo e quindi sito ... vedi foto crea sito

3 - Inseriamo i parametri richiesti in sito locale ... vedi foto percorso

4 - Nella casella di testo Nome del sito, inserire Magazine ovvero il nome del sito

5 - Nella casella di testo Cartella principale locale, specificare il percorso dove abbiamo creato e salvato il nostro sito sull' Hard Disk.(nel nostro caso abbiamo salvato il tutto in C:\Program Files\EasyPHP5.3.0\www\magazine\) ... vedi foto percorso

6 - Nella casella di testo Cartella immagini predefinita , specificare il percorso della cartella immagini magazine. Nel nostro caso: C:\Program Files\EasyPHP5.3.0\www\magazine\images.

è possibile fare clic sull'icona gialla a forma di cartella per individuare e selezionare la cartella dove inserire le immagini, oppure immettere un percorso predefinito nella casella di testo Cartella immagini. vedi foto cartella immagini

7 - Premendo fine appare sulla destra il sito che abbiamo appena creato con le sue cartelle. Premiamo due volte F4 e si chiude il pannello laterale. vedi foto pannello laterale sito

Abbiamo creato il nostro sito locale dove depositare i files.

Ora abbiamo due strade per costruire la nostra pagina web:

1 - La prima è andare nel menu File > nuovo e dalla schermata che si apre scegliere:

Pagina vuota (a sinistra nella schermata)

Tipo di pagina: HTML

Layout: scegliere quello desiderato

Tipo di documento: impostare la voce a XHTML 1.1

Layout css: aggiungi a HEAD (di default)

e premere Crea

Avremo la nostra pagina web di base già formattata e pronta ad essere modificata.

Strada consigliata

Scarichiamo il file check_magazine_pt5_cmplete.zip (by www.adobe.com), ma possiamo trovare molti altri templates free visitando il sito dreamweaver-templete.org

Scompattiamo il tutto e copiamo i files (eccetto il file text) all'interno della cartella magazine del nostro sito.

Abbiamo il nostro sito caricato e pronto per essere modificato e pubblicato su server remoto.

8 - Apriamo il file index (doppio click) e possiamo vedere la struttura del nostro sito completo.

9 - Possiamo osservare andando in visualizzazione codice (vedi foto codice) che è presente un foglio di stile (riga 6 <link href="check_magazine.css" rel="stylesheet" type="text/css" />) che determina il layout (ovvero l'impaginazione) della nostra home page e un menu spry (riga 7).

10 - Andiamo nel menu > finestra e scegliamo risultati > convalida. vedi foto menu finestra

Si aprirà un menù a soffietto in basso. Premiamo sulla freccia verde a sinistra e scegliamo convalida documento corrente. vedi foto convalida

Vediamo se il nostro sito supera l'esame delle convalida senza errori di programmazione. Perfetto nessun errore.

In caso di errori verranno segnalati nel riquadro a sinistra. A destra troverete la spiegazione del tipo di errore e un collegamento ad adobe per le soluzioni relative.

Abbiamo finito e siamo pronti per le modifche.

Per il testo basta cancellare quello presente e riscrivere le nostre notizie. Lo stesso procedimento per le immagini. Cancelliamo quelle presenti e le sostituiamo con altre.

Per le immagini dell'intestazione bisogna aprire il file .css vedi foto css e trovare i relativi file (.jpg o .gif) e sostituirli con altre immagini.

I passaggi seguenti sono facoltativi...vedi punto 2

11 - Proviamo a renderlo compatibile con le ultime norme del W3C per il formato xtml 1.1 strict.

Torniamo nella visualizzazione codice e selezioniamo le prime due righe ovvero fino a <head> della nostra pagina index.

Dal menu file di dreamweaver (in alto a sinistra) scegliamo Nuovo.

Dalla finestra che si apre scegliamo tipo di

Pagina: HTML

Layout: Nessuno

e in basso a destra

Tipo documento: XHTML 1.1

quindi premiamo crea. Dalla schermata che appare (dovremmo essere già in visualizzazione codice, selezionare le prime due righe e copiarle nella nostra pagina index nella medesima posizione (vanno a sostituire la selezione che avevavo fatto prima). Salviamo.

Ora proviamo a verificare se vi sono errori con il nuovo formato xhtml 1.1 ripetendo il passo 10. Nessun errore.

Abbiamo la nostra pagina web compatibile xhtml 1.1 pronta per essere modificata nel testo e nelle immagini.

Ora possiamo inserire i parametri necessari per scaricare le nostre pagine in remoto, sul server del nostro provider.


1 - Dal menu Sito andiamo in Gestisci sito.

2 - Dal menu che si apre scegliere sulla sinistra il nome del nostro sito e sulla destra Modifica

3 - Dalla schermata che si apre scegliere a sinistra Categoria > informazioni su remoto

4 - Inserire sulla destra i seguenti parametri:

Accesso: FTP

Host FTP: fornito dal provider (in genere coincide con qualcosa come ftp.nomesito.com)

Cartella Host: nome della cartella principale dove depositore i files (viene indicato dal provider)

Nome Utente: Nome fornito dal provider

Password: consigliamo di lasciare in bianco e inserire la password(fornita dal provider) di volta in volta che trasferiamo i file in remoto.

Spuntare Usa FTP passivo

Infine premere OK.

Ora portiamo il mouse sulla destra della schermata di dreamweaver principale e con il tasto sinistro premiamo sul bordo grigio scuro.

Si aprira un pannello.

pannello e bordo destro



Ora premiamo sull'ultima icona a destra (espandi per visualizzare siti remoti e locali).


pannelo laterale
Ora la schermata si è allargata a tutto schermo.

Dobbiamo premere l'icona con la doppia spina che indica la connessione con l'host remoto (la prima dopo Mostra: nome del sito). (vedi foto)

Vi verrà chiesto di inserire la password e poi premendo la freccia azzurra verso l'alto potrete caricare i vostri file sul server (ricordatevi di selezionare, a destra, i files che volete caricare).

Alla fine ricordatevi di premere ancora sulla spina (prima icona) per disconnetersi da internet.

Abbiamo finito. Non resta che entrare in internet e verifcare, digitando il nostro dominio, che tutto è andato a buon fine.

2002 Babaiaga
w3c html5 validazione
Torna ai contenuti