Metatag

Abbiamo fondamentalmente due tipi di metatags; al primo tipo, il piu' importante, viene demandato il compito di aiutare i motori di ricerca nell'indicizzazione del sito, fatta eccezione per un paio di essi che non svolgono altro compito che ricaricare automaticamente la pagina che ne porta il codice, oppure di redirezionare il browser ad un altro documento. Infine, la seconda tipologia rientra nella 'nicchia' del cosiddetto codice proprietario, in quanto vengono interpretati solamente dai browser Microsoft. Si ricordi che, di qualunque tipo siano, il loro codice deve essere posto all'interno dei tag <HEAD> e </HEAD>.

  Meta per i motori di ricerca  

Seppure sembri che le ultime generazioni dei motori di ricerca abbiano apparentemente perso un po' di 'interesse' nei confronti dei metatags, vale senz'altro la pena adottarli. In passato erano considerati fondamentali per ottenere un buon posizionamento ma, come acennato in precedenza, i potenti software dei motori di ricerca hanno ampliato e mutato i loro criteri di indicizzazione volgendo lo sguardo verso altri tipi di parametri. Segue un elenco dei principali meta in ordine di importanza.

<META NAME="keywords" CONTENT="parole chiave">

Questo è il meta più importante, viene usato dai motori di ricerca per catalogare la pagina. Se il sito nell'esempio si occupasse di astronomia alcune possibili parole chiave potrebbero essere galasssie, nebulose, pianeti, ecc. . Si consiglia di non ripetere le parole e di non eccedere nel numero delle stesse (max 1000 caratteri).


<META NAME="description" CONTENT="www.astronomia.it il sito dell'astronomo dilettante">

Altro meta importante. Usato dai motori di ricerca per associare il link al sito (max 300 caratteri).


<META NAME="robots" CONTENT="index,follow">

Questo meta indica ai motori di ricerca se indicizzare o meno la pagina. Come si evince dall'esempio il motore e' autorizzato a indicizzare la pagina e a proseguire con i documenti ad essa collegati. Gli altri due possibili valori sono noindex e nofollow.


<META NAME="revisit-after" CONTENT="30 days">

Viene invitato il motore a rivisitare la pagina ogni 30 giorni.


<META NAME="language" CONTENT="Italian">

Per specificare la lingua usata nel documento.


<META NAME="author" CONTENT="nome dell'autore">

In questo meta e' possibile specificare il nome dell'autore (o degli autori) della pagina in questione.


<META NAME="generator" CONTENT="metapad">

Questo meta serve a specificare l'editor utilizzato per creare la pagina.

Naturalmente esistono molti altri metatag di possibile utilizzo, ma probabilmente di minore importanza ai fini del posizionamento del sito. Per un elenco piu' completo si vedano gli indirizzi alla sezione Utilita'.


  Meta di "refresh"  

I meta di refresh non vengono utilizzati dai motori, servono unicamente per scopi legati ad altre esigenze. E' doveroso puntualizzare che potrebbero essere addirittura poco graditi da questi ultimi, soprattutto quando rimandano ad una pagina differente.

<META http-equiv="refresh" CONTENT="30">

Questo meta serve per ricaricare la pagina ogni tot secondi (in questo caso 30). In alternativa si puo' indicare al browser di caricare una pagina differente:

<META http-equiv="refresh"; CONTENT="30 URL=altra_pagina.html">


  Metatag proprietari  

Questi meta svolgono unicamente una mansione estetica, creando interessanti effetti di transizione all'apertura o alla chiusura della pagina su cui sono posti. Funzionano unicamente con i browser Microsoft e si sudddividono essenzialmente in due categorie, la prima e' usufruibile a partire dalla versione 4.0 di Internet Explorer, mentre la seconda e' interpretabile unicamente dalle versioni 5.5 in poi. Ecco un esempio di sintassi:

    Prima categoria

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=0.5,Transition=1)">

il valore "Page-Enter" puo' essere sostituito con "Page-Exit" ottenendo l'effetto all'uscita dalla pagina.
clicca per una dimostrazione

L'attributo Transition puo' essere impostato su 23 possibili valori, l'ultimo dei quali genera un effetto 'random' mostrando a caso una delle precedenti 22 transizioni ad ogni apertura di pagina. Segue una breve descrizione dei 23 valori:

0 : apre dai bordi con un rettangolo
1 : apre dal centro con un rettangolo
2 : apre dai bordi con cerchio
3 : apre dal centro con un cerchio
4 : apre dal basso
5 : apre dall'alto
6 : apre da sinstra
7 : apre da destra
8 : apre con "veneziana" verticale
9 : apre con "veneziana" orizzontale
10 : apre a scacchi da sinistra
11 : apre a scacchi dall'alto
12 : apre in dissolvenza
13 : apre da ds e da sx
14 : apre dal centro verso ds e sx
15 : apre dall'alto e dal basso
16 : apre dal centro con una linea orizzontale
17 : apre dall'angolo in alto a destra
18 : apre dall'angolo in basso a ds
19 : apre dall'angolo in alto a sinistra
20 : apre dall'angolo in basso a sinistra
21 : apre con tante righe orizzontali
22 : apre con tante righe verticali
23 : da quì in poi apre random

Quest'ultimo, non compreso nella precedente lista, crea un effetto fading:

<META http-equiv="Page-Enter" CONTENT="blendTrans(Duration=0.5)">


    Seconda categoria

Questi sono i meta di transizione interpretati dalle versioni di Internet Explorer 5.5 in poi. Il codice sotto ne mostra un bell'esempio.

<META http-equiv="Page-Enter" CONTENT="progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=50,duration=4)">

clicca per una dimostrazione

Ecco la lista delle transizioni. Per brevita' ne elencheremo solo il contenuto senza i possibili valori (per es. MaxSquare=50,duration=4).

Pixelate()
RandomDissolve()
Iris(irisStyle='star', motion='out')
Iris(irisStyle='diamond', motion='in')
Iris(irisStyle='cross', motion='out')
Iris(irisStyle='circle', motion='in')
Iris(irisStyle='square', motion='out')
Iris(irisStyle='plus', motion='in')
Barn(orientation='vertical' motion='in')
Barn(orientation='vertical' motion='out')
Barn(orientation='horizontal' motion='in')
Barn(orientation='horizontal' motion='out')
Inset()
Checkerboard(Direction='left')
Checkerboard(Direction='right')
Checkerboard(Direction='down')
Checkerboard(Direction='up')
RandomBars(motion='horizontal')
RandomBars(motion='vertical')
Slide(bands=5, slideStyle='push')
Slide(bands=5, slidestyle='swap')
Slide(bands=5, slidestyle='hide')
Spiral()
Stretch(stretchStyle='push')
Stretch(stretchstyle='spin')
Stretch(stretchstyle='hide')
Wipe(GradientSize=.50, wipeStyle=0, motion='forward')
RadialWipe(wipeStyle='clock')
RadialWipe(wipeStyle='radial')
RadialWipe(wipeStyle='wedge')
Zigzag(motion='leftup')
Strips(motion='leftup')
Strips(motion='rightup')
Strips(motion='leftdown')
Strips(motion='rightdown')
Wheel(spokes=8)
Inset()
Fade(overlap=1)

Prossimo capitolo

© 2002 Poletti Stefano