HTML permette di specificare dei campi metadata (ossia delle importanti informazioni riguardo il documento) in diversi modi. Gli elementi META possono essere usati per includere coppie di nomi/valori che descrivono le proprietà del documento HTML, come l' autore, la data di scadenza, delle parole chiave, ecc.
Il tag <meta> viene usato per fornire informazioni aggiuntive. Questo tag è un elemento vuoto, perciò non avrà un tag di chiusura, ma trasporta le informazioni attraverso i suoi attributi.
Si possono includere diversi tag meta all' interno del documento, in base a quale informazioni si vogliono conservare nel documento ma in generale, i tag meta non hanno un impatto visivo nel documento, perciò dal punto di vista grafico, cambia poco se vengono inclusi o meno.
Si possono inserire tag meta nell' header di un documento utilizzando il tag <meta>. In aggiunta agli attributi principali, un tag meta può avere i seguenti attributi aggiuntivi:
Attributo | Descrizione |
---|---|
Name | Il nome della proprietà Can be anything. Examples include, keywords, description, author, revised, generator etc. |
content | Indica il valore |
scheme | Definisce uno schema per interpretare le proprietà dei valori(come dichiarato nell' attributo content). |
http-equiv | Usato per un messaggio di intestazione http.Per esempio http-equiv può essere usato per aggiornare la pagina o impostare un cookie. I valori possono essere content-type, expires, refresh e set-cookie. |
Si possono utilizzare i tag <meta> per specificare le parole chiave più importanti del documento, in modo che i motori di ricerca possano indicizzare al meglio la pagina web.
A seguire un esempio dove viene aggiunto un Meta Tag per definire le parole chiave del documento.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Produrrà il seguente risultato:
Hello HTML5!
Si può usare un tag <meta> per dare una breve descrizione della pagina. Viene utilizzato dai motori di ricerca per indicizzare la pagina in base al tipo di ricerca effettuato.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Si può utilizzare un tag <meta> per dare informazioni riguardo l'ultimo aggiornamento della pagina.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="revised" content="Howcodex, 3/7/2014" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
È possibile indicare la durata dopo la quale la pagina verrà refreshata automaticamente.
A seguire un esempio per aggiornare la pagina automaticamente ogni 5 secondi.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="revised" content="Howcodex, 3/7/2014" /> <meta http-equiv="refresh" content="5" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Si può utilizzare il tag <meta> per effettuare un redirect dalla tua pagina web ad un altra. Si può anche definire un tempo, in modo da effettuare il redirect dopo che sono passati un tot di secondi.
Following is an example of redirecting current page to another page after 5 seconds. If you want to redirect page immediately then do not specify content attribute.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="revised" content="Howcodex, 3/7/2014" /> <meta http-equiv="refresh" content="5; url=https://www.howcodex.com" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
I cookie sono dei dati, memorizzati in piccoli file di testo sul vostro computer che vengono scambiati tra il browser e il server web per tenere traccia di varie informazioni in base alle esigenze delle applicazioni web.
È possibile utilizzare tag <meta> per memorizzare i cookie sul client e in seguito possono essere riutilizzate dal server Web per tenere traccia di un visitatore del sito.
A seguire un esempio per impostare la scadenza dei cookies.
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="revised" content="Howcodex, 3/7/2014" /> <meta http-equiv="cookie" content="userid=xyz; expires=Wednesday, 08-Aug-15 23:59:59 GMT;" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Se non viene indicata data e ora di scadenza i cookie scadranno alla chiusura del browser.
Nota: Per una guida completa ai cookies puoi seguire la guida PHP and Cookies.
Con il seguente meta tag sarà possibile indicare l' autore della pagina:
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="author" content="Mahnaz Mohtashim" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Con il tag <meta> si può definire il set di caratteri utilizzato all' interno della pagina.
Di default, Web servers e Web browsers usano la codifica ISO-8859-1 (Latin1) per elaborare le pagine web. A seguire un esempio per impostare la codifica UTF-8:
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="author" content="Mahnaz Mohtashim" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <p>Hello HTML5!</p> </body> </html>
Per mostrare una pagina con caratteri tradizionali Cinesi, è necessario che la pagina contenga un tag <meta> che imposta la codifica Big5:
<!DOCTYPE html> <html> <head> <title>Meta Tags Example</title> <meta name="keywords" content="HTML, Meta Tags, Metadata" /> <meta name="description" content="Learning about Meta Tags." /> <meta name="author" content="Mahnaz Mohtashim" /> <meta http-equiv="Content-Type" content="text/html; charset=Big5" /> </head> <body> <p>Hello HTML5!</p> </body> </html>