Video
Prezentacje
Aktualności
26-02-2010
Mikroformaty, a Rich Snippets w Google |
Nie raz w światku SEO słyszeliśmy o tzw. Rich Snipets, jednak niewielu z nas posiada wiedzę w jaki sposób "poprosić" wyszukiwarkę aby zastosowała je przy naszych strona w wynikach wyszukiwania.
Rich Snippets są to dodatkowe informacje w postaci tekstu lub grafiki pojawiające się w wynikach wyszukiwania, ta nowa funkcjonalność pozwala na wyświetlenie np. ceny produktu, ilości ocen jakie otrzymał od Użytkowników i wiele więcej.

Niewątpliwą zaletą takich informacji jest to, iż tak zaprezentowany wynik ma o wiele większą szansę na bycie klikniętym przez potencjalnych Gości. Dodatkowe elementy zdecydowanie zwracają uwagę szukających, a co za tym idzie ilość odwiedzin na stronach z Rich Snippets wzrasta.
Elementy te są chyba najbardziej pożądane zarówno przez sklepy internetowe, strony umożliwiające oceny oraz komentowanie jakiś produktów, jak również portale społecznościowe w których Użytkownicy mają możliwość zakładania własnych profili.
O ile w tej chwili Google niechętnie lub wcale nie wyświetla Rich Snippetów na polskich stronach, o tyle myślę że warto zainwestować trochę naszego czasu już dziś przystosować strony do technologii jutra. Na pewno się opłaci.
Jednym ze sposobów na umożliwienie wyszukiwarce dodanie Rich Snippets dla naszej strony są tzw. Mikroformaty.
Nie jest to nic nowego, czego byśmy wcześniej nie znali. Są to formaty danych opierające się na już istniejących i wykorzystywanych przy tworzeniu witryn internetowych. Wykorzystując odpowiednie nazw klas oraz kilku innych znaczników możemy zakomunikować wyszukiwarce co jest czym na naszej stronie.
W chwili obecnej roboty przeszukujące stronę nie są w stanie odróżnić co jest imieniem, a co jest nazwiskiem w profilu Użytkownika, nie odróżnią komentarza produktu oraz zwykłego tekstu, nie wiedzą czy liczba zamieszczona przy produkcie to cena, ilość ocen czy też może ilość Klientów, którzy zakupili ten produkt. A przecież aby Google mogło wyświetlać te dane w wynikach wyszukiwania, musi wiedzieć gdzie tego szukać na naszej stronie. I właśnie w tym momencie przychodzą nam na pomoc mikroformaty.
Istnieje kilka rodzajów danych w których można zastosować mikroformaty w celu lepszej ich widoczności w wyszukiwarkach, są to:
- profil użytkownika (vcard)
Używane do oznaczania profili użytkowników na różnego rodzaju portalach społecznościowych lub stronach osobistych. Pozwala wyszukiwarce odróżnić dane opisujące osobę od pozostałych danych.
Przykład kodu przed dodaniem mikroformatów:

