Dane strukturalne – jak i dlaczego warto wdrożyć

Dane strukturalne to obecnie „must have” nie tylko dla sklepów internetowych. Dowiedz się dlaczego warto zaimplementować dane strukturalne. Jak gwiazdki i inne elementy wpływają na zachowanie użytkowników Google. Poznaj korzyści i narzędzia, z których warto korzystać. Przekonaj się dlaczego i w jakich przypadkach Google używa schematów danych.

GlobKurier.pl

 Sławek Czajkowski – W branży od ponad 11 lat. Pasjonat, który w świecie marketingu internetowego czuje się jak u siebie w domu. Właściciel agencji Kampanie SEO oraz CEO w projekcie Surfer. Fan nieszablonowych i skutecznych rozwiązań. 

Zacznijmy od definicji, czyli czym są dane strukturalne

Dane strukturalne – specjalne fragmenty kodu służące do zdefiniowania, oznaczenia i uporządkowania informacji znajdujących się na stronie internetowej. Pozwalają wyszukiwarkom internetowym lepiej zrozumieć treść i interpretować rodzaj contentu.

Umożliwiają wyświetlanie pobranych, dodatkowych informacji bezpośrednio w wynikach wyszukiwania Google (na przykład gwiazdki). Najpopularniejsze formaty danych strukturalnych to: JSON-LD oraz Microdata.

Dlaczego Google korzysta z danych?

Celem jest zapewnienie satysfakcji użytkownika, który według Google, w wielu przypadkach nie jest usatysfakcjonowany wynikami zawierającymi jedynie linki do odpowiedzi na zapytanie, czyli wyszukaną frazę. Wyciągnięcie pojedynczych elementów ze struktury danych strony internetowej umożliwia wyświetlenie złożonego wyniku i udzielenie bardziej kompleksowej odpowiedzi bezpośrednio w SERP (Search Engine Result Page) w przejrzystej formie. 

Takie podejście wydaje się uzasadnione, szczególnie kiedy weźmiemy pod uwagę, że dla użytkownika liczy się czas. Im szybciej znajdzie to czego szuka – tym lepiej. Na podstawie testów oraz analizy zachowań, silnik Google (oraz innych wyszukiwarek internetowych) wybiera i wyświetla w wynikach takie struktury danych, które wpływają pozytywnie na doświadczenia użytkowników i pomagają szybciej znaleźć szukaną informację.

Typy contentu, które możemy strukturyzować

Mamy do dyspozycji mnóstwo typów danych strukturalnych, które możemy stosować dla treści i grafik umieszczonych na stronach internetowych. Przykłady typów contentu, dla których stosujemy uporządkowane struktury:

• Artykuł
• Produkt
• Książka
• Kurs
• Event
• Oferty pracy
• Stanowisko pracy
• Media
• Podcast
• Przepis kulinarny
• Aplikacja
• Video
• Opinie
• Firma lokalna
• i inne

Wszystkie dostępne rodzaje znajdziecie pod adresem https://developers.google.com/search/docs/guides/search-features

Korzyści wynikające z implementacji danych strukturalnych

Poniżej przykład dotyczący dużego portalu z recenzjami filmów, który po wdrożeniu danych strukturalnych na ponad stu tysiącach podstron odnotował niezłe efekty w postaci poprawienia współczynnika CTR (Click Through Rate).

Przykład został zaprezentowany na konferencji Google I/O ’17, można założyć, że dane są wiarygodne.

Kiedy Google wyświetli dodatkowe informacje

Nie zawsze umieszczenie danych strukturalnych skutkuje pojawieniem się dodatkowych informacji w wynikach wyszukiwania. Aby dane zostały wyświetlone muszą zajść dwa warunki:

• Zaufanie do witryny – na jednym z ostatnich hangoutów John Mueller potwierdził, że ten czynnik jest kluczowy
• Przydatność dla użytkownika – wdrożenie danych, które nie są odpowiednie dla danego wyniku wyszukiwania i nie są wartościowe dla użytkownika to strata czasu.

Warto zwrócić uwagę na poprawność wdrożonego kodu. Zdarza się, że dane są umieszczone niepoprawnie lub niespójne.

