SEO & Microformats

Come introdurre la semantica nelle pagine WEB. Cosa cambia in

termini di posizionamento?

18 settembre 2010

Ing. Salvatore Capolupo

www.hostingaffiliazioni.com

Distribuito con Licenza Creative Commons diAttribuzione, Non Commerciale e Non Derivativa

Problema

➲ Esempio:➲ Questo blog è pubblicato con una <a

href="http://creativecommons.org/licenses/by/3.0/">Licenza Creative Commons</a>

➲ ...il tag <a> non fornisce alcuna informazione sul significato del link! Invece:

➲ Questo blog è pubblicato con una <a rel=”license” href="http://creativecommons.org/licenses/by/3.0/">Licenza Creative Commons</a>

➲ Attributi semantici dei tag verso il WEB 3.0→

Microformati (µF), cosa sono?

➲ Non sono visibili coi browser standard

➲ Aggiungono informazioni utili alla pagina XHTML

➲ “Piacciono” ai motori di ricerca

➲ ...che tipo di informazioni?

µF

➲ Similmente ai meta-tag, possono “aiutare” il posizionamento nelle SERP...

➲ … a patto di usarli onestamente (quando servono), cioè in modo descrittivo

➲ Possono indicare:● Informazioni anagrafiche (hCard)● Caratteristiche dei prodotti (e-commerce)● Localizzazioni geografiche (Google Maps)● Dettagli di un evento (hCalendar)● ...

Situazione attuale SEO & Microformati

➲ Search Engine Journal: uno dei tre fattori rilevanti, assieme ad HTML5 ed OpenSocial, per l'evoluzione del SEO (già nel 2006!)

➲ Guida di Google: standard solo parzialmente adottato (finora)

➲ GT forum: evidenzia vantaggi competitivi per chi li adotterà da subito

➲ Sono utilizzati ancora da pochi webmaster (ma buoni)➲ Utili se dovete gestire parecchie informazioni strutturate

(elenchi di locali, annunci, eventi, siti turistici...)

Microformats & SEO

➲ Rendono il codice semantico ...➲...ma quale impatto reale sui motori di ricerca?

➲→ “difficile a dirsi” secondo SEJ➲→ potenzialmente molto forte in futuro➲→ non richiede stravolgimenti del codice (es.

basta aggiungere un attributo)

Microformats & SEO

➲ → vari “vocabolari” che specializzano i microformati a seconda delle esigenze...

● Contatti personali (hCard)● Social (FOAF)● ...● E-commerce (RDFa)

➲ Non esiste un unico microformato!

µF :: vCard

CODICE SEMANTICO

inserire “annotazioni” = rendere i dati strutturati disponibili ● per i motori di ricerca (Google per i motori di ricerca (Google Snippets)Snippets)● per qualsiasi web-app che li sappia riconoscere (dato che org, locality, region, … sono standardizzati)

µF :: Friend Of A Friend

● FOAF: cicroformato per esprimere relazioni tra persone

● L' amicizia tra Jane e Mac è deducibile dai tag (Esempio di Manu Sporny)

● Social network...

Sintassi FOAF = <foaf:attribute>

<foaf:Person rdf:about="#danbri" xmlns:foaf="http://xmlns.com/foaf/0.1/"> <foaf:name>Dan Brickley</foaf:name> <foaf:homepage rdf:resource="http://danbri.org/" /> <foaf:openid rdf:resource="http://danbri.org/" /> <foaf:img rdf:resource="/images/me.jpg" /></foaf:Person>

Si legge: “C'è una foaf:person avente foaf:name Dan Brickley che ha una pagina web ed un OpenID http://danbri.org/, e ad un'immagine /images/me.jpg”

µF :: RDFa (Resource Description Framework)

→ ... in attributes!➲ Esprime proprietà del tag rendendolo un

“oggetto” reale (un prodotto con prezzo, dimensioni, caratteristiche...) → e-commerce!

➲ Utilizzato da tempo su bestbuy.com (ma anche 2spaghi.it)

● Impatto ottimale sui motori, visto che sono informazioni contestuali

● Permette di massimizzare le informazioni utili da fornire al crawler

RDFa & BestBuy.com

Best Buy utilizza un vocabolario (Good Relations) utile per descrivere prodotti, prezzi e dati dell'azienda

Linguaggio universale → massima visibilità!

<dizionario:proprietà>

✔ gr:BusinessEntity✔ gr:LocationOfSalesOrServiceProvisioning

✔ gr:ProductOrServicesSomeInstancesPlaceholder✔ gr:ActualProductOrServiceInstance

✔ gr:ProductOrServiceModel✔ gr:Offering

µF :: Dublin Core

➲ I motori di ricerca amano l'utilizzo corretto dei tag (header, prominent,...)

<div> <h2>Vademecum SEO</h2> <h3>Salvatore Capolupo</h3> ...</div>

Dublin Core

➲ … utilizzo il dizionario Dublin Core (dc) per specificare cosa rappresentano i vari “pezzi” del <div>

<div xmlns:dc="http://purl.org/dc/elements/1.1/"> <h2 property="dc:title">Vademecum SEO</h2> <h3 property="dc:creator">Salvatore Capolupo</h3> ...</div>

Dublin Core

➲ Ho utilizzato dc:title e dc:author come nuovi attributi, perchè XHTML non ne possiede alcuno nativo come title o author ( ho esteso XHTML)→

➲ Ho reso semantico a costo di una semplice aggiunta di attributo

➲ HTML standard non supporta i microformati (necessario XHTML)

Google: Rich Snippets➲Microformati➲RFDa➲Microdati

➲http://tinyurl.com/qvr5g7

➲recensioni ➲profili utente➲schede di attività

commerciali ➲eventi

“Più informazioni vengono fornite dallo snippet di un risultato di ricerca, più facile sarà per gli utenti decidere se la pagina è pertinente alla loro ricerca”

Google e Microformati→ Non viene garantita l' ”esposizione” dei microformati nelle SERP (...e ti pareva ;) )

→ Nel 2009 è stata ufficializzata la potenzialità di tale formato per le nuove applicazioni

→ Comunque vadano le cose:➲ Costa poco aggiungerli

➲ Molti vantaggi in prospettiva

http://tinyurl.com/rich-snippetshttp://tinyurl.com/rich-snippets

Conclusioni (ed esempi pratici)➲ Content is king...

...meglio se con i microformati!

➲ Verso uno standard semantico delle pagine

➲ Diventa vitale esporre informazioni pertinenti (e utili)

● Link building, pagerank, black hat SEO e tecniche tradizionali destinate ad diventare... irrilevanti?

Come implementare i µF?

➲ Plugin Firefox per vederli

➲ PHP➲ Wordpress➲ Blogger (su alcuni template)➲ … a manina in HTML!➲ ...

PLUGIN FIREFOX

TAILS

Permette di visualizzare i microformati

https://addons.mozilla.org/it/firefox/addon/2240/

PHP

http://enarion.net/phpmicroformats/examples/

Generatori Statici (HTML)

http://microformats.org/code/hcard/creatorhttp://microformats.org/code/hcalendar/creatorhttp://microformats.org/code/hreview/creator

http://gmpg.org/xfn/creator-it (in italiano)

Wordpress

http://wordpress.org/extend/plugins/tags/microformats

Fine :)

➲ http://tinyurl.com/giorgiotave123➲ http://tinyurl.com/seo-microformats

➲ http://tinyurl.com/rich-snippets➲ http://tinyurl.com/rdfa-ecommerce

➲ http://www.w3.org/TR/xhtml-rdfa-primer/

s.capolupo@gmail.com

http://www.hostingaffiliazioni.com