 |
     
 |
|
|
|
| ||||
|
|
Nella scorsa lezione abbiamo visto come il termine HTML è l'acronimo di "HyperText Markup Language", che possiamo tradurre con "Linguaggio basato sui marcatori per ipertesti", e come più in generale le lettere ML negli acronimi XML, DHTML, VML, ecc hanno il significato di Markup Language. In questa lezione cercheremo di comprendere il significato di questi tre termini che formano l'acronimo HTML . 1) LinguaggioL'HTML è ovviamente un linguaggio per computer, non certo un linguaggio umano, come l'italiano o l'inglese. E' un linguaggio che serve per dare istruzioni ad un computer, per dirgli di fare delle cose.
Come tutti i linguaggi è formato da parole, sequenze di caratteri che hanno un significato, e da una sintassi, che definisce le regole da usare per combinare insieme le parole in frasi più complesse. E' un linguaggio che serve per dare istruzioni ad un computer, per dirgli di fare delle cose. Internet Explorer 4.0 o superiori (ed in parte anche Netscape 4 o superiori) gestiscono il linguaggio HTML in maniera dinamica. HTML dinamico o DHTML (Dynamic HTML) significa essenzialmente che il browser applica immediatamente le modifiche che derivano dall'input dell'utente o dalle istruzioni dell'autore, senza bisogno di ricaricare l'intero documento dal server. Un semplice esempio è lo stile dinamico. Io posso cambiare lo stile di un elemento del documento, ad esempio il colore di un testo, sulla base di un evento generato dell'utente. Per esempio, se l'utente passa con il mouse sulla frase che segue, il colore del testo diventa rosso, quando toglie il mouse diventa di nuovo blu. Provate. Passandomi sopra con il mouse divento rosso. E' possibile ovviamente generare molte diverse azioni sulla base dell'input utente. Nell'esempio seguente il mouse assumerà la forma di dito, e cliccando sul testo si aprirà una semplice finestra di dialogo: Passandomi sopra con il mouse divento rosso, il mouse assume la forma di un dito, e cliccandomi sopra si apre una finestra di dialogo. Questi eventi dovrebbero funzionare sia con Explorer 4 che con Netscape 4, ma molte funzioni avanzate di interattività con l'utente sono supportate solo da Internet Explorer 4 o superiori. 2) IpertestiL'HTML è un linguaggio cosiddetto per ipertesti (almeno è nato come un linguaggio per ipertesti). Cioè contiene delle istruzioni per dire al computer come visualizzare del testo, e come creare dei collegamenti ipertestuali tra una parte del testo e altri documenti HTML. Un testo viene definito ipertesto se consente di navigare tra documenti diversi in maniera immediata. Io scrivo un ipertesto dove cito, ad esempio, la circolare n. 12, e il lettore deve poter andare a leggere il testo della circolare 12 semplicemente cliccando con il mouse sul testo "circolare n. 12", che è rappresentato di solito con un colore diverso dal resto del testo e/o con una sottolineatura. Quando si trova sull'ipertesto il cursore (cursor) del mouse assume solitamente la forma di una mano (hand) con un dito esteso come per premere un pulsante. 3) MarcatoriInfine l'HTML è un linguaggio basato su marcatori. I marcatori non sono altro che delle tacche (tag) o segni di marcatura che appunto marcano o annotano il testo. Ad esempio, se io scrivo:
Se il programma (il browser, come Microsoft Internet Explorer, utilizzato per visualizzare il documento HTML) sa che il testo contenuto dentro i segni <> non va visualizzato, ma contiene delle istruzioni che gli dicono di fare qualcosa, lui ubbidirà, e farà quindi apparire all'utente il testo formattato come richiesto:
Nell'esempio le istruzioni date definiscono uno stile per il testo che condizionano. In pratica dicono al browser come formattare il testo, cioè con quali caratteri farlo apparire all'utente e quando andare a capo (infatti il browser va a capo solo quando è finito lo spazio su una riga, o quando incontra un'istruzione esplicita che gli dice di andare a capo. Inoltre riconosce solo uno spazio fra le parole, e gli spazi supplementari sono ignorati). Quindi il linguaggio HTML è formato da testo. Il testo da visualizzare, e dei marcatori o tag, che danno delle istruzioni, ad esempio su come formattare il testo. In realtà questa non era l'intenzione originaria di chi ha progettato il linguaggio HTML, che invece si proponeva di marcare la struttura del documento, le sue parti logiche. Ad esempio, dovessimo marcare la struttura dell'inizio di un documento simile a questo potremmo avere:
In effetti questo è HTML. L'unica differenza con il vero HTML è che le istruzioni contenute entro i tag sono in inglese e spesso abbreviate e che il fine tag viene espresso con il segno / (barra che punta in alto a destra). Per ottenere il reale codice HTML dell'inizio di questo documento, dovremo sostituire il testo scritto in italiano con:
Dovremo inoltre racchiudere il contenuto della pagina entro il marcatore <BODY> (CORPO) che indica appunto il corpo del documento, mentre il marcatoe <HEAD>, testata, può comprendere le informazioni allegate al documento (titolo, autore, data, ecc), che non compaiono nel corpo del documento. L'intero documento HTML è compreso nel tag <HTML> Ecco il codice HTML reale corrispondente all'esempio precedente:
Provate ad inserire questo codice HTML in un file di testo, usando notepad. Salvatele con l'estensione .htm (ad esempio prova1.htm) e aprite il file con il browser per vedere come viene formattato. Le entità Nel codice appaiono dei simboli che possono sembrare strani ("). Si tratta di speciali codici che definiscono dei caratteri particolari. Abbiamo ad esempio visto che i simboli < (minore di, in inglese less than) e > ("maggiore di". in inglese "greit than"), sono usati per includere le istruzioni dei tag. Se invece vogliamo far apparire come testo il simbolo < oppure il simbolo >, dobbiamo inserire un codice (di solito l'editor HTML, il programma che salva per noi i documenti in formato HTML inserisce automaticamente il codice dove noi scriviamo i simboli). I codici speciali HTML (chiamati "entità"), iniziano con il simbolo & (e commerciale) e finiscono con un punto e virgola. Il simbolo < (less than) sarà scritto come:
lt sono le iniziali di less than e & e ; i caratteri che indicano l'inizio e la fine del codice speciale. Ecco alcuni tra i caratteri speciali più usati:
Anche le vocali accentate, molto usate in italiano, vanno preferibilmente rese con codici, in quanto computer con sistemi operativi diversi da Windows non li vedrebbero in maniera corretta. In ogni caso questo è un lavoro che viene fatto automaticamente dal word processor o dall'editor HTML. Vediamo ora le regole formali per scrivere un documento HTML. Queste regole non sono spesso vincolanti, ed il documento viene di solito visualizzato egualmente anche se non è strettamente conforme (well-formed) alle regole HTML. Vedremo più avanti perché sarebbe importante rispettare le regole formali dell'HTML, e come ciò sarà obbligatorio nel nuovo linguaggio XML (i documenti non "conformi" non saranno visualizzati dal browser, che restituità invece un messaggio di errore). Ecco alcune regole dell'HTML:
Quindi un documento HTML avrà sempre la struttura minima:
</HTML> Tra i vari possibili contenuti dell'HEAD citiamo il TITLE, che è il titolo del documento, che non appare nel corpo dello stesso, ma nella barra del titolo del browser, o viene visualizzato per indicare il documento quando questo, ad esempio, viene indizizzato da un motore di ricerca. Nell'esempio pecedente abbiamo inserito il tag:
Se avete creato il documento html di esempio e, dopo averlo aperto con il browser, guardate nella barra del titolo, potrete leggere "Esempio di documento HTML", prima della scritta Microsoft Internet Explorer. La disposizione spaziale dei vari componenti del documento non è importante. E' lo stesso scrivere:
Oppure:
Nel primo caso, anche se tra Markup e Language esistono molti spazi, il programma ne farà apparire a video sempre uno. Anche se tra Markup e Language vi è una riga di separazione, questa non viene considerata dal browser. La frase che apparirà sarà sempre "HyperText Markup Language".
Con le prime versioni dell'HTML l'autore non era in grado di controllare in maniera precisa la formattazione (l'apparizione a video) del documento. Era il browser che decideva come far apparire un titolo di primo livello, uno di secondo, un tratto di testo ben evidente, ecc. Ecco come appare nel browser il codice HTML visto prima:
Per consentire agli autori di documenti HTML di controllare in maniera sempre più precisa l'aspetto del documento, sono stati introdotti successivamente marcatori che spiegano al browser come formattare il testo (neretto, colore, grandezza, tipo di carattere, ecc.), come allinearlo, come modificarlo. Oggi, con l'HTML 4 e l'utilizzo, dei fogli di stile (CSS, vedi apposito tutorial), è possibile un controllo totale sull'aspetto (formattazione o stile) del documento, sulla posizione e sul comportamento in risposta ad eventi delle sue varie parti.. Se noi volessimo far apparire, ad esempio, delle parti del nostro documento con un colore particolare o in grassetto o in corsivo, dobbiamo, in qualche modo, dirlo al browser. Con la versione dell'HTML precedente alla quattro (la 3.2) si potevano utilizzare dei tag utili a questo scopo. Prendiamo il testo visto all'inizio della lezione:
Carattere in grassetto in inglese è Bold. Infatti possiamo usare il tag <B>per bold, che è esattamente uguale a <Strong>. Vai a capo (non per fine paragrafo, ma senza saltare una riga) si traduce in inglese con Break ed il tag è: <BR>. Questo è un tag vuoto, che non ha un tag di inizio e di fine, come per gli altri, in quanto non contiene nulla al suo interno, ma dice semplicemente al computer di interrompere la riga di testo corrente, e di andare a capo:
Un'altro tag unico è <HR> dalle iniziali di Horizontal Rule (riga orizzontale), che fa apparire una riga orizzontale. Se lo usiamo noi in questa pagina, otteniamo: Nel nuovo linguaggio XML non esistono più i TAG che non hanno un esplicito segno di terminazione, sempre indicato dalla barra \. Per quei tag che non contengono testo al loro interno, sarà possibile inserire il segno di fine prima della chiusura del tag:
A questo punto sarete curiosi di sapere che cos'è questo XML. Lo vedremo presto nei prossimi capitoli. Diciamo subito che ha ed avrà un'importanza fondamentale, e quindi la sua conoscenza dettagliata sarà un requisito essenziale per lo sviluppo di applicazioni e contenuti Internet ed informatici in genere nei prossimi anni. Prima di concludere ricapitoliamo quello che abbiamo visto fino ad ora, introducendo anche qualche concetto nuovo. In queste prime lezioni del tutorial abbiamo visto:
Ma chi decide quali sono i tag validi, ed il loro significato. Se io usassi il tag <Neretto>, invece del tag <B>, per dire al computer che voglio che il testo in esso contenuto sia in neretto (o Bold), il computer non capirebbe. Il computer (il browser) conosce il tag <B> e sa che significa "fai apparire il testo che mi segue, fino al tag di chiusura, in neretto", ma non conosce il tag <neretto> e quindi non farà nessuna azione sul testo in esso contenuto. Chi è che dice al computer quali sono i tag validi e quale significato hanno? Esistono dei linguaggi, di livello superiore all'HTML, in grado di creare linguaggi per marcatori, di definire cioè dei marcatori validi ed il loro significato. L'HTML è definito da un linguaggio che si chiama SGML (Standard Generalized Markup Language), che definisce anche vari altri linguaggi basati sui marcatori ed utilizzati per definire numerosi linguaggi per marcatori specializzati (utilizzati non nel mondo internet). Per creare una "applicazione SGML" (un linguaggio specifico, come l'HTML) è necessario scrivere le regole di questo linguaggio in un file chiamato DTD (Document Type Definition), che spiega quali tag sono validi ed il loro significato. Il DTD di ogni specifica versione di HTML è scritto in SGML. Parlare dell'SGML è fuori dagli scopi di questo corso introduttivo, ma è bene dire che l'SGML si pone sullo stesso piano dell'XML. L'XML, come il SGML, è un linguaggio per marcatori esteso in grado di creare altri linguaggi per marcatori, specificando il significato dei loro tag e attributi. L'XML è molto più semplice e adatto ad Internet rispetto all'SGML, e questo è il motivo della sua creazione e diffusione. Nella prossima lezione ripercorreremo in maniera più organica e strutturata i concetti che abbiamo visto finora.
|
Per informazioni e commenti: asm@asm-settimo.it - Note sul copyright
statistiche accessi al sito (dal 2 luglio 2003)
Statistiche
complessive con il sito Centro di Competenza sul SUAP (dal 5/6/1999)
|