Jak sprawdzić czy dane są wartościowe dla Google (oraz użytkownika)

Podzielę się swoim sposobem. Używam w tym celu Surfera – https://surferseo.com – mając dostęp do wersji beta jestem w nieco uprzywilejowanej sytuacji, ponieważ na pierwszy rzut oka widzę:

• jakie struktury danych są wdrożone u konkurentów,
• jakie są wyświetlane w Google,
• które dane powinniśmy wdrożyć,
• a także, które witryny cieszą się zaufaniem Google, a które wręcz przeciwnie (dane zaimplementowane i nie wyświetlane).

Wrzucę screen z wersji beta, do której dostęp jest jeszcze ograniczony, ale wkrótce funkcja będzie dostępna dla wszystkich użytkowników:

Dane strukturalne w wynikach wyszukiwania – w praktyce

Struktury danych wspierają sprawną komunikację pomiędzy silnikiem wyszukiwarki a stroną internetową. Efektem komunikacji są atrakcyjnie wyglądające wyniki wyszukiwania. Co ciekawe, aby wdrożyć dane strukturalne, nie zawsze wymagana jest wiedza z zakresu kodowania, do czego obiecuję wrócić w dalszej części.

Przykład 1: „Przepis sernik”

Dla wszystkich powyższych wyników wyszukiwania widać dwa typy danych wyciągnięte ze zdefiniowanej struktury, czyli:

• Rating – ocena
• Picture – zdjęcie, którego dotyczy przepis

Implementacja danych w kodzie strony:

Przykład 2: „Pozycjonowanie stron”

Zastosowane dane strukturalne:

• Rating – ocena
• BreadcrumbList – przyjazna struktura menu zamiast adresu URL
• WebSite
• Service

W przypadku frazy pozycjonowanie stron i podstrony https://www.kampanieseo.pl/pozycjonowanie-cennik Google „wyciąga” do wyników wyszukiwania dwa pierwsze elementy, które uznaje za właściwe i wartościowe dla użytkownika.

Implementacja danych strukturalnych w kodzie:

Przykład 3: „OBI”

Zastosowane dane strukturalne:

• Organization
• CheckoutPage
• WebSite

W przypadku frazy „OBI” Google wyświetla w wynikach wyszukiwania elementy z obrębu struktury „Organization”.

Implementacja danych strukturalnych w kodzie:

Wdrożenie bez znajomości kodu

Aby wdrożyć struktury danych, dzięki którym komunikacja pomiędzy witryną a wyszukiwarką stanie się bardziej efektywna, nie jest wymagana znajomość kodu. W przypadku, kiedy Wasz sklep internetowy, blog lub inny rodzaj strony firmowej oparty jest o popularne rozwiązanie CMS jak: WordPress, Presta, Joomla, Magento, OpenCart, OScommerce – możemy skorzystać z gotowych i intuicyjnych rozwiązań w postaci wtyczek. 

Z uwagi na popularność WordPress podam kilka przykładów wtyczek oraz pokażę jak poprawnie zaimplementować popularne rozwiązania na własnej stronie. Istnieje sporo darmowych rozwiązań, które niekoniecznie są perfekcyjne, ale spełniają swoją rolę i zaspokajają potrzeby w przypadku 80% instalacji WP. Warto dodać, że posiadając wiedzę programistyczną możesz wdrożyć rich snippets bez instalacji dodatkowych wtyczek, na zasadzie edycji kodu.

Przykłady popularnych rozwiązań

Na potrzeby artykułu przeprowadziłem małą ankietę odnośnie stosowanych rozwiązań przez osoby z mojego zespołu, które na co dzień pracują z WordPressem i innymi systemami CMS.

Najpopularniejszym rozwiązaniem okazało się ręczne umieszczanie kodu w plikach szablonu, ale mimo wszystko często przewijały się dwa rozwiązania:

• kk Star Ratings – wtyczka używana do implementacji ocen (gwiazdki)
• Yoast SEO – wtyczka wspierająca implementację bread crumbs (adres w przyjaznej formie)

Wdrożenie danych strukturalnych do WordPress z kk Star Ratings – gwiazdki (krok po kroku)

