Costruire il sito

di Maria Silvana Radice






Come costruire il sito

How to create the website


Questa pagina e` una continuazione della guida Come creare un sito da zero, passo a passo..

La prima pagina del sito che dovete creare è la pagina principale (root), quella, cioè che sarà la vostra home page e che verrà visualizzata per prima quando un visitatore accederà digitando l'URL del sito nel proprio browser, o cliccandolo nei risultati di ricerca.
La home page è una pagina normalissima, con una caratteristica: deve chiamarsi, obbligatoriamente, index.html.
Per creare la home page, dovete, quindi, creare una pagina in un file .txt, come descritto in precedenza e poi rinominarlo index, dandogli estensione .html

Creare altre pagine:

Fatta la home page, potete creare tutte le altre pagine che desiderate, rinominarle come credete (ma la index deve essere una sola), dargli estensione .html e metterle nella stessa cartella.

Ricordatevi di usare, sempre, lettere minuscole e di non lasciare spazi tra le parole.

Adesso che avete capito com'e` la struttura di una pagina html, per apportare modifiche alle pagine e inserire contenuti, potete avvalervi, anche, di un editor visuale. Ce ne sono molti in rete, gratuiti e a pagamento. Io ve ne consiglio uno abbastanza semplice e intuitivo:  Kompozer, che e`, anche, in italiano. A questo indirizzo: http://digidownload.libero.it/cislscuola.ts/tk.pdf, potete trovare anche una guida all'uso scaricabile.
Dopo averlo installato e avviato, cliccando sulla voce "Apri", in alto a sx, potrete caricare la pagina su cui intendete lavorare e apportare le modifiche necessarie, sia in modo visuale, sia operando direttamente nel codice html.







L'editor piu` semplice, comunque, e` quello che troverete, di default, nel vostro spazio hosting e di cui apprenderete il funzionamento continuando a leggere questa guida.

Creare il menù di navigazione..

Le pagine che avete creato, per poter essere accessibili, vanno collegate al menu` di navigazione del sito.

Per collegare le pagine del sito al menu` di navigazione, dovete indicare il percorso di ogni pagina in ogni voce corrispondente del menu`.
Dato che, nel nostro caso, le pagine (index compresa)  si trovano tutte nella stessa cartella, basterà scrivere il nome di ogni file come indicato in rosso nell'esempio sotto, ....

<div id="navigation">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="pagina1.html">Pagina 1</a></li>
<li><a href="pagina2.html">Pagina 2</a></li>
<li><a href="pagina3.html">Pagina 3</a></li>
<li><a href="pagina4.html">Pagina 4</a></li>
</ul>
</div>

Per aggiungere nuove pagine, vi bastera` ripetere la stringa:

<li><a href="paginaX.html">Pagina X</a></li>

Le voci Pagina 1 (2/3/4), corrispondono al titolo delle pagine che apparira` nelle caselle menu` di navigazione. Sostituitele con il nome reale di ogni pagina corrispondente.

Attenzione:
  • Se le pagine non fossero nella stessa cartella della pagina index, nel loro percorso dovra` essere indicata anche la cartella in cui si trovano. Es: nomecartella/nomepagina.html
  • Se le pagine fossero in un altro spazio web, il percorso dovra` corrispondere al loro indirizzo per esteso. Es: http://nomesito.com/nomepagina
  • Quando pubblicherete il sito, pero`, sempre e solo nel menu` di navigazione della pagina index, il percorso della home page dovra` essere scritto per esteso, come in questo esempio:

<ul>
<li><a href="http://nomesito.host2c.com/">Home</a></li>
            <li><a href="pagina1.html">Pagina 1</a></li>
            <li><a href="pagina2.html">Pagina 2</a></li>
            <li><a href="pagina3.html">Pagina 3</a></li>
</ul>

Al posto di http://nomesito.host2c.com/, metterete l'indirizzo del vostro sito.

Bene, quando avrete la vostra cartella con tutti i file che compongono il vostro sito, vi bastera`cliccare sul file index per aprirlo nel browser e visualizzare il sito in anteprima, spostandovi in ogni pagina tramite il menu` di navigazione. E ora continuate con la terza parte della guida...



1   2   3   4   5   6   7   8   9
Continua con: Includere il foglio di stile ->>