BASI DI HTML

Queste pagine non vogliono essere un trattato sull'HTML; hanno solo la pretesa di dare informazioni di base, necessarie a chi incomincia partendo da zero.
Esse sono pensate per neofiti con un minimo di esperienza di programmazione o con molta buona volontà.

Si consiglia di leggere tutto con attenzione, di seguire l'ordine di successione delle pagine, di provare l'effetto di ogni elemento presentato seguendo i consigli esposti in questa pagina.

Contenuti delle pagine del sito

basi

Descrizione dell'html, come si scrive un codice html, basi della sintassi html, come visualizzare in un browser il codice scritto.

basi

primo sito

Semplici codici da scrivere per prendere confidenza con l'html.

basi

font, liste

Come gestire i caratteri dei testi; tipo, colore, grandezza ed altro. Descrizione delle liste e loro uso.

basi

collegamenti

Come creare un collegamento ad un'altra pagina, ad in'immagine od ad altro.

basi

tabelle

Come dividere un'area in caselle anche di dimensioni diverse; come riempire le caselle con oggetti fissi.

basi

frame

Come dividere una pagina in aree in cui indirizzare documenti od oggetti.

basi

fogli CSS

Come impostare regole di formattazione comuni a più pagine.

basi

grafica

Come è strutturata un'immagine digitale; principali formati per immagini digitali; come inserire un'immagine, dei suoni, un filmato in una pagina web.

basi

secondo sito

Indicazioni su come strutturare ed organizzare un sito.

basi

suggerimenti

Suggerimenti ed informazioni utili a chi non è molto esperto.

basi

indice

Indice delle pagine del sito.

basi

Cosa è l'HTML.

L'HTML (Hyper Text Markup Language) è un linguaggio descrittivo; mentre i linguaggi di programmazione producono un codice diretto al microprocessore, l'HTML produce un codice descrittivo delle proprie intenzioni di visualizzazione di un documento. Si può cosiderare il codice HTML come una comunicazione ad un tipografo (il browser che visualizzerà il documento: Explorer, Netscape, Opera, ecc.); questa comunicazione contiene il documento e delle indicazioni sull'aspetto che si desidera. Il browser, ricevuta la comunicazione, cercherà di rappresentare il documento come desiderato dal mittente; eseguirà in maniera sequenziale (una dopo l'altra così come sono scritte) le istruzioni ricevute. Cercherà di fare del suo meglio, ma se incontra un'istruzione che non conosce o che non capisce, la ignora; se gli viene chiesto un tipo di carattere di cui non dispone, ne userà un'altro simile.
I vari browser, con l'intenzione di offrire ai propri utenti un servizio migliore, hanno adottato altre istruzioni non standard loro proprietarie; non sempre tutti i browser, nelle varie versioni più o meno recenti, supportano tutte le istruzioni e non sempre le interpretano nello stesso modo.
Di conseguenza non sempre i vari browser presentano la stessa pagina web nella stessa maniera; è necessario, quindi, provare la pagina web realizzata con più browser possibili.

Il protocollo html utilizza solo codici ASCII senza formattazioni; pertanto un codice HTML può essere realizzato anche con il programma per scrittura (editor) più semplice che esista. La scelta dipende dalla propria comodità operativa. Una scelta comoda è l'uso di Microsoft FrontPage, presente nel pacchetto Office di Windows; nella scheda "HTML" di FrontPage si può scrivere il codice e, nella scheda "Anteprima", si visualizza immediatamente un primo risultato (da verificare sui browser). In FRONTPAGE è possibile definire colori diversi (percorso STRUMENTI-OPZIONI PAGINA-COLORI CODICE) per le varie parti del codice in modo da visualizzare immediatamente alcuni errori o dimenticanze.

Conviene salvare tutti i documenti, relativi ad un sito, nella stessa directory (eventualmente in sue sotto directory) perché questa viene considerata come il contenitore di tutti i documenti relativi al sito; questo semplifica la descrizione degli indirizzi dei collegamenti fra i vari documenti.

Ulteriori suggerimenti sulle scelte operative, sia per creare che per pubblicare un sito, sono esposti alla pagina "suggerimenti"

Base della sintassi HTML: elementi, attributi, valori.

Questa sezione contiene delle informazioni su come è organizzato l'html; indicazioni su cosa è disponibile , e come va usato, sono riportate nelle pagine successive.

Per convenzione, il file con il documento base (home page) deve essere chiamato index.htm o index.html. Per evitare problemi con le maiuscole o minuscole conviene, per i nomi, utilizzare sempre le minuscole.

Per l'HTML è indifferente che le lettere siano in minuscolo o maiuscolo (i nomi dei files, invece, sono sensibili alle maiuscole e minuscole). "elEmENto", "elemento" od "ELEMENTO" sono la stessa cosa, salvo nella particolare sequenza di escape per rappresentare caratteri speciali. Tre sequenze escape sono:

