:: Corso rapido HTML: Nozioni di base ::
Introduzione
Considerate questa breve guida come un rapido vademecum sul linguaggio HTML. Il suo scopo non è quello di imbottirvi di dettagli tecnici o di operazioni avanzate, ma di illustrarvi le sue caratteristiche principali ed i passi indispensabili per creare un file HTML essenziale. Ovviamente, potrete ampliarle quanto volete, aggiungendo o modificando i concetti esposti.
Iniziamo...
Tanto per contarcela...
Una pagina web appare sullo schermo di chi naviga come un unico documento multimediale. Nella finestra del browser (es. Firefox, Opera, Internet Explorer, ...) prende forma una struttura unitaria in cui si combinano componenti di diverso tipo in modo più o meno gradevole, dove per componenti intendiamo testi, immagini, animazioni, suoni, filmati, moduli e quant'altro, in alcuni casi cliccabili dall'utente e quindi interattivi.
Ciò che però sullo schermo appare come "monolitico", nella realtà implementativa è il frutto di un assemblaggio effettuato in tempo reale dal nostro browser. Assemblaggio di cosa?
- di un file principale, detto codice sorgente, in formato HTML, che contiene il testo del documento e le istruzioni (tag) che ne determinano l'aspetto e ne definiscono i collegamenti con altri file e/o pagine;
- dei vari file multimediali, che concorrono a completare il documento. Da notare come questi ultimi siano esterni rispetto al file principale, e che vengano richiamati al suo interno solo in fase di visualizzazione mediante apposite istruzioni inserite nel codice sorgente.
La pagina web costituisce l'applicazione più diffusa dei principi dell' ipertesto, in soldoni, una "rete" di testi collegati tra loro in modo non necessariamente sequenziale attraverso gli hyperlink (più spesso abbreviati in link). Perché introduciamo il concetto di ipertesto lo scopriremo nel prossimo paragrafo.
L'HTML e i tag
Abbiamo appena detto che il nucleo fondamentale di una pagina web è il suo codice sorgente, ovvero un file scritto in linguaggio HTML. HTML sta per HyperText Markup Language traducibile come "linguaggio per la marcatura degli ipertesti", dove per marcatura possiamo intendere definizione. E' infatti importante sottolineare come l'HTML non sia un linguaggio di programmazione, ma piuttosto un linguaggio per la definizione dei contenuti di un ipertesto e di come questi debbano essere disposti nella pagina.
Perché un file HTML sia valido deve soddisfare due prerequisiti:
- deve avere estensione .html o .htm. Vanno bene entrambi: l' "htm" è un refuso dei tempi del DOS e dei primi Windows, quando un'estensione non poteva superare i 3 caratteri;
- deve contenere istruzioni HTML corrette.
Le istruzioni sono chiamate tag ( = marcatori) e pur esistendone diversi, ognuno con le sue specifiche funzioni, hanno tutti in comune alcune caratteristiche fondamentali:
- devono essere racchiusi tra i segni < e > (minore e maggiore). Ad esempio <HEAD> e <BODY> sono tag validi, mentre >HEAD< o BODY> non lo sono. Quando il browser, scandendo il codice HTML, incontra uno di questi simboli, capisce che ciò che contengono sono istruzioni da eseguire e non testo da visualizzare sullo schermo;
- la maggior parte dei tag (non tutti) funziona in coppia secondo questo schema:
<TAG_DI_INIZIO> testo o elemento cui si applica il tag </TAG_DI_FINE>
Per esempio, il tag <B> serve a formattare un testo in grassetto e deve essere espresso con un'istruzione di inizio e una di fine:
<B> questa frase è in grassetto </B>;
- possono contenere attributi che ne definiscono determinate proprietà. Ogni attributo può assumere differenti valori, specificati secondo questo schema:
<TAG attributo1="valore1" attributo2="valore2"> testo o elemento cui si applica il tag </TAG>
Creare un file HTML
Un file HTML può essere scritto con un qualsiasi editor di testo, parola per parola e tag dopo tag, oppure ricorrendo a un apposito programma chiamato - manco a dirlo - editor HTML. Analizziamo i pro e contro delle due soluzioni.
Scrivere il codice manualmente ha alcuni indubbi vantaggi: è molto utile a livello didattico, consente un controllo diretto e totale sul codice ed è sufficiente un banale editor di testi per realizzare i sorgenti. Il suo limite è che più la pagina o il sito web diventa articolato e più la gestione del file HTML diventa complessa e macchinosa, e dunque poco performante.
La seconda strategia prevede invece l'utilizzo degli editor HTML, programmi più o meno complessi che facilitano il lavoro dell'autore fornendo molti strumenti utili per facilitare la scrittura e la gestione della pagina e del sito. Gli editor di maggior successo commerciale sono quelli con l'ambiente di lavoro simile ai più noti software di videoscrittura (come Writer o Word) e che permettono la creazione di pagine web attraverso un'intuitiva interfaccia grafica. Questo sistema (anche detto WYSIWYG, "what you see is what you get") rende superflua la conoscenza stessa dell'HTML in quanto sarà l'editor a generare automaticamente il codice corrispondente. Lo svantaggio è che non tutti questi software generano un codice pulito, portabile, ottimizzato e snello.
In rete possiamo trovare ottimi editor HTML gratuiti. Tra questi ricordiamo:
- Notepad++, è un editor testuale che supporta decine di linguaggi di programmazione oltre all'HTML. E' distribuito sotto licenza GPL;
- NVU, un editor HTML visuale open source supportato da Mozilla ma purtroppo fermo alla versione 1.0 risalente al lontano 2005;
- Kompozer, nato dalle ceneri di NVU, sta riscuotendo vasti consensi di pubblico e critica. E' anche lui open source.
Lezione Successiva: Struttura
Guide