<div> My name is Bob Smith, but people call me Smithy. Here is my home page: <a href="http://www.example.com">www.example.com</a>. I live in Albuquerque, NM and work as an engineer at ACME Corp. My friends: <a href="http://darryl-blog.example.com">Darryl</a>, <a href="http://edna-blog.example.com">Edna</a> </div>
Przykład kodu po dodaniu mikroformatów:
<div class="vcard"> My name is <span class="fn">Bob Smith</span>, but people call me <span class="nickname">Smithy</span>. Here is my home page: <a href="http://www.example.com" class="url">www.example.com</a>. I live in <span class="adr"> <span class="locality">Albuquerque</span>, <span class="region">NM</span> </span> and work as an <span class="title">engineer</span> at <span class="org">ACME Corp</span>. My friends: <a href="http://darryl-blog.example.com" rel="friend">Darryl</a>, <a href="http://edna-blog.example.com" rel="friend">Edna</a> </div>
Jak widzimy cały profil został objęty klasą vcard, a poszczególne elementy profilu klasami odpowiadającymi ich przeznaczeniu.
| Element | Opis |
| name (fn) | Imię (imię i nazwisko) |
| nickname | Nick |
| photo | Odnośnik do głównego zdjęcia profilu. |
| title | Tytuł jakim mianuje się użytkownik, np. dyrektor generalny. |
| role | Zawód użytkownika, np. księgowy. |
| url | Odnośnik do strony użytkownika, np. domowej. |
| affiliation (org) | Nazwa grupy do której przynależny jest użytkownik, np. pracownik. Jeśli fn i org mają tę samą wartość, Google potraktuje to jako opis firmy, nie osoby. |
| friend | Identyfikuje związek pomiędzy użytkownikiem, a inną osobą. |
| contact | Identyfikuje związek pomiędzy użytkownikiem, a inną osobą. |
| acquaintance | Identyfikuje związek pomiędzy użytkownikiem, a inną osobą. |
| address (adr) | Adres zamieszkania, może zawierać elementy: sreet-address, city, region, postal-code oraz country-name |
Więcej informacji o pozostałych elementach i ich zastosowaniu:
http://www.google.com/support/webmasters/bin/answer.py?answer=146646
http://microformats.org/wiki/hcard
- Recenzja produktu (hreview)
Używane do oznaczania obiektów podlegających recenzji oraz ocenie przez osobę publikującą dany obiekt. W wynikach wyszukiwania pojawiają się eleganckie gwiazdki oznaczające ocenę produktu oraz imię osoby recenzującej.

Przykład kodu przed dodaniem mikroformatów:
<div> L’Amourita Pizza Reviewed by Ulysses Grant on Jan 6. Delicious, tasty pizza on Eastlake! L'Amourita serves up traditional wood-fired Neapolitan-style pizza, brought to your table promptly and without fuss. An ideal neighborhood pizza joint. Rating: 4.5 </div>
Przykład kodu po dodaniu mikroformatów:
<div class="hreview"> <span class="item"> <span class="fn">L’Amourita Pizza</span> </span> Reviewed by <span class="reviewer">Ulysses Grant</span> on <span class="dtreviewed"> Jan 6<span class="value-title" title="2009-01-06" /> </span>. <span class="summary">Delicious, tasty pizza on Eastlake!</span> <span class="description">L'Amourita serves up traditional wood-fired Neapolitan-style pizza, brought to your table promptly and without fuss. An ideal neighborhood pizza joint.</span> Rating: <span class="rating">4.5</span> </div>
| Element | Opis |
| itemreviewed (item) | Obiekt podlegający komentowaniu, może zawierać nazwę (fn). |
| rating | Ocena obiektu (np. 4). Jeśli skala ocen na naszej stronie nie mieści się pomiędzy 1-5, wówczas należy oceną przeskalować do odpowiedniej postaci. 5 - ocena najlepsza; 1- ocena najgorsza |
| reviewer | Autor recenzji obiektu. |
| dtreviewed | Data opublikowania recenzji obiektu. |
| description | Treść recenzji obiektu. |
| summary | Krótki opis/podsumowanie obiektu. |
Więcej informacji o pozostałych elementach i ich zastosowaniu:
http://www.google.com/support/webmasters/bin/answer.py?answer=146645
- Komentarze produktu (hreview-aggregate)
Używane do opisywania obiektu podlegającego recenzjom oraz ocenom przez innych użytkowników. Stosowany wówczas gdy obiekt może zostać skomentowany i oceniony wielokrotnie.