per "<" occorre scrivere "&amplt" e non "&ampLT"
per ">" occorre scrivere "&ampgt" e non "&ampGT"
per "&" occorre scrivere "&ampamp" e non "&ampAMP"

La directory nella quale si trova il file "index.htm" viene considerata quella di riferimento; il browser assume che tutti i documenti, per i quali non è specificato un percorso diverso, siano in quella stessa directory.


Le istruzioni base vengono chiamate ELEMENTI e vengono racchiuse fra le parentesi angolate (segno di minore < e maggiore >). Questa rappresentazione viene detta TAG.

L'istruzione data con il tag <ELEMENTO> rimane attiva finché non viene inserito il tag di chiusura </ELEMENTO>.


Ogni documento HTML, deve essere composto dai tre blocchi fondamentali html, head e body identificati dai tag:

<HTML> Primo tag del documento. Dichiara che il documento è un documento HTML.

<HEAD> apre il blocco di informazioni che vengono utilizzate, tipicamente dai motori di ricerca (definite dagli elementi META) o dal browser (per esempio il titolo della pagina definito fra i tag <TITLE> e </TITLE> che compare nella striscia blu in alto della pagina web). Escludendo alcuni elementi, che saranno visti successivamente, il contenuto di questo blocco non è fondamentale per la realizzazione del sito.
</HEAD> Chiude il blocco HEAD.

<BODY> Apre il blocco che contiene le definizioni di tutto quello che deve comparire nella pagina web. All'interno di questo blocco vanno inserite le istruzioni.
</BODY> Chiude il blocco BODY.

</HTML> Ultimo tag del documento, dichiara che il documento è finito.


Molti elementi hanno degli ATTRIBUTI che specificano la caratteristica dell'elemento a cui ci si vuole riferire; spesso gli attributi hanno un VALORE che può essere numerico o letterale. Per esempio l'elemento "FONT" (l'uso di questo elemento indica che si vuole definire qualche caratteristica dei caratteri) ha diversi attributi, fra cui "SIZE" e "COLOR"; entrambi possono avere vari valori:

<FONT SIZE="3"> "3" è un valore dell'attributo SIZE dell'elemento FONT.
<FONT COLOR="BLUE"> "BLUE" è un valore dell'attributo COLOR dell'elemento FONT.

I valori degli attributi dovrebbero essere dichiarati fra i doppi apici "; molti browser accettano i valori anche senza doppi apici. Per una compatibilità maggiore, è opportuno usare "le virgolette".
Gli attributi relativi allo stesso elemento possono essere dichiarati insieme separati da uno spazio.

<FONT SIZE="3" COLOR="BLUE">


L'HTML, normalmente, non segue la formattazione con cui si scrive il codice, per andare a capo è necessario inserire il tag <BR>; esso non vede più di uno spazio fra le lettere vicine. Per cambiare questa logica è necessario ricorrere o ad elementi di formattazione (descritti nella pagina font) od ai fogli di stile, come descritto alla pagina fogli.

La suddivisione di una pagina in diverse aree si ottiene o con le tabelle o con i frame.
Suddividendo con le tabelle non si possono cambiare i contenuti delle varie celle; i frame, invece, consentono di indirizzare un contenuto in uno dei frame. Un esempio classico è la suddivisione costituita da un frame orizzontale in alto per il titolo, un frame verticale, a sinistra, largo qualche centimetro per un elenco di scelte ed un frame, per lo spazio rimanente, in cui visualizzare il documento collegato alle scelte disponibili nel frame di sinistra.

Istruzioni sulle possibilità di formattazione dei testi si trovano nella pagina font

I commenti al testo del codice possono essere inseriti in un tag che inizi con un punto esclamativo ed uno spazio:

<! commento>

Visualizzazione off line del web realizzato, su browsers.

Per visualizzare off line (senza attivare un collegamento via internet) un web realizzato, è necessario salvare prima tutte le pagine create ; poi si deve aprire il browser scelto, senza attivare la connessione, ed aprire il web salvato (tipicamente con APRI nel menù FILE).
Può essere interessante vedere il codice usato per realizzare una certa pagina. Si visualizza il codice cliccando, con il tasto destro del mouse, sulla pagina; nelle varie scelte che si presentano, deve essercene una del tipo "codice", "source", "view source", "html" ecc. Cliccando su questa scelta viene visualizzato il codice. Questo codice può essere selezionato, copiato (non direttamente, conterrebbe caratteri che andrebbero tolti; copiare prima in un editor ASCII, come Blocco Note, e poi salvare con estensione .htm) ed inserito nelle vostre pagine.

Ulteriori suggerimenti si trovano nella pagina "suggerimenti".