Zwróciłem się do Wojtka Jakieły (WordPress Ninja w Kampanie SEO), aby pokazał krok po kroku jak należy umieścić i skonfigurować gwiazdki, aby struktura danych była poprawna i wiarygodna dla Google.

1. Do kopii WordPress’a należy doinstalować wtyczkę o nazwie kk Star Ratings. Znajdziemy ją i zainstalujemy wyszukując powyższą nazwę w zakładce Wtyczki  → Dodaj nową.
2. Po zainstalowaniu dodatku przeprowadzamy podstawową konfigurację. Aby to zrobić przechodzimy do zakładki Settings wchodząc uprzednio w pozycję kk Star Ratings po lewej stronie Panelu Administracyjnego WordPress.

W pierwszej kolejności odblokowujemy działanie wtyczki poprzez zaznaczenie opcji Enable:

3. Następnie wybieramy na których rodzajach podstron chcemy umieścić nasze gwiazdki. Niestety, często zdarza się, że gwiazdki są wyświetlane w nieoptymalnej sekcji podstrony dlatego zalecam wyłączenie poniższych opcji – zajmiemy się tym później.

4. Korzystając z opcji Exclude following category(s) możemy wykluczyć wyświetlanie ocen w wybranych kategoriach wprowadzając w okienko ich ID.

5. Następną pozycją w ustawieniach kk Star Rating jest bardzo istotna opcja Google Rich Snippets. To dzięki niej Google będzie wyświetlało oceny podstron w wynikach wyszukiwania.

6. Możemy również skonfigurować wtyczkę tak, aby umożliwiała głosowanie tylko i wyłącznie unikalnym adresom IP – rekomenduję takie rozwiązanie.

7. Dodatkowo mamy możliwość ustawienia Clear Line dla wtyczki. Czasami będziemy zmuszeni jej użyć, szczególnie kiedy szablon nie do końca będzie chciał współpracować z kk Star Ratings.

8. Jednym z ważniejszych elementów jest ustawienie informacji jakie mają być wyświetlane przy ocenach na naszych podstronach. Używając zmiennych możemy wyświetlić np. informację o ilości ocen, ich wartości czy średniej ocenie podstrony.

9. Możemy również lekko dostosować wygląd ocen poprzez ustawienie ich położenia oraz szybkości wypełniania gwiazdek.

10. Warto również zamienić oryginalne angielskie komunikaty by odwiedzający stronę widzieli je w rodzimym języku.

11. Jeśli nie podobają się nam oryginalne kolory gwiazdek, ich rozmiar czy styl możemy zmienić ich design przechodząc do zakładki Stars. Możemy zmienić tutaj ilość gwiazdek (np. 5), wysokość ich szerokość, a także pliki graficzne odpowiadające za poszczególne stany ocen.

12. Zakładka Tooltips umożliwia nam dodatkowo wyświetlenie stosownego tekstu pod gwiazdkami w momencie gdy użytkownik umieści wskaźnik myszy na np. 5 gwiazdce.

13. Zapisujemy ustawienia klikając SAVE, a następnie w celu implementacji ocen w szablonie w wybranym przez Was miejscu (np. w stopce lub w innym miejscu które uznacie za stosowne) wklejamy kod:
    
    Powyższy kod możemy wkleić zarówno do plików szablonu jak i do Widgetów lub innych miejsc pozwalających na wklejenie kodu.
    
    Jeśli chcemy wdrożyć oceny tylko dla np. dwóch podstron wystarczy że w ich treść wklejamy kod:
    
    [kkstarratings]

Tak wprowadzone kk Star Ratings są poprawnymi danymi Schema, co możecie sprawdzić w narzędziu do testowania danych strukturalnych: https://developers.google.com/search/docs/appearance/structured-data

Wykorzystaj kod rabatowy i zaoszczędź na przesyłce​

Wpisując ten kod rabatowy otrzymasz 7% zniżki na przesyłki krajowe i międzynarodowe. Kod przeznaczony dla indywidualnych użytkowników naszej platformy. Dziel się wiedzą, rozwijaj i wysyłaj taniej z GlobKurier.pl