Jak podrasować logo, czyli główny odnośnik strony?

Logo na stronie jest jednym z jej najważniejszych elementów. Trudno znaleźć witrynę, która by go nie miała. Jednak bardzo często jest ono niewłaściwie umieszczone pod względem optymalizacji dla wyszukiwarek lub gdy chcemy zwiększyć znaczenie tego głównego odnośnika, jesteśmy zmuszeni do posuwania się do niezalecanych przez Google metod.

Niewykorzystanie potencjału SEO loga, prowadzi w konsekwencji do utraty pewnej części ruchu na stronie – może nie jest ona tak duża, lecz po co tracić tych odbiorców. Na podstawie własnych badań powiem, że jest to do ok. 7% zapytań zawierających istotną dla nas frazę lub jej synonimy.

Częstym i licznie powielanym błędem jest umieszczenie loga, jako tła odnośnika – tworzymy wtedy pusty link, nie zawierający żadnej konkretnej treści. Zdarza się również, że osoby bardziej zaznajomione z pojęciem optymalizacji stron dla wyszukiwarek, do tak stworzonego odnośnika dodają tekst, który jest ukryty przed osobami odwiedzającymi – takie rozwiązanie jest akceptowane przez Google, o ile treść zawarta w pliku graficznym zgadza się z ukrytym teksem w kodzie (teoretycznie nie powinno być z tym problemu).

Jak więc można wykorzystać logo – odnośnik na rzecz optymalizacji dla wyszukiwarek? Otóż poniżej znajduje się jeden ze sposobów, który staram się stosować przy optymalizacji stron lub który zalecam do zaimplementowania.

1. Umieszczenie loga na stronie – najstarszym i sprawdzonym sposobem jest umieszczenie pliku graficznego wewnątrz odnośnika. Co prawda plik w postaci tła ładuje się o ułamki sekundy szybciej, jednak wartość takiego rozwiązania jest dużo niższa.

<a href="http://www.xyz.pl/">
   <img src="http://www.xyz.pl/plik-graficzny.png" width="200" height="50"> 
</a>

Pamiętać należy o dodaniu szerokości i długości pliku – jest to często popełniany błąd, który przyczynia się do dłuższego renderowania strony w przeglądarce, gdyż musi ona sama i całkiem niepotrzebnie, określić rozmiary pliku.

2. Atrybut title odnośnika – jest to część odnośnika odpowiedzialna za wyświetlanie jego tytułu/tekstu podpowiedzi po najechaniu na niego, lecz przed kliknięciem w logo.

<a href="http://www.xyz.pl/" title="XYZ, pozycjonowanie i optymalizacja"> 
   <img src="http://www.xyz.pl/plik-graficzny.png" width="200" height="50"> 
</a>

3. Właściwa nazwa pliku – oczywiście nazwa pliku „plik-graficzny.png” nic nie mówi. Warto więc zmienić ją na coś bardziej wartościowego i zrozumiałego dla wyszukiwarki. Dlaczego, otóż Google czyta i analizuję nazwy plików graficznych. Są one czynnikiem, który po części sugeruje zawartość / tematykę grafiki.

<a href="http://www.xyz.pl/" title="XYZ, pozycjonowanie i optymalizacja"> 
   <img src="http://www.xyz.pl/xyz-pozycjonowanie-optymalizacja.png" 
   width="200" height="50"> 
</a>

4. Tekst alternatywny pliku graficznego – kolejnym krokiem jest dodanie atrybutu ALT pliku. Jest to opis obrazka wyświetlany, gdy przeglądarka nie będzie w stanie go wyświetlić. Stanowi również cenne źródło informacji dla wyszukiwarki – dzięki niemu, wyszukiwarka dowiaduje się o tematyce pliku graficznego.

<a href="http://www.xyz.pl/" title="XYZ, pozycjonowanie i optymalizacja"> 
   <img src="http://www.xyz.pl/xyz-pozycjonowanie-optymalizacja.png" 
   width="200" height="50" alt="XYZ, pozycjonowanie i optymalizacja"> 
</a>

5. Tytuł pliku graficznego – ten atrybut, posiada podobne zastosowanie, jak atrybut TITLE odnośnika i stanowi również źródło informacji na temat zawartości pliku graficznego.

<a href="http://www.xyz.pl/" title="XYZ, pozycjonowanie i optymalizacja"> 
   <img src="http://www.xyz.pl/xyz-pozycjonowanie-optymalizacja.png" 
   width="200" height="50" alt="XYZ, pozycjonowanie i optymalizacja" 
   title="XYZ, pozycjonowanie i optymalizacja"> 
</a>

6. Wykorzystanie schematów mikrodanych – tu zalecane jest skorzystanie z odpowiedniego dla Ciebie schematu mikrodanych (Schema.org). Pamiętaj tylko, żeby wybrać właściwy dla siebie, gdyż mówi on wiele wyszukiwarce Google o Twojej działalności – dla tego przykładu wykorzystamy schemat schema.org/ProfessionalService.

<div itemscope itemtype="http://schema.org/ProfessionalService">
   <a itemprop="url" href="http://www.xyz.pl/" title="XYZ, pozycjonowanie 
   i optymalizacja">
      <img itemprop="logo" src="http://www.xyz.pl/xyz-pozycjonowanie-optymalizacja.png"
      width="200" height="50" alt="XYZ, pozycjonowanie i optymalizacja" 
      title="XYZ, pozycjonowanie i optymalizacja">
   </a> 
</div>

7. Dodanie geolokalizacji pliku graficznego – to rozwiązanie przydatne jest dla osób optymalizujących stronę internetową firmy czy instytucji lokalnej. Dzięki niemu zaznaczmy miejsce dla wyszukiwarki Google Mapy. Zwiększa to również szanse na pojawienie się naszego loga właśnie w tym serwisie, lecz nie gwarantuje. Dodatkowo, wzmacniamy sygnał geolokalizacji firmy dla wyszukiwań lokalnych. Konieczne jest stworzenie mapy strony w postaci XML z plikiem/plikami graficznymi, którym chcemy nadać znaczenie lokalne (sitemap-img.xml).

<?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:image="http://www.google.com/schemas/sitemap-image/1.1"> 
 <url>
   <loc>http://www.xyz.pl/</loc> 
   <image:image> 
      <image:loc>http://www.xyz.pl/xyz-pozycjonowanie-optymalizacja.png</image:loc>
      <image:title>XYZ, optymalizacja i pozycjonowanie</image:title>
      <image:caption>Krótki opis tego, co przedstawia plik graficzny</image:caption>
      <image:geo_location>Szczecin, Zachodniopomorskie, PL</image:geo_location>
</image:image> 
</url> 
</urlset>

Poprawna optymalizacja loga strony nie jest może wysoce istotnym czynnikiem decydującym o pozycji strony w Google, jednak musisz pamiętać, że na ranking i wyniki wyszukiwań ma wpływ także kilkaset innych rzeczy na stronie oraz poza nią. Kto wie, może ten będzie decydujący i wystarczający by wyprzedzić konkurencję.