Hjälp sökmotorerna att tolka ditt innehåll

Mikrodata är ett sätt att strukturera innehållet på din webbplats enligt en fördefinierad mall som hjälper sökmotorer och webbläsare att förstå vad för typ av innehåll du har på sidan. Denna information kan sökmotorer och webbläsare sedan använda för att förbättra användarupplevelsen, exempelvis med Rich Snippets som jag kommer till senare. Låter bra – men […]

Publicerat
Inlägg Sociala Medier

Mikrodata är ett sätt att strukturera innehållet på din webbplats enligt en fördefinierad mall som hjälper sökmotorer och webbläsare att förstå vad för typ av innehåll du har på sidan. Denna information kan sökmotorer och webbläsare sedan använda för att förbättra användarupplevelsen, exempelvis med Rich Snippets som jag kommer till senare.

Låter bra – men hur gör jag?

Kul att du frågar!
Det är små ingrepp som behövs. Om du redan har ditt innehåll i en bra HTML-struktur så krävs endast att du implementerar de taggar och attribut som hör till den specifika mallen du valt direkt i din existerande struktur.

Något som blir vanligare i webb-butiker är möjligheten för kunder att skriva produktrecensioner och ge betyg. Utan mikrodata-taggning kan en sådan HTML se ut på detta viset:

<div>
Panasonic TX-P50V20	
Kundbetyg
4 av 5 - baserat på 23 omdömen.
</div>

Med mikrodata-taggning ser innehållet istället ut såhär:

<div itemscope itemtype='http://schema.org/Product'>
<span itemprop='name'>Panasonic TX-P50V20</span>
<div itemprop='aggregateRating' itemscope 
 itemtype='http://schema.org/AggregateRating'>
Kundbetyg
<span itemprop='ratingValue'>8</span>
 av <span itemprop='bestRating'>10</span> - 
baserat på <span itemprop='ratingCount'>23</span>
 omdömen.
</div>

Tappade jag bort dig nu?
Ok, vi delar upp beståndsdelarna och går igenom dem en och en.

itemscope
Det första vi behöver göra är att definiera att det aktuella elementet är en mikrodata-behållare. Det gör vi genom att placera det tomma attributet itemscope i elementet. I denna mikrodata-behållare har vi nu möjlighet att strukturera vår data. Men hur vet sökmotorerna vilken typ av innehåll vi definierar?

itemtype
Attributet itemtype definierar vilken typ av innehåll din mikrodata-behållare innehåller. Värdet på detta attribut är således webbadressen till den mall som definierar vilka datatyper som kan användas. I fallet ovan används mallen Product, vars definition finns på webbadressen http://schema.org/Product. Det finns en mängd olika mallar för olika typer av innehåll, såsom recept, filmer
och händelser.

AggregateRating är en annan mall vi använder för att definiera våra kundomdömen. Den mikrodata-behållare som är förknippad med AggregateRating behöver ligga inuti mikrodata-behållaren för Product. Detta eftersom ett betyg måste vara kopplat till något, i detta fall en produkt.

På webbplatsen http://schema.org/docs/schemas.html finns mallar som är anammade av de största sökmotorerna och webbläsarna och där kan man utläsa vilka undermallar man kan använda sig av för respektive mall.

itemprop
Nu är det dags att börja strukturera upp vår data, och det är i attributet itemprop som du definierar vilken typ av data elementet innehåller. I exemplet ovan sätter vi itemprop=’name’ i mikrodata-behållaren för Product, alltså säger det att vi har en produkt vars namn är Panasonic TX-P50V20. Än en gång kan du besöka http://schema.org/Product för att se vilka itemprops som finns tillgängliga för Product-mallen.

Rich Snippets

De största sökmotorerna använder redan viss mikrodata för att visa ett rikare innehåll i sina sökresultat, dessa kallas för rich snippets.
Exempel på detta:

Prisjakt - Rich Snippet

Recept - Rich Snippet

Var dock medveten om att även om du implementerar din mikrodata felfritt så garanterar inte sökmotorerna att datan kommer att presenteras i sökresultatet.

Testa din strukturerade data

För att säkerställa att din data tolkas som du tänkt dig kan du testa din kod i Googles egna testverktyg.
Såhär såg det ut när vi testade vår kod:
Rich Snippet test

Vad är vinningen?

Google själva säger att mikrodata inte påverkar rankingen av dina sidor, så vad har du att tjäna på att implementera en denna struktur?
Du kanske inte får bättre positioner, men trafik till din webbplats beror inte bara på var i sökresultaten din sida befinner sig. Det är lika viktigt att ditt sökresultat står ut från mängden, och det är precis vad dina Rich Snippets kommer att göra. Du kommer att märka att du får en högre CTR (click-through rate) på dessa sökresultat.

I och med att sökmotorerna presenterar mer och mer mikrodata i sina sökresultat är det definitivt värt att börja tänka på hur sökmotorerna tolkar innehållet i din webb-butik.