1° puntata
HTML, il linguaggio del WebScriviamo la nostra prima pagina
|
1° puntataHTML, il linguaggio del WebScriviamo la nostra prima pagina |
| Ritorna all'indice | |
Immaginate di prendere il telefono e di descrivere una pagina del libro o della rivista che state leggendo ad un amico che non può vedervi: la cosa più elementare è descrivere singolarmente e in ordine il contenuto e la forma degli elementi costitutivi della pagina (il titolo, i testi, le immagini e così via).
Per evitare qualsiasi interpretazione dubbia è però necessario stabilire delle convenzioni rigorose, per esempio come distinguere il contenuto del testo dalle informazioni aggiuntive (colore, grandezza, allineamento, ecc.), come descrivere le parti di una tabella e i contenuti delle immagini. |
 |
Tutte le pagine pubblicate in rete (che sia Internet o Intranet non cambia nulla) non sono proiezioni di diapositive o fotocopie, ma sono pagine generate da un programma che in questo caso fa la parte del vostro amico telefonico: è il browser (il celebre "navigatore"), che interpreta i dati ricevuti e in base ad una convenzione stabilita ricostruisce la pagina sul vostro schermo.
In fondo quello che viaggia per la rete è l'unica cosa che un computer può "comprendere": una serie interminabile di bit, le unità di informazione che possono assumere soltanto due valori, familiarmente rappresentati da una sequenza di 0 e 1 (i due "mattoni" del sistema binario).
 |
 |
I browser i più diffusi per la navigazione in Internet sono Netscape Navigator e Internet Explorer, dei quali occorre però conoscere la versione: infatti ogni browser visualizza sullo schermo la pagina Web a seconda delle proprie convenzioni e non è raro che una pagina venga completamente stravolta se visualizzata da un browser diverso o da una versione precedente dello stesso! |
È interessante (e molto democratico...) il fatto che è possibile scrivere pagine pubblicabili in Internet con qualunque programma di videoscrittura che produca file in formato testo. Anche se utilizzare programmi specifici come Dreamweaver o FrontPage diminuisce la fatica e il tempo, oltre a mostrare immediatamente quello che un browser mostrerà a video, è possibile utilizzare persino l'Edit o il BloccoNote, a patto di rispettare la sintassi.
Le pagine del Web sono scritte in un linguaggio detto HTML, acronimo formato delle iniziali delle parole Hyper Text Markup Language. Come dice la sua definizione è un "linguaggio di marcatura per ipertesti", cioè un linguaggio che permette di generare documenti ipertestuali i cui caratteri di marcatura (detti tag) descrivono le parti del documento, la formattazione del testo, la grafica e i collegamenti con gli altri documenti (detti link). Ricordo che gli ipertesti sono documenti in cui l'informazione non è strutturata linearmente e sequenzialmente come in un libro, ma sono costruiti come una rete i cui nodi permettono di "saltare" da una parte all'altra.
Se visualizzate il codice sorgente della pagina che state leggendo (non sapete come fare?), trovate ad inizio pagina il seguente codice:
<html>
<head>
<meta name="AUTHOR" content="Francesco Battistelli - 2001">
<title>Leggere e scrivere pagine Web - 1.0</title>
<link rel="stylesheet" href="../Inclusioni/html.css">
</head>
Questo è codice scritto in linguaggio HTML, e quelli racchiusi dai simboli < e > sono i tag, le etichette di marcatura. Se visualizzate il codice HTML di una pagina qualsiasi scaricata da Internet, mescolati al comune testo troverete una serie di tag: alcuni di essi sono onnipresenti, altri sono così rari o desueti che per capirne il significato è necessario consultare i "sacri testi".
I tag sono comandi per il browser e quasi sempre viaggiano in coppia; il tag di chiusura è distinguibile da quello di apertura per la presenza della barra /.
questo è un tag di apertura: <title>
questo è un tag di chiusura: </title>
La funzione dei tag è quella di specificare al browser come deve considerare quello che si trova compreso tra il tag di apertura e quello di chiusura: sono in tutto e per tutto le informazioni di contorno al puro testo che davate al vostro amico telefonico.
I tag possono essere "nidificati", ovvero posti uno dentro l'altro, a condizione che il più interno sia chiuso prima della fine di quello esterno: ad esempio il codice <head><title>Titolo</head></title> è errato.
Nelle prossime puntate vedremo che mediante i cosiddetti "attributi" del tag è possibile dare al browser una serie di informazioni aggiuntive.
Perché conoscere HTMLQualcuno potrà pensare: perché perdere tempo e fatica quando ci sono tanti programmi facili da usare? Senza conoscere il linguaggio HTML si possono scrivere eccellenti pagine web con Dreamweaver e Front Page, o addirittura con Word o Excel. Il fatto è che se non si conosce come funziona il linguaggio HTML non si può progredire oltre un certo livello e in alcuni casi non si capisce neppure perché la pagina non viene come noi volevamo: il timore di non poter toccare il codice HTML, pena la distruzione della pagina, ci blocca, e quindi non si ha né la possibilità di aggiungere effetti dinamici (ne parleremo a tempo debito), né la capacità di effettuare direttamente aggiunte e correzioni senza dover riutilizzare il programma di origine. Inoltre (e tutti i programmatori lo sanno bene) il plagio nel mondo dell'informatica non è un vizio, ma una virtù: saper copiare bene, ovvero saper comprendere quello che altri hanno scritto, i loro trucchi e le loro intuizioni, è un passo essenziale per crescere in autonomia. Spesso si impara più dalla visione di un codice che da un capitolo intero di un libro, e di pagine da consultare ce ne sono veramente tante! Prima di scrivere la prima pagina, un'importante osservazione: come una lingua parlata, il linguaggio HTML non è una lingua morta, ma si evolve di continuo: dalla sua origine i tag sono più che raddoppiati, ed ogni produttore di browser ne ha proposti di nuovi. Per evitare la confusione il linguaggio standard è stato formalizzato da un consorzio detto W3C (World Wide Web Consortium), che ne detta le specifiche. |
I componenti principali di una pagina sono l'intestazione (HEAD) e il corpo (BODY):
Importante: entrambi questi blocchi devono trovarsi tra il tag <html> e </html>, perché il browser sappia che quello che sta leggendo è una pagina scritta in HTML.
Vediamo come due browser interpretano la semplice pagina sottostante:
<html>
<head>
<title>Titolo della pagina</title>
</head>
<body>
Testo della pagina.
</body>
</html>
| quello che visualizza Internet Explorer (versione 5.0) |
quello che visualizza Netscape Navigator (versione 4.06) |
|---|---|
 |
 |
come potete vedere:
Potete provare a scrivere una semplice pagina con il Blocco note utilizzando i tag che abbiamo visto: salvate il tutto con il nome "pippo.htm" e avete sotto gli occhi la vostra prima pagina Web (se non vi sembra granché, pensate che in fondo è come il primo "dieci cent" di Paperon de' Paperoni!)
La prossima puntata parleremo di come comunicare al browser informazioni sul formato del testo.
| Ritorna ad inizio pagina | testo e grafica di Francesco Battistelli | Ritorna all'indice |