Strukturyzowanie danych na stronie internetowej

Jeśli chcesz by Twoja strona była lepiej wyszukiwana przez Google i inne wyszukiwarki, a dodatkowo zawartość Twojej strony stanowiła dla robotów spójną całość.  Musisz do tego użyć odpowiednio przygotowanych schematów, które będą opisywać Twoje dane.

pexels-photo-577210

http://schema.org/ to projekt, do którego swoją cegiełkę dołożyły takie firmy jak Google czy Microsoft. Ich celem jest strukturyzowanie danych w Internecie. Co to znaczy? Wpisując adres siedziby swojej firmy na stronie, możesz jasno określić, że to jest adres Twojej firmy i późnej na podstawie tego wyszukiwarki pozwolą użytkownikowi szybciej odpowiedzieć na zapytanie o adres Twojej firmy.

Jak to działa?

Oznaczasz odpowiednimi atrybutami znacznik, w którym znajdą się opisywanie dane. Zacznijmy od początku! Tworzysz notatkę na temat filmu Avatar. Tak wygląda w czystym HTML:

<div>
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
 <span>Science fiction</span>
 <a href="../movies/avatar-theatrical-trailer.html">Trailer</a></div>

Do tego dodajemy itemscope, który wyróżni zawartość znacznika jako jeden element stanowiący całość.

<div itemscope>
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954) </span>
  <span>Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a></div>

Teraz musimy dodać typ zawartości tego elementu. Jest ich wiele i każdy z typów ma wartości. Wszystkie schematy możesz znaleźć tutaj: http://schema.org/docs/schemas.html. My dodajemy typ Movie:

<div itemscope itemtype="http://schema.org/Movie">
<h1>Avatar</h1>
<span>Director: James Cameron (born August 16, 1954)</span>
  <span>Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a></div>

Teraz za pomocą atrybutu itemprop opisujemy każdą część naszego opisu. Będzie to w naszym przykładzie nazwa filmu, reżyser, gatunek, link do trailera.

<div itemscope itemtype ="http://schema.org/Movie">
<h1 itemprop="name">Avatar</h1>
<span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a></div>

Dane możemy zapętlać, bo przecież reżyser jest osobą więc może warto go opisać schematem Person:

<div itemscope itemtype ="http://schema.org/Movie">
<h1 itemprop="name">Avatar</h1>
<div itemprop="director" itemscope itemtype="http://schema.org/Person">
  Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954</span>)</div>
<span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a></div>

Jeśli podajesz na swojej stronie datę, warto umieścić ją w odpowiednim znaczniku i przypisać do atrybutu datę w formacie zrozumiałym dla robotów. Dzięki temu unikniemy zbędnych pomyłek związanych z różnym zapisywaniem daty w różnych krajach.

<time datetime="2011-04-01">04/01/11</time><span 				data-mce-type="bookmark" 				id="mce_SELREST_start" 				data-mce-style="overflow:hidden;line-height:0" 				style="overflow:hidden;line-height:0" 			></span>

Za pomocą http://schema.org możesz uporządkować dane na swojej stronie, tak by były bardziej zrozumiałe dla robotów w wyszukiwarkach. Kiedy robot nie będzie musiał się męczyć z naszą stroną, bo wszystkie informacje będzie miał podane na tacy, na pewno odwdzięczy się kilkoma miejscami w górę przy wyszukiwaniu np. w Google. Dlatego microdata, czyli właśnie takie przygotowane dane to pozycja obowiązkowa jeśli staramy się o przyjazność strony dla wyszukiwarek internetowych.

Reklama

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Wyloguj /  Zmień )

Zdjęcie z Twittera

Komentujesz korzystając z konta Twitter. Wyloguj /  Zmień )

Zdjęcie na Facebooku

Komentujesz korzystając z konta Facebook. Wyloguj /  Zmień )

Połączenie z %s