Lo Schema Markup è particolarmente importante nell’era di Hummingbird e RankBrain perché il modo in cui un motore di ricerca interpreta il contesto di una query determinerà la qualità di un risultato di ricerca.
Non ci sono prove che i microdati abbiano un effetto diretto sulle classifiche di ricerca organiche, tuttavia, i rich snippet fanno apparire le pagine web in modo più evidente nelle SERP. Questa migliore visibilità ha dimostrato di migliorare le percentuali di clic .
Secondo uno studio di acmqueue, meno di un terzo dei risultati di ricerca di Google include un rich snippet con markup Schema.org. Questo espone una grande opportunità per il resto.
Che cosa è Schema Markup?
Schema Markup è una forma di microdati. Una volta aggiunto a una pagina web lo schema markup crea una descrizione avanzata (comunemente nota come rich snippet), che viene visualizzata nei risultati di ricerca.
Schema Markup disponibile su Schema.org, può fornire il contesto a una pagina Web altrimenti ambigua.
“La maggior parte dei webmaster ha familiarità con i tag HTML sulle loro pagine. Di solito, i tag HTML indicano al browser come visualizzare le informazioni incluse nel tag. Ad esempio, <h1> Avatar </h1> indica al browser di visualizzare la stringa di testo “Avatar” in un formato di intestazione 1. Tuttavia, il tag HTML non fornisce alcuna informazione sul significato di quella stringa di testo: “Avatar” potrebbe riferirsi al film 3D di grande successo o potrebbe fare riferimento a un tipo di immagine del profilo e ciò può rendere più difficile la ricerca motori per visualizzare in modo intelligente contenuti pertinenti per un utente. “
Come aggiungere Schema Markup alle pagine web
Si può aggiungere Schema Markup con i microdata
Microdata è un insieme di tag che mira a rendere molto più semplice l’annotazione di elementi HTML con tag leggibili automaticamente. I microdata sono un ottimo punto di partenza per i principianti perché è così facile da usare.
Tuttavia, l’unico aspetto negativo dell’uso dei microdati è che devi contrassegnare ogni singolo elemento all’interno del corpo della tua pagina web. Come puoi immaginare, questo può diventare rapidamente disordinato.
Prima di iniziare ad aggiungere uno schema alle tue pagine web, devi capire il “tipo di elemento” del contenuto sulla tua pagina web.
Ad esempio, i tuoi contenuti web si concentrano sul cibo? Musica? Tech?
Dopo aver capito il tipo di elemento, ora puoi determinare come etichettarlo.
Diamo un’occhiata a un esempio. Diciamo che possiedi un negozio che vende router di alta qualità. Se dovessi guardare il codice sorgente della tua homepage probabilmente vedresti qualcosa di simile a questo:
<div>
<h1> TechHaven </h1>
<h2> I migliori router che troverai online! </h2>
<p> Indirizzo: </p>
<p> 459 Humpback Road </p>
<p> Rialto , Ca </p>
<p> Tel: 909 574 3903 </p>
<p> <a href=rechttp://www.techhaven.com/menu’> Fai clic qui per visualizzare i nostri migliori router! </ A > </p>
<p> Siamo aperti: </p>
<p> lun-sab 8: 00-22: 30 </p>
<p> dom: 14: 00-20: 00 </p>
</div>
Una volta che ti immergi nel codice, ti consigliamo di trovare la parte della tua pagina web che parla di ciò che la tua attività ha da offrire. In questo esempio, tali dati possono essere trovati tra i due tag <div>.
Ora, in alto, puoi aggiungere:
<div itemscope >
Aggiungendo questo tag, stiamo affermando che il codice HTML contenuto tra i blocchi <div> sta identificando un elemento specifico.
Successivamente, dobbiamo identificare qual è l’oggetto utilizzando l’attributo ‘tipo articolo’ per identificare il tipo di oggetto di cui la nostra pagina web tratta (tecnologia).
<div itemscope itemtype = “http://schema.org/tech”>
Un tipo di elemento si presenta sotto forma di un URL (come http://schema.org/tech). Diciamo, ad esempio, che il tuo sito ruotava attorno ai prodotti di bellezza anziché alla tecnologia. L’URL del tipo di articolo potrebbe essere simile al seguente:
http://schema.org/beauty.
Per semplificare le cose, puoi sfogliare un elenco di tipi di elementi qui, inoltre puoi visualizzare le estensioni per identificare l’entità specifica che stai cercando. Tieni presente che questo elenco non è completo, quindi esiste la possibilità che non troverai il tipo di elemento per la tua nicchia specifica.
Tornando alla pagina tecnica, si desidera taggare la parte della pagina Web che contiene il nome dell’azienda. Puoi farlo tra i tag <h1>.
Ora useremo il tag ‘itemprop’, che identifica le proprietà di un oggetto:
<h1 itemprop = “name” > Tech Haven </h1>
Ora puoi applicare questi tag al resto della pagina. Quando si utilizzano i tag per identificare le proprietà dell’elemento, non è necessario taggare l’intera riga, ma solo la parte a cui fa riferimento la proprietà.
Si può aggiungere Schema Markup con RDFa
RDFa è l’acronimo di Resource Description Framework in Attributes . In sostanza, RDFa è un’estensione di HTML5 ed è stato progettato per aiutare gli utenti a contrassegnare i dati strutturati.
RDFa è considerata una raccomandazione del W3C, nel senso che è uno standard web e può essere utilizzata per concatenare vocabolari di dati strutturati. Ciò è particolarmente utile se si desidera aggiungere dati strutturati che si estendono oltre i limiti di Schema.org.
Puoi tirare un sospiro di sollievo. RDFa non è molto diverso dai microdati.
Simile ai microdati, i tag RDFa si incorporano con il codice HTML preesistente nel corpo della tua pagina web. Per motivi di familiarità, guarderemo di nuovo il sito Web della tecnologia come esempio.
L’HTML per il tuo sito tecnico sarebbe probabilmente simile a questo prima che fosse modificato:
<div>
<h1> Tech Haven </h1>
<h2> I migliori router online! </h2>
<p> Indirizzo: </p>
<p> 459 Humpback Road </p>
<p> Rialto, Ca < / p>
<p> Tel: 909 574 3903 </p>
<p> <a href=’http://www.techhaven.com/menu’> Fai clic qui per visualizzare i nostri migliori router! </a> </ p>
<p> Siamo aperti: </p>
<p> lun-sab 8: 00-22: 30 </p>
<p> dom: 14: 00-20: 00 </p>
</div>
Per cominciare, vuoi assicurarti che il vocabolario che stai usando sia Schema.org e che la pagina web in questione faccia riferimento a una pagina tecnologica.
Per questo esempio, puoi cercare la “tecnologia” su Schema.org per imparare a taggare elementi diversi. In genere, nella parte inferiore della pagina troverai esempi che ti mostreranno come usarli nella pratica.
Basta fare clic sulla scheda RDFa per visualizzare esempi specifici di RDFa.
Successivamente, è necessario utilizzare il tag vocab combinato con l’URL http://schema.org per identificare il vocabolario per il markup. Per identificare il tipo di pagina, utilizzare il tag typeof . A differenza dei microdati, che utilizzano un URL per identificare i tipi, RDFa utilizza una o più parole per classificare i tipi.
<div vocab = “http://schema.org/” typeof = “technology” >
Se desideri identificare una proprietà oltre a quella che dovresti utilizzare l’attributo typeof.
Ad esempio, se desideri espandere ulteriormente una proprietà dell’indirizzo, puoi utilizzare “PostalAddress” in questo modo:
<div property = “address” typeof = “PostalAddress”>
Confrontando microdati e RDFa fianco a fianco, l’ attributo typeof è l’equivalente dell’attributo typetype trovato in Microdata. Inoltre, l’ attributo proprietà sarebbe l’equivalente dell’attributo itemprop .
Per ulteriori spiegazioni, è possibile visitare Schema.org per controllare gli elenchi e visualizzare esempi. È possibile trovare quali tipi di elementi sono definiti come proprietà e quali sono definiti come tipi.
Tornando al nostro esempio precedente, la pagina tecnica sarebbe simile a questa dopo essere stata opportunamente taggata:
<h2 property = “description” > I migliori router su Internet! </h2>
<p> Indirizzo: </p>
<div property = “address” typeof = “PostalAddress”>
<p property = “streetAddress”> 459 Humpback Road </p>
<p property = “addressLocality”> Rialto, Ca </p>
</div>
<p> Tel: <span property = “telephone”> 909 574 3903 </span> </p>
< p> <a property=’menu’ href==http://www.techhaven/menu’> Fai clic qui per visualizzare i nostri migliori router! </a> </p>
<p> Siamo aperti: </ p >
<p property = “openingHours” > lun-sab 8: 00-10: 00
30pm </p> <p property = “openingHours”> Dom: 14: 00-20: 00 </p>
</div>
Per aiutarti, ogni pagina su Schema.org fornisce esempi su come applicare correttamente i tag. Naturalmente, puoi anche ricorrere allo strumento di test dei dati strutturati di Google .
