HTML/Intestazione
In questo modulo tratteremo i tag utilizzabili all'interno dei tag <head> </head>, che servono per definire importanti proprietà del documento.
Il titolo della pagina
[modifica | modifica sorgente]Per far sì che venga visualizzato un titolo del documento nella barra del titolo del browser è sufficiente inserire all'interno dell'intestazione il tag <title>seguito dal titolo della pagina e successivamente dal tag di chiusura </title>.
Ecco un esempio:
<html>
<head>
'''<title>Inserire qui il titolo della pagina</title>'''
</head>
<body>
codice
</body>
</html>
I meta tag
[modifica | modifica sorgente]I meta tag sono dei tag speciali che posti nell'intestazione permettono di definire proprietà del documento in modo, ad esempio, da rendere l'indicizzazione da parte dei motori di ricerca più rapida ed efficace. I meta tag non producono alcun tipo di effetto grafico nella visualizzazione della pagina. Essi sono costituiti da due attributi:
- nome del meta tag
- valore del meta tag
Ecco quindi la loro sintassi generale: <meta
name="nome_meta_tag" content="valore_del_meta_tag">
.
Ecco una tabella riassuntiva dei meta tag utilizzabili:
| Nome | Valore | Funzione |
|---|---|---|
| DC.Title | Titolo del documento | Serve a definire il titolo del documento |
| description | Descrizione del sito | Serve per descrivere il contenuto del sito o della pagina |
| creation_date | Data --> 13/07/2006 | Indica la data di creazione della pagina o quando essa verrà aggiornata |
| keywords | Ogni parola chiave separata da ; --> Wikibooks; Wiki; | Serve a dichiarare le parole chiave del sito o della pagina |
| robots | Vedi in fondo alla tabella | Serve a dare indicazione ai motori di ricerca per l'indicizzazione |
| revisit-after | n° di giorni seguito da days --> 15 days | Serve a dire al motore di ricerca dopo quanti giorni dovrà rivisitare la pagina |
| generator | L'editor usato per scrivere il codice --> Amaya | Indica il nome dell'editor che si è usato per scrivere il codice della pagina |
| copyright | Il proprietario del contenuto del sito --> Wikimedia foundation | Indica a chi spetta il copyright del contenuto del sito |
| author | L'autore della pagina --> Wikibooksiani | Indica l'autore della pagina ed eventualmente il suo indirizzo e-mail |
| owner | Proprietario del sito --> Wikimedia foundation | Indica il proprietario del sito |
| language | Una o più lingue --> it, eng | Indica la lingua o le lingue del sito |
| DC.Language | Una o più lingue --> it, eng | Indica al motore di ricerca di indicizzare le pagine in base alla lingua |
Il meta tag robots come si è detto in precedenza serve a dare alcune indicazioni ai programmi dei motori di ricerca (i cosiddetti spider); più nello specifico, serve a comunicare allo spider del motore di ricerca come si deve comportare durante l'indicizzazione di una pagina. I suoi possibili valori sono:
- none: non viene indicizzata la pagina e tutto ciò che è al suo interno
- index: indicizza solo la pagina che il motore di ricerca sta visitando
- noindex: non indicizza la pagina che il motore di ricerca sta visitando
- follow: non indicizza la pagina che sta visitando prosegue attraverso i link della pagina
- nofollow: indicizza la pagina che sta visitando ma salta i link della pagina
- all: è l'insieme tra follow e index, indicizza la pagina che sta visitando e prosegue attraverso i links.
Ci sono altri meta tag un po' particolari detti HTTP-EQUIV meta tag perché il server web nella sua risposta HTTP al browser conterrà questi meta tag nella parte iniziale, il cui nome è HTTP header block. La loro sintassi, in linea generale, è la seguente: <meta http-equiv="nome_meta_tag" content="valore_del_meta_tag">.
| Nome Tag | Valore | Funzione |
|---|---|---|
| expires | Ora nel formato GMT --> Tue, 13 Jul 2006 10:30:00 GMT | Indica la data di scadenza della validità della pagina. |
| reply-to | Indirizzo mail --> wiki@wikibooks.it | Definisce un indirizzo e-mail a cui gli utenti possono fare riferimento |
| Set-Cookie | Vedi in fondo alla tabella | Salva un cookie sul computer del visitatore |
| refresh | Vedi in fondo alla tabella | Serve per ricaricare la pagina dopo un determinato tempo |
| content-Type | Vedi in fondo alla tabella | Indica il set di caratteri in uso nella pagina |
| Pragma | no-cache, costringe il browser a svuotare la cache e ricaricarla | Solo per NetScape. Forza il browser a non leggere il sito della cache |
| imagetoolbar | yes abilita la visualizzazione della toolbar, no la disabilita | Da IE 6.0 in su, abilita/disabilita la toolbar che appare sulle immagini. |
| distribution | global se è un contenuto di interesse generale, in caso contrario, usare local | Indica se il contenuto della pagina è di interesse generale o specifico |
Il meta tag Set-Cookie serve, come suggerisce il suo nome, a salvare un cookie sul computer di chi sta visitando la pagina. La sua sintassi è la seguente:
<meta http-equiv="Set-Cookie"
content="cookievalue=nome cookie;
expires=data di scadenza;
path=percorso nella cache">
- cookievalue: attraverso questo parametro impostiamo il nome che prenderà il cookie sul computer dell'utente.
- expires: impostando una data in formato GMT si può determinare la data dopo la quale il cookie non avrà più effetto.
- path: dove verrà salvato all'interno della cache
Esempio di settaggio di un cookie:
<head>
<meta http-equiv="Set-Cookie"
content="cookievalue=xxx;
expires=Tuesday, 13-Jul-06 23:00:00 GMT;
path=/">
</head>
Il meta tag refresh ricarica il contenuto della pagina dopo un determinato intervallo di tempo, si può aggiungere anche un parametro mediante il quale il ricaricamento porterà ad un'altra pagina (reindirizzamento). La sua sintassi è: <meta http-equiv="REFRESH" content="intervallo di tempo per ricaricare; url=pagina a cui porterà il ricaricamente, opzionale">
Esempio di reindirizzamento:
<meta http-equiv="refresh" content="4; url=http://it.wikibooks.org">
Il meta tag content-Type serve per dichiarare il set di caratteri usati all'interno della pagina. La sua sintassi è la seguente: <meta http-equiv="content-Type" content="tipo di documento; charset=set di caratteri">.
Il tipo di documento nel nostro caso è text/html con l'avvento dell'xml potrebbe esserci qualche nuovo valore.
Esempio di come utilizzare il meta tag content-Type:
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1">
Il DocType
[modifica | modifica sorgente]Approfondimento
Consigliamo tuttavia caldamente l'uso di questo tag, perché così facendo la pagina sarà in armonia con gli standard minimi di validità
La prima riga di ogni pagina web (quindi ancora prima di qualsiasi tag, nel caso dell'HTML prima del tag <html>), che tenga conto delle specifiche, è il DocType. Questa riga fornisce al browser tutte le informazioni per capire le caratteristiche della pagina che interpreterà. Il DocType, nella sua forma più estesa, ha bisogno di diverse informazioni:
- una dichiarazione in cui si determina se il documento è di dominio pubblico o meno;
- una nota che veicoli a quali specifiche del W3C si sta facendo riferimento;
- la lingua del documento.
La maggior parte delle pagine web, attualmente, utilizza questo DocType:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//IT" http://www.w3.org/TR/html4/loose.dtd>
Il linguaggio usato all'interno della pagina è l'html, il documento è di dominio pubblico e rispetta le specifiche del W3C del tipo HTML Transitional definiti nel DTD (Document Type Definition) loose.dtd, la lingua impostata è l'italiano.
È ora di approfondire a quali specifiche del W3C si può fare riferimento:
- Frameset: questa DTD è utilizzata dai siti che al loro interno contengono i frames.
- Strict: è una DTD che applica rigide regole ed applica quindi i nuovissimi standard del web. Ad esempio i tag deprecati non sono ammessi e gli elementi grafici di una pagina web devono essere definiti tramite i fogli di stile.
- Transitional: come è facilmente intuibile dal nome questo è documento che contiene delle specifiche di transizione da uno standard all'altro, è il tipo maggiormente utilizzato ora sul web. Il documento non applica rigide regole ed è quindi possibile utilizzare tag deprecati.
Esempio di DocType per un sito con i frames:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" http://www.w3.org/TR/html4/frameset.dtd>
Esempio di DocType per un sito che applica rigidamente le ultime direttive del W3C:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" http://www.w3.org/TR/html4/strict.dtd>
Possiamo ora passare ad analizzare i tag più semplici per la formattazione del testo.