Documenti di Didattica
Documenti di Professioni
Documenti di Cultura
Ogni documento HTML è contraddistinto dai seguenti comandi di base, che ne definiscono
la struttura:
<HTML>
<HEAD> <TITLE>Nome del documento</TITLE> </HEAD>
<BODY>
</BODY>
</HTML>
All'interno del body è contenuto tutto il documento, ciò che è all'interno dell'head viene
letto dal browser, ma non figurerà nella pagina aperta.
COLORI E SFONDI
All'interno del body possiamo inserire dei comandi che regolano il colore di fondo della
pagina o un eventuale sfondo, il colore del testo, dei links e così via.
Background indica il file in formato jpg o gif che il browser utilizzerà come sfondo per la
pagina.
I contrassegni <P> e <BR> sono utilizzati perché il linguaggio HTML non è sensibile alla
formattazione con la quale è scritto (tranne che per un caso); inoltre questi due tags non
hanno il corrispondente </...> visto che si possono inserire solo a fine linea.
L'intestazione di una pagina, che figurerà come titolo si chiama header. I tags di
intestazione determinano la grandezza dei caratteri dell'header
Headers <Hn> </Hn> dove 'n' è un numero compreso fra 6 e 1 (dal più piccolo al più
grande).
Dopo l'header non è necessario inserire il tag di paragrafo o di Line Break. Digitando il
documento invece bisogna ricordarsi di utilizzarli ogni qual volta si voglia andare a capo o
saltare una riga (come già detto il browser non è sensibile alla formattazione utilizzata in
fase di creazione).
Il linguaggio HTML 3.2 permette di variare la dimensione dei caratteri anche nel
documento oltre che negli header, permette il grassetto, il corsivo ed il sottolineato da la
possibilità di utilizzare alcune font predefinite. Gli effetti ottenibili e le sintassi da utilizzare
sono contenute in questa tabella:
Dimensione dei caratteri <FONT SIZE = -2>... </FONT>
<ADDRESS>... </ADDRESS>
Address
I tags sopraelencati possono essere combinati fra loro per ottenere vari effetti.
HTML 3.2 supporta i font true type (sempre che questi siano supportati dal sistema,
altrimenti vengono ignorati) per utilizzarli si utilizza
<FONTFACE="nome_font">...</FONT>
Sempre utilizzando il tag font oltre alla dimensione (con SIZE da -2 a +4) ed il font (con
FACE) è possibile cambiare il colore di solo alcune parole del testo
<FONT COLOR="#xxxxxx">...</FONT>
il colore è espresso in esadecimale secondo lo stesso criterio utilizzato nel tag BODY.
IMMAGINI
Il comando per inserire un'immagine (foto, disegno, simbolo) all'interno di una pagina html
è il seguente:
<IMG SRC="foto.jpg">
E' importante ricordarsi di segnare anche l'estensione del file e il percorso esatto che il
browser deve compiere a partire dalla directory di residenza del documento.
Nota bene: windows visualizza di solito solo il nome del file e non la sua estensione. In realtà tutti i files sono contraddistinti oltre
che dal loro nome da una sigla composta da tre lettere che il computer segna, preceduta da un punto, dopo il nome del file. Ad
esempio in un file denominato manuale.doc, l'estensione (.doc) indica che si tratta di un documento di testo, il file foto.jpg è invece
un'immagine in formato Jpeg. Nel linguaggio di programmazione HTML bisogna sempre ricordarsi di scrivere i nomi dei files
completi della loro estensione. Inoltre, se il file a cui ci si riferisce non si trova nella stessa cartella del nostro documento, bisogna
segnare l'esatto percorso che il browser deve compiere per trovare il file in questione: ad esempio se l'immagine che si vuole caricare
si trova nella sottocartella "immagini" della cartella "documenti" dovremo dare il comando
<img src="documenti/immagini/foto.jpg">.
Dove alt contiene il testo alternativo che viene visualizzato prima di caricare l’immagine
oppure se ci si pone con il mouse sopra l’immagine stessa, align=bottom indica che il
fondo dell'immagine si deve allineare con un eventuale testo presente nella stessa pagina
(altre opzioni di allineamento sono: top, middle), border disegna un bordo intorno
all'immagine dello spessore definito (in pixel), width e height regolano rispettivamente la
larghezza e l'altezza dell'immagine, espresse sempre in pixel
LINKS
Il comando per costruire delle hot word, cioè dei tratti di testo cliccabili che si collegano ad
un altro documento HTML è il seguente:
Anche in questo caso è importante ricordarsi di segnare anche l'estensione del file e il
percorso esatto che il browser deve compiere a partire dalla directory di residenza.
E' possibile creare dei link anche utilizzando delle immagini. Ad esempio il comando
farà si che l'immagine foto.jpg diventi cliccabile funzionando così come "link" per un'altra
pagina html o un altro tipo di file, come per la foto il tag ALT riporta un testo alternativo.
COME COSTRUIRE DELLE TABELLE
Il comando base per costruire una tabella è <TABLE> </TABLE>
All'interno della tabella dobbiamo poi inserire i vari righi e all'interno dei righi varie celle.
Il comando per inserire righi è <TR> </TR>
Il comando per inserire celle è <TD> </TD>
Ad esempio questa tabella (Esempio1):
sarà una tabella con due righe, ciascuna suddivisa in due celle.
Il comando <caption> serve per dare un titolo alla tabella e può anche non essere usato.
Servono per allineare nel modo voluto il testo all'interno delle celle.
Questi danno un colore o uno sfondo alla cella e la larghezza della cella rispetto al totale
della tabella.
All'interno di ogni cella potremo naturalmente inserire oltre a testo immagini, liks ecc.. tutto
con i consueti comandi.