L'ultimo articolo scritto su Sir Bit risale a marzo 2014. La versione che state visitando è un archivio: le pagine sono accessibili come sempre e gli autori potrebbero rispondere ai commenti, ma non saranno inseriti dei nuovi articoli. Visita questa pagina per i dettagli.

HTML – I meta tag: descrizione, uso e lista dei principali

I meta tag sono delle informazioni che servono a descrivere i dati contenuti in una pagina html. Non c’è programmatore che non li conosca, perché sono essenziali a fornire ai motori di ricerca e agli utenti che aprono la pagina alcuni dettagli altrimenti difficili da capire.

Il loro scopo non è di stabilire il layout della pagina: all’utente che apre la pagina del sito, queste informazioni rimangono nascoste (saranno visibili soltanto quando si osserva il codice sorgente).

Struttura di base

La struttura di un meta tag è molto semplice ed è formato in genere dall’attributo name (che identifica il nome del meta tag) e dall’attributo content (il valore del meta tag). Per esempio:

<meta name="description" content="Questa è una descrizione" />

Il valore di name non è arbitrario: esiste una determinata “lista” riconosciuta, di cui si avvolgono generalmente i motori di ricerca per reperire informazioni utili. La vedremo tra poco.

Un altro tipo di attributo usato nei meta tag è http-equiv. Il loro scopo è più specifico: si occupano di inviare al browser gli header http (ovvero quei pacchetti che contengono informazioni necessarie per il funzionamento della rete). Anche in questo caso il loro valore rientra in una certa lista e il content deve essere compilato a seconda dell’attributo usato. Il meta tag seguente, per esempio, indica al browser che la pagina deve essere vista con la codifica di tipo utf-8:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Vediamo allora la lista dei meta tag principali, a partire da quelli con attributo name. Ve li propongo non in ordine alfabetico, ma in base a una mia stima personale sull’importanza o la frequenza di utilizzo. I metatag che non dovrebbero mai mancare sono, naturalmente, quelli della descrizione e delle parole chiave, ma anche la codifica charset dove occorre.
Sotto a ognuno inserirò un esempio per chiarire.

I meta tag principali

Description
<meta name=”description” content=”Questa è una descrizione” />
Serve per definire un riassunto della pagina. In genere i motori di ricerca leggono soltanto fino a 160 caratteri (il resto lo troncano). Una nota: questo meta tag viene preso sempre meno in considerazione dai motori di ricerca, ma è utile definirlo perché gli utenti e diversi siti tendono a estrapolare il riassunto delle pagine da questo meta tag.

Keywords
<meta name=”keywords” content=”sito web, software, sir bit” />
Definisce le parole chiavi della pagina. E’ necessario separare ogni parola chiave dalla successiva con una virgola.

Robots
<meta name=”robots” content=”index, nofollow” />
Uno dei meta tag più particolari e più utili. Indica il comportamento che i robots (ovvero gli algoritmi dei motori di ricerca) devono tenere quando incontrano la nostra pagina. L’attributo content può contenere uno o più valori (separati da virgole) tra questi:
index: i robots possono indicizzare questa pagina nella ricerca. Il suo opposto è noindex.
follow: i robots possono seguire i link contenuti nella pagina, cioè esplorare le pagine linkata. Il suo opposto è nofollow.
all: il parametro di default. Equivale a introdurre i due valori “index, follow”.
none: i robots ignorano la pagina. Equivale a introdurre i due valori “noindex, nofollow”.

Robots per Google
<meta name=”googlebot” content=”noarchive” />
Esiste un attributo specifico per i robots del solo Google, che può contenere questi valori:
noarchive: indica che la pagina non deve essere inserita tra i suoi archivi.
nosnippet: ignora gli snippet (frammenti o esempi di codice) nella ricerca.


Author
<meta name=”author” content=”Manuel Marangoni” />
Definisce l’autore che ha creato il sito.

Copyright
<meta name=”copyright” content=”&copy; 2011 Sir Bit” />
Indica l’anno e l’attribuzione del copyright del sito.

Content-type
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
Indica che nella pagina sono contenuti dei caratteri rientranti nell’UTF-8.

Content-language
<meta http-equiv=”Content-Language” content=”it-IT” />
Dichiara la lingua principale in cui è scritta la pagina.

Refresh
<meta http-equiv=”refresh” content=”5;URL=https://www.manuelmarangoni.it/onemind” />
Indica che la pagina deve essere reindirizzata all’url specificato, dopo un tempo di 5 secondi. Con l’uso dei linguaggi lato server, spesso si preferisce utilizzare altre sintassi per il reindirizzamento.

Expires
<meta http-equiv=”expires” content=”Mon, 6 May 2013 08:12:00 GMT” />
Allo scadere della data specificata la pagina risulta scaduta. Questo significa che i motori di ricerca sono autorizzati a scartarla dall’indicizzazione.
Se si specifica una data illegale, la pagina viene interpretata come già scaduta. I valori possibile sono contenuti in queste tipologie:
giorno settimana: Mon, Tue, Wed, Thu, Fri, Sat, Sun
data: giorno mese anno (quest’ultimo da quattro cifre; esempio: 02 Jul 1990)
ora: ore:minuti:secondi (da 00:00:00 a 23:59:59)
mese: Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec

Pragma
<meta http-equiv=”pragma” content=”no-cache” />
La cache della pagina non deve essere considerata, pertanto si utilizza sempre il contenuto della pagina risiedente sul server.

Etichette
Etichette:

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.