Introduzione ad HTML - Mondadori Informatica

1
Introduzione ad HTML
Introduzione
HTML sta per Hyper Text Markup Language. Non si tratta di
un linguaggio di programmazione per computer, ma di un
linguaggio di marcatura, che racchiude il testo fra istruzioni
speciali, dette tag, in modo che un browser Internet sappia
come visualizzare il testo sullo schermo. I tag sono in pratica
istruzioni per il browser Web. Il seguente tag, per esempio:
<b>Text to display on screen</b>
dice al browser Web di mostrare il testo incluso fra i tag <b>
e </b> in grassetto.
Sono disponibili molti strumenti gratuiti in grado di aiutarti
a scrivere HTML conforme agli standard per le pagine Web.
Alcuni strumenti sono così sofisticati che non hai bisogno
di sapere molto di HTML o CSS, uno fra questi è Adobe
Dreamweaver. I computer Apple includono programmi che
consentono di creare pagine Web con veloci operazioni di clic
e trascinamento. Semplice, facile ed efficace … fino a quando
non diventa necessario deviare rispetto al template, personalizzare la pagina o fare qualcosa che non è inclusa nel gruppo
di comandi dei menu. A quel punto devi conoscere HTML e
CSS. Nonostante questi strumenti siano eccellenti e rendano
semplice e divertente creare pagine Web, puoi crearle a mano
per avere un maggiore controllo sul loro aspetto e comportamento. Ti basta avere a disposizione un editor di testo, un
browser Web per testare i tuoi risultati e un po’ di pazienza.
In questo capitolo
Reperire gli strumenti che
servono: editor di testo e browser
Web
Nozioni di base su HTML:
elementi, tag e attributi
Struttura di base di una pagina
HMTL
Creare il primo documento HTML,
con dichiarazioni, sezione header,
metadati e titolo
Comprendere i commenti HTML
HTML5 è l’ultima versione di HTML e ora include funzionalità
per HTML che, in precedenza, erano disponibili soltanto in
altri linguaggi di marcatura o script. Ha inoltre deprecato,
ovvero avviato la fase di abbandono, di alcune funzionalità
Introduzione ad HTML 1
01 HTML.indd 1
01/02/12 09.21
vecchie. CSS, trattato più avanti nel libro, è molto più efficace
nel controllare l’aspetto di una pagina Web, mentre HTML5 si
concentra sulla struttura della pagina anziché sull’aspetto.
Imparare HTML e CSS ti aiuterà di certo a diventare un bravo
Web designer e/o sviluppatore, ma ci sono molte altre cose
che devi sapere che vanno oltre gli argomenti trattati in questo
libro. I linguaggi di script e di programmazione, le connessioni
di database, il contenuto dinamico e attivo e molti altri argomenti non sono trattati qui. Ciò che imparerai qui ti renderà
competente e sicuro nella manipolazione di HTML e CSS, il che
è un buon punto di partenza.
Se hai già familiarità con la modifica, la visualizzazione e il
salvataggio dei documenti HTML, puoi scorrere velocemente
questo capitolo e passare ad altri argomenti. In caso contrario,
questo capitolo ti aiuterà a prepararti per gli argomenti trattati
nei capitoli successivi. Imparerai come utilizzare gli strumenti
fondamentali di cui hai bisogno, ovvero un browser e un editor
di testo, e altri strumenti che ti aiutino a scrivere i documenti
HTML. Per completare le attività proposte di seguito devi sapere come marcare il testo e come caricare il file in un browser
Web per visualizzare i risultati. Sono disponibili esempi completi che puoi utilizzare per controllare il tuo lavoro e come
aiuto mentre procedi. Come in tutti i libri di questa collana, i
passi che devi svolgere sono indicati chiaramente e numerati,
in modo da aiutarti in ogni fase.
2
01 HTML.indd 2
01/02/12 09.21
!
Importante
Non bisogna confondere gli editor di testo con gli elaboratori di testo e neppure con gli editor di testo avanzati, in
quanto la differenza è fondamentale. Molti elaboratori di
testo moderni sono in grado di creare documenti HTML
dal testo, ma includono molti codici nascosti che possono dare problemi con alcuni browser. Gli editor di testo
avanzati non aggiungono altrettanta formattazione, ma ne
hanno comunque una certa quantità e non sono progettati
per creare documenti HTML. Gli editor di testo non hanno
capacità di formattazione e non aggiungono codice extra
ai documenti creati.
Lo sapevi che...
u
Come è stato detto nell’Introduzione, creare pagine HTML non
richiede molti strumenti. Basta un computer, naturalmente,
un browser Web, come Internet Explorer o Mozilla Firefox,
e un editor di testo, come Blocco note. Bastano questi pochi
elementi per costruire qualsiasi pagina Web che si possa
immaginare. Creeremo anche una cartella di file per inserirvi
i file completati. Per poter svolgere con successo le attività
proposte, assicurati di avere a disposizione queste cose pronte
per creare un documento HTML.
Reperire gli
strumenti che
servono: editor
di testo e
browser Web
Importante
1
!
I numeri di riga che vedi nelle
schermate dei documenti HTML sono una funzione
dell’editor di testo; non devi
digitarli! (vedi la schermata
del passo 4 di questa attività
per un esempio di numeri di
riga).
?
Molti sistemi operativi, come Windows, Linux o Mac
OSX, includono editor di testo propri. È anche possibile
scaricare editor di testo gratuiti che migliorano le loro
funzionalità e possono facilitare la scrittura dei documenti HTML. Per questo libro, ho utilizzato Notepad++,
che è un software gratuito ottimizzato per l’editing del
testo e del codice (puoi scaricare Notepad++ all’indirizzo:
http://notepad-plus-plus.org). La maggior parte delle schermate di editor di testo riportate in questo libro sono di
Notepad++.
Introduzione ad HTML 3
01 HTML.indd 3
01/02/12 09.21
Reperire gli strumenti
che servono: editor di
testo e browser Web
(continua)
Lo sapevi che...
?
I computer includono un
browser Internet già installato. I computer Windows
utilizzano Internet Explorer,
molti computer Linux hanno
installato Mozilla Firefox e
i computer Apple utilizzano
Safari. Qualsiasi browser
Web sarà adeguato per le
attività proposte in questo
libro, ma è necessario che
tu ne scelga uno con cui hai
familiarità. Personalmente
utilizzo OperaTM e Mozilla
Firefox e, occasionalmente,
Internet Explorer o SeaMonkey (un altro prodotto Mozilla). Molte delle schermate
che vedrai in questo libro
sono di OperaTM.
Per tua informazione
i
Esistono editor HTML gratuiti su Internet che possono
aiutarti nella creazione dei documenti HTML. Sono una
specie di elaboratori di testo HTML e sono dotati di
menu, pulsanti di comando e formattazioni specifiche per
la composizione dei documenti HTML. Se scegli di utilizzare un editor HTML, tieni presente che normalmente non
sono programmati o configurati per il codice HTML5, ma
per HTML4 o 4.01 Transitional, che rappresentano le più
recenti versioni di HTML prima di HTML5. I tag HTML5
perciò non saranno disponibili in molti editor HTML.
Per tua informazione
i
Alcune delle schermate riportate in questo libro sono
di Mozilla SeaMonkey. SeaMonkey è un browser Web
dotato di alcuni utili miglioramenti per gli sviluppatori
Web e i Web designer. Dispone di una finestra separata,
chiamata Composer, che è un editor di codice sorgente
HTML. È dotata di pulsanti, menu di comandi e menu a
discesa con gruppi di comandi specifici per la creazione
dei documenti HTML, compresa l’aggiunta automatica di
un Document Type Declaration (DTD, trattato più avanti
in questo capitolo). Come accade con molti altri editor
HTML, tuttavia, il DTD creato dal Composer di SeaMonkey non è un DTD HTML5 e i tag disponibili non sono tag
specifici di HTML5.
4
01 HTML.indd 4
01/02/12 09.21
Per risparmiare tempo
Il tuo computer è probabilmente configurato in modo da
aprire i documenti HTML con il browser Web predefinito.
È sufficiente fare doppio clic su qualsiasi file con l’estensione .html o .htm per aprire il file nel browser Web specificato come predefinito.
Reperire gli strumenti
che servono: editor di
testo e browser Web
(continua)
1
1 Decidi quale editor di testo uti-
lizzare. Molti computer includono editor di testo predefiniti; in Windows, per esempio,
l’editor di testo predefinito è
Blocco note. L’editor di testo è
anche chiamato editor HTML.
2
2 Crea una cartella in cui salvare
i file HTML che completerai
con ogni attività. Io di solito
creo la cartella sul desktop
per comodità, ma puoi crearla
dove preferisci.
3 Identifica il browser che desi-
Assicurati che il tipo di file selezionato sia HTML quando salvi un file
HTML in un editor di testo.
deri utilizzare per visualizzare
le pagine Internet. Probabilmente avrai più familiarità con
il browser predefinito del tuo
computer. Purché tu sappia
come aprire e visualizzare i file
nel browser Web che scegli,
qualsiasi browser andrà bene.
Introduzione ad HTML 5
01 HTML.indd 5
01/02/12 09.21
Reperire gli strumenti
che servono: editor di
testo e browser Web
(continua)
5
4
4 Apri l’editor di testo che
utilizzerai per le attività proposte nel libro e digita le
informazioni mostrate nella
schermata. Questo è il Document Type Declaration, anche
detto dichiarazione DOCTYPE
o DTD. Per un documento
HTML, sono inclusi anche i
tag html, head e body, che
sono tutti tag obbligatori. I tag
e la struttura dell’HTML saranno trattati più avanti in questo
capitolo.
6
5 Salva il nuovo documento con
il nome html_template.htm.
Questo template sarà utilizzato
per molte delle attività proposte nei capitoli successivi.
6 Apri il file del template nella
finestra del browser. Dovresti
vedere una schermata vuota
con il titolo My First HTML
Document sulla barra del titolo nella parte superiore dello
schermo.
6
01 HTML.indd 6
01/02/12 09.21
Per tua informazione
World Wide Web Consortium, o W3C, è l’ente che governa gli standard Internet a livello mondiale. Nonostante
non abbia alcuna autorità legale, offre una piattaforma
globale di conformità agli standard per le aziende che
producono software e linguaggi per Internet. Fra i suoi
membri figurano aziende come Microsoft, Apple, IBM,
Hewlett-Packard e altre. W3C riunisce queste grandi
aziende per la negoziazione degli accordi su modifiche e
inclusioni raccomandate per linguaggi e tecnologie specifiche di Internet, come HTML, CSS e i browser Web.
Detiene gli standard compilati, le revisioni raccomandate
e lo stato corrente generale di molte tecnologie Web.
Visita il suo sito Web (www.w3.org) per informazioni
sulle ultime modifiche di HTML e CSS.
i
Reperire gli
strumenti che
servono: editor di
testo e browser Web
(continua)
1
7 Individua risorse online
aggiuntive e impostale come
segnalibri. Comincia impostando come segnalibro il
sito Web di World Wide Web
Consortium (www.w3.org). Poi
imposta come segnalibro il
sito Web di W3Schools (http://
w3schools.org) e il sito Web
di Web Design Group (WDG,
http://htmlhelp.com).
8 Scarica le guide di riferimen-
to rapide, disponibili presso
Veign (in inglese, all’indirizzo
www.veign.com/reference/index.
php), sia per HTML5 sia per
CSS3.
Introduzione ad HTML 7
01 HTML.indd 7
01/02/12 09.21
Nozioni di
base su HTML:
elementi, tag e
attributi
u
HTML è un linguaggio di marcatura composto di varie parti:
queste parti sono i tag, gli elementi e gli attributi.
I tag HTML sono istruzioni per i browser sul contenuto di un
elemento. Ecco per esempio un elemento HTML che dice al
browser di visualizzare il testo fra i tag come un paragrafo:
<p>Text content of the element</p>
Lo sapevi che...
?
HTML5 non richiede le virgolette singole o doppie intorno ai valori degli attributi. I
vecchi linguaggi di marcatura, invece, le richiedono,
perciò è buona prassi utilizzarle nella marcatura dei
documenti HTML.
I tag sono composti di parentesi angolari con istruzioni di marcatura fra esse. Nell’esempio sopra, la lettera ‘p’ racchiusa fra
parentesi angolari è il tag paragraph (paragrafo). Il primo tag è
quello iniziale e dice al browser di visualizzare tutto il testo che
segue come un paragrafo. Il tag con ‘/p’ fra parentesi angolari
è il tag finale. Dice al browser che è stata raggiunta la fine del
paragrafo. La barra (/) significa “fine” nei tag HTML.
Gli elementi HTML sono composti da un tag iniziale, il contenuto e un tag finale. Cose come heading (titolo), paragraph
(paragrafo) e table (tabella) sono elementi.
Tag iniziale
Per tua informazione
Tag HTML ed elemento
HTML sono due termini con
significati distinti che però
possono essere considerati
sinonimi nell’utilizzo comune. Molti Web designer e
sviluppatori non fanno più
distinzione fra tag ed elementi, e anche in questo libero
i due termini sono utilizzati
come sinonimi.
i
Contenuto
Tag finale
Gli attributi sono proprietà specifiche di un tag che ne definiscono comportamento o aspetto; molti attributi dei tag HTML
possono essere modificati per cambiare la visualizzazione.
Gli attributi sono elencati solo nei tag iniziali. Per assicurare
la compatibilità con le vecchie versioni di HTML o XHTML,
il valore dell’attributo è posto fra virgolette singole o doppie,
come segue:
<img src=“http://somelinktoapicture.
com/”></img>
Il tag image (immagine), <img>, nell’esempio sopra ha l’attributo richiesto src, ovvero source (origine), che specifica la
posizione dell’immagine che deve essere visualizzata.
8
01 HTML.indd 8
01/02/12 09.21
u
I documenti HTML hanno una struttura di base universale,
indipendentemente dal fatto che la pagina Web abbia un
aspetto semplice o complesso sullo schermo. Questa struttura è creata da alcuni elementi fondamentali comuni a tutti
i documenti HTML. Tali elementi fondamentali includono il
Document Type Declaration (DTD), l’elemento html, l’elemento
head e l’elemento body, tutte cose che abbiamo messo nel
nostro template HTML nell’attività precedente.
Struttura di base
di un documento
HTML
1
La struttura di base del documento non ha nulla a che fare con
il contenuto della pagina, perciò non lasciarti confondere. Il
contenuto è ciò che vediamo sulla pagina, ma non ha nulla a
che fare con la struttura di base di un documento HTML. La
composizione di un documento HTML è in parte visibile e in
parte invisibile al visitatore che guarda una pagina Web.
Tutti i documenti HTML hanno due sezioni principali: header e
body. Tutto il contenuto della pagina, ovvero ciò che si vede e
con cui si interagisce, si trova nel body. La sezione header contiene dati che non sono visibili, ovvero contenuto che l’utente o
il visitatore in effetti non vede.
La prima riga di ogni documento HTML, indipendentemente
da cos’altro sia incluso, deve essere il Document Type Declaration, anche chiamato dichiarazione DOCTYPE o DTD. Nelle
prime versioni di HTML, molte modifiche e ritocchi degli standard di HTML comportavano la necessità di DTD complessi e
difficili. Con HTML5, il DTD è semplicissimo; deve essere così:
<!DOCTYPE html>
Questo DTD funziona anche con le versioni precedenti di
HTML che si potrebbero incontrare sulle pagine Web. Il DTD
dice al browser di aspettarsi un documento HTML anziché un
altro linguaggio di marcatura o altri tipi di documento. A causa
della funzione del DTD, non deve esserci spazio vuoto, ovvero
righe vuote, prima del DTD. Questo è fondamentale perché, se
il browser incontra una riga vuota prima del DTD, si comporterà come se non ci fosse alcun DTD e i risultati potrebbero
essere imprevedibili.
Introduzione ad HTML 9
01 HTML.indd 9
01/02/12 09.21
Struttura di base
di un documento
HTML (continua)
Dopo il DTD viene l’elemento html, che presenta un tag iniziale
e un tag finale, come segue:
<html></html>
Tutti gli altri elementi del file HTML saranno contenuti in tale
elemento, il quale dice al browser che il documento HTML è
questo.
Importante
Assicurati che non ci siano
righe vuote nel file HTML
prima del DTD! È fondamentale! La pagina Web
potrebbe non comportarsi
nel modo atteso se il browser incontra una riga vuota
prima del DTD.
Per risparmiare
tempo
Ctrl+U apre il codice sorgente della pagina sia in Mozilla
Firefox sia in OperaTM.
!
La parte successiva della sezione header è l’elemento head,
contenuto nell’elemento html. Anche questo elemento ha un
tag iniziale e uno finale:
<head></head>
La sezione head contiene informazioni sul documento stesso,
come il suo titolo (che comparirà nella barra del titolo della
finestra del browser), i metadati e gli stili o gli script utilizzati
nel documento.
Poi c’è la sezione body. Questo è il contenuto visibile e interattivo del documento. Tutto ciò che è possibile vedere su
una pagina Web va in questa sezione del documento. Tutto il
contenuto e la sua formattazione vanno nella sezione body del
documento.
Per tua informazione
i
L’elemento html non è obbligatorio in HTML5. In effetti,
anche gli elementi head e body sono opzionali. È buona
prassi utilizzarli per la chiarezza del codice e per l’accuratezza degli standard, ma non sono elementi richiesti per
una pagina HTML5.
10
01 HTML.indd 10
01/02/12 09.21
Per tua informazione
La parte restante del body del file HTML o pagina Web
è contenuta nell’elemento html. Per trovare il tag finale
può essere necessario scorrere la schermata varie volte
verso il basso e potrebbero essere presenti molti altri tipi
di elementi nella pagina Web, come per esempio script
ed elementi di programmazione, che tuttavia esulano
dallo scopo di questo libro.
Struttura di base
di un documento
HTML (continua)
i
1 Apri il browser Web e accedi
al tuo sito Web preferito.
2 Visualizza il codice sorgente
Per risparmiare tempo
Utilizza la funzione Cerca o Trova del browser per individuare i tag mentre li cerchi, se il browser te lo consente.
In questo modo velocizzerai la ricerca dei vari elementi.
1
3
4
5
6
della pagina con la funzione di
visualizzazione del codice sorgente disponibile nel browser.
In Mozilla Firefox, seleziona
Visualizza, Origine pagina; in
OperaTM, seleziona Visualizza,
Origine; in Internet Explorer,
seleziona Visualizza, Origine.
Identifica il DTD. Se è utilizzato un DTD, sarà la prima riga
del documento.
Quindi, individua l’elemento
html del documento. Si troverà da qualche parte dopo il
DTD. Inizialmente cerca solo il
tag di apertura, in quanto il tag
di chiusura si troverà alla fine
del documento.
Cerca gli elementi <head>,
<title> e <body> della
pagina. Su un sito Web professionale completo, ci saranno di
certo molti altri elementi sulla
pagina.
Ora individua l’elemento
<body> sulla pagina Web.
All’interno dell’elemento
<body> ci saranno tutte le
parti visibili della pagina Web.
Non sorprenderti se il tag
<body> si trova molto in
basso nel documento HTML.
Introduzione ad HTML 11
01 HTML.indd 11
01/02/12 09.21
Creare il primo
documento
HTML, con
dichiarazioni,
sezione header,
metadati e titolo
u
1 Apri il tuo template HTML,
Nell’ultima attività, hai esaminato una pagina Web (o forse
più di una, a seconda di ciò che hai scelto) e hai decifrato le
principali sezioni di un documento HTML, ovvero <header>
e <body>.
In questa attività, creerai il tuo primo documento HTML. Tecnicamente, lo hai già fatto in precedenza creando il template
HTML, ma qui aggiungerai contenuto alla pagina Web e lo
visualizzerai nel browser. Aggiungerai anche un titolo alla
sezione titolo del file HTML e contenuto alla sezione e all’elemento body.
quello che abbiamo creato in
precedenza in questo capitolo.
Importante
2 Salva il template con un altro
nome.
3 Fai clic per posizionare il cur-
sore fra i tag <title> e </
title>. In seguito indicheremo questa operazione con
l’espressione “posizionare il
cursore nell’elemento title”.
4 Nota che l’elemento
<title> è contenuto
nell’elemento <head>, ovvero fra i tag <head> e
</head>.
5 Assegna un titolo alla nuova
pagina Web, scegliendo un
titolo significativo. Un titolo
come “La mia prima pagina
Web” non è altrettanto significativo di “Prima pagina Web
di Josh Hill”. Io utilizzerò il
titolo “Josh Hill’s first sample
web page”.
!
Assicurati di scegliere come nuovo nome per il file qualcosa di significativo per te. Per esempio, un nome come
“task1.html” sarà meno indicativo di “chapter1webpage.
html”, specialmente fra un po’ di tempo.
Tabella 1.1 I tag utilizzati in questa attività
Tag
Funzione
<!DOCTYPE…/>
Specifica la dichiarazione del tipo di
documento.
<html></html>
Specifica la porzione del documento
riguardante la marcatura HTML.
<head></head>
Specifica la sezione o l’elemento
header del documento HTML.
<title></title> Specifica il titolo del documento
HTML.
<body></body>
Specifica la sezione o l’elemento
riguardante il contenuto del
documento HTML.
I risultati di questa attività sono immediati. Aggiungerai un
titolo all’elemento <title> che sarà visualizzato sulla barra
del titolo del browser Web. Aggiungerai anche contenuto
all’elemento <body> che sarà visualizzato nella finestra del
browser.
12
01 HTML.indd 12
01/02/12 09.21
Per tua informazione
i
Il contenuto dell’elemento <title> è ciò che apparirà
sulla barra del titolo nel browser quando la pagina Web
sarà caricata.
Creare il primo
documento HTML,
con dichiarazioni,
sezione header,
metadati e titolo
(continua)
1
6 Posiziona il cursore nell’ele-
mento <body>, ovvero fra i
tag <body> e </body>.
7 Nota che l’elemento <body>
8
viene dopo il tag </head>,
ovvero dopo l’elemento
<head>.
8 Digita “Hello World!” nell’ele-
mento <body>, quindi salva
e chiudi il documento HTML
della pagina Web di esempio.
9 Apri la pagina HTML di
9
esempio nel browser Web.
Dovresti vedere il contenuto
che hai aggiunto nell’elemento
<body> nella parte principale
dello schermo e il titolo che
hai aggiunto sulla barra del
titolo della pagina Web.
Per tua informazione
i
Se utilizzi un browser a schede (come la maggior parte
dei browser oggi), noterai che il titolo che hai inserito
nell’elemento <title> del documento HTML di
esempio appare anche come titolo della scheda su cui
la pagina viene aperta.
Introduzione ad HTML 13
01 HTML.indd 13
01/02/12 09.21
Commenti HTML
u
I commenti sono utilizzati in HTML, come in molti altri linguaggi
informatici, per annotare il codice di marcatura. I commenti
HTML sono ignorati dai browser Web e non vengono visualizzati. La prassi generale è perciò quella di inserire in essi elementi
che non si intende visualizzare. I browser possono tuttavia
agire sul codice dei commenti senza mostrarlo, e ciò rende i
commenti utili per le annotazioni del codice, per nascondere gli
script e gli elementi di stilizzazione ai browser vecchi che non li
comprendono e altrimenti li mostrerebbero come normale testo,
e altre cose che non si intende visualizzare sullo schermo. In
questo modo, gli script sono eseguiti e gli elementi di stilizzazione sono applicati, tuttavia il codice è nascosto alla vista.
Un commento HTML presenta una parentesi angolare aperta,
esattamente come gli altri tag, seguita da un punto esclamativo. Il punto esclamativo è poi seguito da due trattini. Quindi
si aggiunge il testo di commento, i dati di script, il codice di
stilizzazione o le annotazioni di qualsiasi tipo. Il testo del commento è seguito da un’altra coppia di trattini e dalla parentesi
angolare chiusa, come segue:
<!-- This is an HTML comment -->
Non esiste alcun limite al numero di righe che è possibile inserire in un commento HTML, perciò puoi inserirvi molti script e
molte informazioni di stilizzazione e annotazione.
Questa attività è molto semplice. Creerai un commento HTML
nell’elemento <body> della pagina di esempio e aprirai la
pagina nel browser per verificare che il commento non è visualizzato sullo schermo.
Per tua informazione
i
Molte pagine Web includono codice CSS (Cascading
Style Sheet) nell’intestazione di un documento HTML
per impedire che sia visualizzata. I browser vecchi riconoscono l’elemento <head> come informazioni da non
visualizzare e non lo mostrano. All’interno dell’elemento
<head> del documento HTML sono inseriti anche molti
script, prima dell’elemento <title>.
14
01 HTML.indd 14
01/02/12 09.21
Commenti HTML
(continua)
3
1
4
2
5
1 Nell’editor di testo, apri la
pagina Web di esempio che
hai creato nell’ultima attività.
2 Nell’elemento <body>, fai
clic su una riga vuota e crea
altre righe vuote premendo
Invio due o tre volte.
3 Nel centro dello spazio bianco,
digita l’indicatore di apertura
commento <!--.
4 Digita alcune note fino a riem-
pire alcune righe di testo. In
alternativa, scrivi una frase e
copiala più volte.
5 Alla fine del commento, digita
l’indicatore di chiusura commento -->.
6 Salva la pagina Web di esem-
pio e aprila nel browser Web.
Nota che nessuna parte del testo del
commento è visibile sulla pagina Web.
Importante
!
Gli indicatori di apertura e chiusura dei commenti non
sono chiamati tag, nonostante somiglino ai tag veri e
propri. Puoi assimilarli ai tag in quanto sono richiesti un
indicatore di apertura e uno di chiusura.
Introduzione ad HTML 15
01 HTML.indd 15
01/02/12 09.21
Commenti HTML
(continua)
i
Per tua informazione
I tuoi commenti sono visibili ai lettori tramite la funzione
di visualizzazione del codice sorgente del loro browser
Web. Molti sviluppatori e programmatori Web utilizzano
queste informazioni quando lavorano con le pagine Web
progettate o programmate da altri. Perciò, utilizzare la
funzione commenti può essere molto proficuo!
Lo sapevi che...
?
Uno dei tag non trattati in questo capitolo, ma molto
usati nel Web design e nello sviluppo professionale, è
il tag meta (<meta></meta>). Il tag meta contiene
metadati, che sono dati riguardanti la pagina Web. È possibile inserire nei tag meta cose come la lingua, il set di
caratteri da usare e molti tag e parole chiave per la SEO
(search engine optimisation, ottimizzazione per i motori
di ricerca). I tag meta sono contenuti nell’elemento
<header>, perciò non sono visibili ai visitatori della
pagina Web senza utilizzare la funzione di visualizzazione
del codice sorgente del browser.
Glossario
Metadati. Informazioni, o dati, riguardanti i dati. Si tratta
di informazioni riguardanti una pagina Web e non su una
pagina Web. Per esempio un catalogo libreria è metadati
perché descrive pubblicazioni.
Estensione. La parte di tre caratteri di un nome di file che
segue il punto: per esempio “nomefile.est”.
Codice. In questo libro, significa linguaggio di programmazione, script o marcatura, come JavaScript, HTML o
CSS (Cascading Style Sheet).
16
01 HTML.indd 16
01/02/12 09.21