Przykład kodu przed dodaniem mikroformatów:
<div> L’Amourita Pizza 9 out of 10, based on 24 ratings. 5 user reviews. </div>
Przykład kodu po dodaniu mikroformatów:
<div class="hreview-aggregate"> <span class="item"> <span class="fn">L’Amourita Pizza</span> </span> <span class="rating"> <span class="average">9</span> out of <span class="best">10</span> </span> based on <span class="votes">24</span> ratings. <span class="count">5</span> user reviews. </div>
| Element | Opis |
| itemreviewed (item) | Obiekt podlegający komentowaniu, może zawierać nazwę (fn). |
| rating | Ocena obiektu (np. 4). Jeśli skala ocen na naszej stronie nie mieści się pomiędzy 1-5, wówczas należy oceną przeskalować do odpowiedniej postaci. 5 - ocena najlepsza; 1- ocena najgorsza |
| count | Ilość komentarzy obiektu. |
| votes | Ilość Użytkowników, którzy ocenili obiekt, nie dodając komentarza. |
| summary | Krótki opis/podsumowanie komentarzy do obiektu. |
Więcej informacji o pozostałych elementach i ich zastosowaniu:
http://www.google.com/support/webmasters/bin/answer.py?answer=146645
- Wizytówka firm (vcard)
Wykorzystywany często w przypadku wizytówek firm przedstawiających dokładne dane danego przedsiębiorstwa. Google może wykorzystać te dane i umieścić je w wynikach wyszukiwania.
Przykład kodu przed dodaniem mikroformatów:
<div> L’Amourita Pizza Located at 123 Main St, Albuquerque, NM. Phone: 206-555-1234 <a href="http://pizza.example.com">http://pizza.example.com</a> </div>
Przykład kodu po dodaniu mikroformatów:
<div class="vcard"> <span class="fn org">L'Amourita Pizza</span> Located at <div class="adr"> <span class="street-address">123 Main St</span>, <span class="locality">Albuquerque</span>, <span class="region">NM</span>. </div> <span class="geo"> <span class="latitude"> <span class="value-title" title="37.774929" /> </span> <span class="longitude"> <span class="value-title" title="-122.419416" /> </span> </span> Phone: <span class="tel">206-555-1234</span> <a href="http://pizza.example.com/" class="url">http://pizza.example.com</a> </div>
| Element | Opis |
| name (fn/org) | Nazwa firmy. Powinniśmy użyć zarówno fn, jak i org - oba elementy powinny mieć tą samą wartość. |
| url | Odnośnik do strony firmowej. |
| address (adr) | Adres siedziby firmy, może zawierać elementy: sreet-address, city, region, postal-code oraz country-name. |
| tel | Numer telefonu do firmy. |
| geo | Identyfikuje współrzędne geograficzne miejsca w którym znajduje się firma (pomocne przy generowaniu mapy przy wynikach wyszukiwania). Zawiera dwa elementy: latitude oraz longitude. Opcjonalnie. |
Więcej informacji o pozostałych elementach i ich zastosowaniu:
http://www.google.com/support/webmasters/bin/answer.py?answer=146861
Oprócz wymienionych w artykule, istnieją jeszcze inne zastosowania mikroformatów, jak np. do wyświetlania miniaturki filmu video przy wyniku, czy też wyświetlania zbliżających się wydarzeń kulturalnych/eventów. Jednak artykuł i tak jest długi więc nie ma sensu go jeszcze przedłużać.
Rich Snippet Testing Tool
W celu testowania naszych poczynań, Google udostępniło narzędzie o nazwie „Rich Snippet Testing Tool”, póki co w wersji beta:
http://www.google.com/webmasters/tools/richsnippets
Po wprowadzeniu odpowiednich elementów na swoich stronach, możemy sprawdzić jak to widzi Google i ewentualnie wprowadzić poprawki.
W wersji Beta narzędzie obsługuje jedynie mikroformaty dotyczące profili, recenzji obiektów, wizytówek firm oraz wydarzeń.
Jeśli jesteśmy pewni, że mikroformaty na naszej stronie są odpowiednio zastosowane, możemy zgłosić stronę wyszukiwarce za pomocą formularza znajdującego się pod adresem:
http://www.google.com/support/webmasters/bin/request.py?contact_type=rich_snippets_feedback
Nie mam pojęcia w jakim czasie i czy w ogóle pracownicy Google zwracają na to uwagę, ale uważam, że warto o tym wspomnieć. Ja już czekam kilka tygodni i efektów nie widać (do czego każdy SEO’wiec zdążył się już chyba przyzwyczaić ;)).
Jeśli chcecie poczytać więcej o mikroformatach oraz o Rich Snippets to polecam dwa adresy:
http://www.google.com/support/webmasters/bin/answer.py?answer=146897
rozrywka na wiele godzin zapewniona ;)