Język HTML5 zawiera ponad 100 znaczników. Część z nich to elementy semantyczne, ale większość stanowi kontenery dla różnych elementów strony. Znaczniki te zazwyczaj tylko informują przeglądarkę internetową w jaki sposób wyświetlić umieszczone w tagach dane, ale praktycznie nigdy nie wskazują znaczenia elementu. Kod <h1>Jurassic Park</h1> dostarcza informacji dla przeglądarki, że tekst powinien zostać wyświetlony jako nagłówek najwyższego poziomu, ale nie mówi o czym jest mowa – czy jest to tytuł filmu, książki, artykułu w gazecie.  Utrudnia to wyszukiwarkom inteligentne wyświetlanie odpowiedniej zawartości – po prostu w przeciwieństwie do człowieka nie są w stanie w łatwy sposób zidentyfikować zawartości znaczników. Dlatego też powstały tzw. mikrodane. Słownik schema.org wraz z formatem mikrodanych pozwala na dodawanie pomocniczych informacji do zawartości HTML, określających ich zawartość.

Mikrodane to mające zdefiniowany zakres adnotacje DOM w postaci para nazwa-wartość z niestandardowych słowników.

Oznacza to, że Mikrodane to jakby niestandardowy (nie oparty o standardowe znaczniki HTML5) słownik danych, które pokazują wyszukiwarce co reprezentuje dany fragment tekstu na stronie. Tak naprawdę każdy webmaster może zdefiniować własny słownik mikrodanych i używać własnych własności na swoich stronach. Muszą mieć one postać par nazwa-wartość.  Aby użyć własności mikrodanych na stronie, należy w odpowiednim miejscu wpisać jej nazwę. Sposób pobierania wartości mikrodanych jest zależny od miejsca deklaracji nazwy własności.

Jak oznaczać zawartość mikrodanymi

Uzupełnienie standardowych znaczników języka HTML5 o dodatkowe znaczniki pomaga wyszukiwarkom i innym aplikacjom na lepsze zrozumienie zawartości strony i dzięki temu wyświetlenie jej w bardziej użyteczny sposób.

Atrybut itemscope

Przykład: w serwisie mamy stronę o filmie „Jurassic Park” Stevena Spielberga z linkiem do zwiastuna, informacją o reżyserze i gatunku. Jej kod na naszej stronie może być podobny do tego:

<div>
<h1>Jurassic Park</h1>
<span>Reżyser: Steven Spielberg (ur. 1946)</span>
<span>Sciene-fiction</span>
<a href="filmy/jurassic-park.html">Trailer</a>
</div>

Na poczatku należy dodać element itemscope do znacznika HTML, który obejmuje informacje o obiekcie danego typu (w tym przypadku filmu), np. tak:

<div itemscope>
<h1>Jurassic Park</h1>
<span>Reżyser: Steven Spielberg (ur. 1946)</span>
<span>Sciene-fiction</span>
<a href="filmy/jurassic-park.html">Trailer</a>
</div>

Atrybut itemtype

Od teraz wyszukiwarka internetowa „wie”, że kod HTML zawarty w bloku <div> dotyczy konkretnego obiektu. Musimy teraz wskazać typ obiektu za pomocą atrybutu itemtype:

<div itemscope itemtype="http://schema.org/Movie">
<h1>Jurassic Park</h1>
<span>Reżyser: Steven Spielberg (ur. 1946)</span>
<span>Sciene-fiction</span>
<a href="filmy/jurassic-park.html">Trailer</a>
</div>

Dzięki temu wyszukiwarka już „wie”, że typ obiektu to film. Typy obiektów są wskazywane za pomocą adresów URL.

Atrybut itemprop

Następnie powinniśmy oznaczyć dodatkowe właściwości obiektu (np. tytuł, reżyser, gatunek, itd) – w tym celu wykorzystuje się atrybut itemprop:

<div itemscope itemtype="http://schema.org/Movie">
<h1 itemprop="name">Jurassic Park</h1>
<span>
Reżyser:
<span itemprop="director">Steven Spielberg</span>
(ur. 1946)
</span>
<span itemprop="genre">Sciene-fiction</span>
<a href="filmy/jurassic-park.html" itemprop="trailer">Trailer</a>
</div>

Dzięki temu wyszukiwarka internetowa może dowiedzieć się co znajduje się pod danym adresem internetowym.

Typy i właściwości schema.org

Schema.org opisuje szereg różnych typów obiektów (np. Book, Event, Organization, Place, Product, Review), z których każdy ma swój własny zestaw właściwości go opisujących.

Dodając znaczniki Mikrodanych koniecznie pamiętajmy o kilku wskazówkach:

• Im więcej, tym lepiej. Ogólnie ma zastosowanie zasada, że im większa część treści zostanie oznaczona, tym lepiej.
• Oczekiwane typy zastępowane tekstem. Właściwości w schemacie schema.org mają zdefiniowany oczekiwany typ danych, który powinien zostać poprawnie przekazany w zaznaczonym elemencie.
• Prawidłowe korzystanie z właściwości url.

Testowanie znaczników

Aby przetestować znaczniki i mieć pewność, że zostały poprawnie dołączone do strony, można wykorzystać narzędzie Rich Snippets Testing Tool

Dane zrozumiałe dla komputerów

W niektórych przypadkach właściwość obiektu może być trudna do zrozumienia przez wyszukiwarki. W takich przypadkach należy dostarczyć czytelną wersję informacji:

Data, godzina i czas trwania.

Data i godzina są podawane na najróżniejsze sposoby. Aby wyszukiwarka zrozumiała poprawny czas, należy skorzystać ze znacznika time z atrybutem datetime. Wartość datetime powinna być datą w formacie RRRR-MM-DD:

<time datetime="2015-12-02">2 grudnia 2015</time>

Można także wskazać konkretną godzinę korzystając z formatu hh:mm i oddzielając od daty literką T. Należy to wykonać w taki sposób:

<time datetime="2015-12-02T20:30">2 grudnia 2015, godzina 20:30</time>

Model danych mikrodanych

Nazwę własności mikrodanych zawsze deklaruje się w elemencie HTML. Natomiast odpowiadająca jej wartość jest pobierana ze struktury DOM tego elementu. W przypadku większości elementów HTML, wartość ta jest tekstową treścią elementu. Jest jednak kilka wyjątków, które zostały przytoczone w poniższej tabeli:

Generator online

W sieci istnieją gotowe generatory microdata, które znacznie ułatwiają dodawanie znaczników. Jednym z nich jest https://microdata.wyremski.pl/ – więcej informacji o nim znajdziesz w tym wpisie Microdata online generator

Podsumowanie

Oczywiście ten wpis to tylko wierzchołek góry lodowej. Listę wszystkich dostępnych znaczników wraz z opisem stosowania znajdziesz na schema.org