Meta tagi
Meta tagi są specjalnymi znacznikami umieszczanymi w sekcji <head> strony internetowej. Według słownikowej definicji służą głównie do szeroko rozumianego opisu zawartości strony.
Ich rola w procesie pozycjonowania jest bardzo znacząca.
Dlaczego odpowiednio zoptymalizowane meta tagi są tak ważne?
Na początek warto przybliżyć kilka najważniejszych faktów dotyczących meta tagów i ich roli na stronie internetowej. Otóż meta tagi, w zależności od ich rodzaju, mogą służyć chociażby do tego, żeby:
- Przekazywać robotom wyszukiwarki najważniejsze informacje dotyczące danej strony internetowej.
- Zachęcać użytkowników do wejścia na daną stronę.
- Odpowiadać za wygląd naszych treści w mediach społecznościowych oraz na ekranach urządzeń mobilnych.
Oczywiście zastosowań meta tagów jest więcej. Nas jednak interesuje rola tego typu znaczników w kontekście pozycjonowania oraz szeroko rozumianej czytelności strony. Najłatwiej można to wytłumaczyć na konkretnych przykładach.
Meta tagi a SEO
Przyjrzyjmy się przykładowej, bardzo uproszczonej sekcji <head> w jednym z tekstów, który mógłby kiedyś znaleźć się na naszym blogu, a następnie zajmijmy się poszczególnymi meta tagami. Podkreślmy jeszcze raz – jest to przykład, który służy wyłącznie jako ilustracja niniejszego zagadnienia. W rzeczywistości ten element strony jest zazwyczaj bez porównania bardziej rozbudowany.
<head>
<meta charset=”utf-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=5″ />
<title>Najlepsze książki o pozycjonowaniu | DevaGroup</title>
<meta name=”Description” content=”Nasi eksperci stworzyli dla Was ranking 10 najlepszych książek o SEO. Zapraszamy do lektury!”>
<meta name=”keywords” content=”książki o SEO, najlepsze książki o SEO, książki o SEO ranking”>
<meta name=”google-site-verification” content=”+nxGUDJ4QpAZ5l9BsjdiiUH67YTa1AIh5d1Nl239000OI1iHs34=”/>
<meta name=”author” content=”Zespół DevaGroup”>
<meta name =”copyright” content=”DEVAGROUP Spółka z ograniczoną odpowiedzialnością spółka komandytowa”>
<meta name=”robots” content=”noindex,nofollow”>
<meta property=”og:locale” content=”pl_PL” />
<meta property=”og:type” content=”article” />
<meta property=”og:title” content=”Najlepsze książki o pozycjonowaniu | DevaGroup” />
<meta property=”og:description” content=”Nasi eksperci stworzyli dla Was zestawienie 10 najlepszych książek o SEO. Zapraszamy do lektury!” />
<meta property=”og:image” content=”https://www.devagroup.pl/blog/wp-content/uploads/2020/12/ksiazki-6.jpg”>
<meta property=”og:url” content=”https://www.devagroup.pl/blog/ksiazki-o-pozycjonowaniu” />
</head>
Zacznijmy od początku.
<meta charset=”utf-8″>
Informacja dotycząca zestawu znaków (liter, znaków specjalnych) używanych w dokumencie. Jeżeli nasza strona jest po polsku – po prostu wstawmy ten zapis.
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=5″ />
Informacja dotycząca tego, jak dana strona będzie się wyświetlać na urządzeniach mobilnych. Innymi słowy znacznik ten pomaga ustalić opcje skalowania obrazu wyświetlanego na ekranach smartfonów czy tabletów. W powyższym przypadku:
- width=device-width – oznacza, że szerokość wyświetlanego obrazu zależy od szerokości ekranu urządzenia;
- initial-scale=1 – domyślne przybliżenie po uruchomieniu strony na urządzeniu. W tym przypadku przybliżenia nie ma, strona wyświetla się bez skalowania;
- maximum-scale=5 – maksymalne możliwe przybliżenie.
Oczywiście powyższe ustawienia nie są uniwersalne, chociaż są dosyć często spotykane. Generalnie każda strona powinna posiadać własne parametry wyświetlania zawartości na urządzeniach mobilnych, zależne chociażby od jej zawartości czy tego, jak jest ostylowana.
<title>Najlepsze książki o pozycjonowaniu | DevaGroup</title>
Meta title to jeden z najważniejszych znaczników znajdujących się w sekcji <head>. To po prostu tytuł strony, który może wyświetlić się użytkownikom przynajmniej w trzech miejscach:
- w wynikach wyszukiwania, jako największy klikalny odnośnik, który doprowadzi nas do strony docelowej,
- w nazwie strony dodanej do folderu z zakładkami,
- w belce otwartej strony na karcie w górnej części przeglądarki.
Treść znacznika meta title może być również widoczna na samej stronie, na przykład w którymś z nagłówków. Obydwa te elementy nie są jednak w żaden sposób ze sobą powiązane i żeby tak się stało, tekst należy ręcznie skopiować (ze znacznika do nagłówka lub w drugą stronę).
Łatwo zatem zauważyć, że zawartość meta title może zdecydować o tym, czy dany użytkownik kliknie w otrzymany wynik wyszukiwania. Dlatego aby zwiększyć prawdopodobieństwo interakcji, należy dokonać optymalizacji meta tytułu strony.
- Najpierw jego długość. Przyjmuje się, że 70 znaków to maksimum, ale czasami warto przetestować większą liczbę znaków, a nie trzymać się kurczowo limitu. Poza tym liczy się szerokość tytułu w pikselach, a nie jego długość w znakach. Przyjmuje się, że 580 pikseli to wartość maksymalna. Jeżeli nie wiemy, jaką szerokość w oknie przeglądarki ma realnie 580 pikseli, po prostu przetestujmy naszą propozycję tytułu. Ewentualnie skorzystajmy z darmowego narzędzia, które nam w tym pomoże, takiego jak chociażby https://blog.spotibo.com/serp-preview-tool/.
- Umieśćmy w tytule słowo kluczowe, na które pozycjonujemy daną podstronę. Całość powinna wyglądać naturalnie i być możliwie zbliżona do zapytań wpisywanych w wyszukiwarce przez internautów. Na końcu tytułu powinna znaleźć się informacja o marce, do której należy strona.
- Tytuły na pozycjonowanych podstronach powinny być unikalne, muszą również odpowiadać znaczeniowo treści, która jest na nich opublikowana.
- Do tego standardowe elementy dobrej reklamy w internecie: zwięzły styl, język korzyści, a jeżeli istnieje taka możliwość, również delikatne CTA.
Oddaj swoją stronę w ręce ekspertów
<meta name=”Description” content=”Nasi eksperci stworzyli dla Was zestawienie 10 najlepszych książek o SEO. Zapraszamy do lektury!”>
Meta description, czyli meta opis, to po prostu krótki opis strony i niewielkie podsumowanie jej zawartości. Znajdziemy go wyłącznie w jednym miejscu, ale za to niezwykle ważnym – tuż pod tytułem w wynikach wyszukiwania. Jeżeli nie stworzymy opisu samodzielnie, Google stworzy go za nas, wybierając początkowy fragment tekstu znajdującego się na stronie. Dlatego warto poświęcić chwilę i zoptymalizować opisy na pozycjonowanych zakładkach. Oto kilka sugestii dotyczących tego, jak należy to robić.
- Długość opisu powinna wynosić około 150 znaków, jeżeli jednak koncentrujemy się także na użytkownikach urządzeń mobilnych, wówczas raczej nie powinniśmy przekraczać 110 znaków. Najlepiej nie przekraczać szerokości 680 pikseli. Jeżeli nie wiemy, ile to jest – testujmy lub skorzystajmy z darmowych narzędzi, takich jak wyżej wspomniany Google search results preview tool.
- Podobnie jak w przypadku tytułu, tak i tutaj wstawiamy odpowiednią frazę kluczową.
- Opis powinien być unikalny. A jako że może być znacznie dłuższy, niż tytuł, spróbujmy z jego pomocą zachęcić użytkownika do odwiedzenia naszej witryny.
- Do tego warto pamiętać o języku korzyści. Zachęta w formie delikatnej perswazji może sprawić, że użytkownicy chętniej wejdą na naszą stronę.
<meta name=”keywords” content=”książki o SEO, najlepsze książki o SEO, książki o SEO ranking”>
Jak łatwo zauważyć, w tym meta tagu znajdują się najważniejsze frazy, na które pozycjonujemy daną witrynę. Kłopot w tym, że obecnie meta keywords nie ma żadnego wpływu na pozycję strony w wynikach wyszukiwania, a już na pewno dla meta robots Google. Podobno algorytmy takich wyszukiwarek, jak Bing czy Yandex, wciąż zwracają uwagę na tę część kodu w sekcji <head>, ale w marginalnym stopniu. Innymi słowy – można wstawić, ale generalnie nie ma takiej konieczności.
<meta name=”google-site-verification” content=”+nxGUDJ4QpAZ5l9BsjdiiUH67YTa1AIh5d1Nl239000OI1iHs34=”/>
Tag meta zawierający kod weryfikacyjny do narzędzia Google Search Console. Umieszczenie odpowiedniego kodu w nagłówku strony sprawi, że będziemy mieli dostęp do wszystkich funkcjonalności Google Search Console związanych z naszą witryną.
<meta name=”author” content=”Zespół DevaGroup”>
<meta name =”copyright” content=”DEVAGROUP Spółka z ograniczoną odpowiedzialnością spółka komandytowa”>
Dwa SEO meta tags o oczywistym zastosowaniu. Meta author wskazuje autora danej strony lub też ostatnią osobę, która jako ostatnia edytowała content na stronie. Drugi meta tag pozwala sprawdzić, do kogo należą prawa autorskie dotyczące danej witryny. Obydwa powyższe fragmenty kodu są opcjonalne, ale jeżeli istnieje taka możliwość – na przykład w przypadku bloga lub strony domowej – warto umieścić je w nagłówku.
<meta name=”robots” content=”noindex,nofollow”>
Bardzo ważny meta znacznik, zawierający instrukcje dla robotów Google oraz innych wyszukiwarek. Jest to wbrew pozorom dość skomplikowane zagadnienie, które z pewnością zasługuje na osobny wpis. Dlatego w tym miejscu jedynie zasygnalizujemy kilka najważniejszych kwestii związanych z tym meta tagiem.
W największym uproszczeniu służy on do instruowania robotów indeksujących o tym, jak mają się zachować na danej stronie internetowej. W tym przypadku wartości atrybutu name=”robots” wskazują, że roboty nie będą indeksować strony (noindex), zaś wszelkie linki wychodzące z tej strony będą w zasadzie ignorowane (nofollow). Oczywiście z punktu widzenia SEO takie działanie jest bardzo niewskazane (przypominamy, to tylko przykład!), dlatego domyślne wartości to zawsze „index” oraz „follow„. Tak naprawdę jedyną sytuacją, gdy noindex i nofollow są wskazane, jest budowa strony i testowanie jej działania. W przeciwnym wypadku lepiej nie ryzykować z tymi meta tags.
Meta tagi OG, przeznaczone dla mediów społecznościowych
Na koniec należy także wspomnieć o protokole OG, czyli Open Graph. Jego celem jest integracja danej strony internetowej z mediami społecznościowymi, takimi jak chociażby Facebook czy LinkedIn. Jest to bardzo przydatne narzędzie, znacznie ułatwiające komunikację pomiędzy naszą witryną a social mediami. Dzięki niemu mamy kontrolę nad tym, jak wyświetlają się posty na facebookowym czy linkedinowym wallu naszej strony.
Przyjrzyjmy się najważniejszym meta tagom związanym z Open Graph, których przykłady zaprezentowaliśmy wcześniej w niniejszym artykule:
- <meta property=”og:locale” content=”pl_PL” /> – informacja o języku użytym na stronie.
- <meta property=”og:type” content=”article” /> – w tym miejscu definiujemy rodzaj treści, którą chcemy udostępnić. W naszym przypadku jest to artykuł, ale może również być zdjęcie, film, plik dźwiękowy, witryna internetowa itp.
- <meta property=”og:title” content=”Najlepsze książki o pozycjonowaniu | DevaGroup” /> – nagłówek opublikowanego postu. Pełni funkcję analogiczną do tej znanej z meta tagu <title>. Jeżeli nie stworzymy unikatowego tytułu na social media, w tym miejscu znajdzie się zawartość tagu <title> z sekcji <head>.
- <meta property=”og:description” content=”Nasi eksperci stworzyli dla Was zestawienie 10 najlepszych książek o SEO. Zapraszamy do lektury!” /> – opis znajdujący się poniżej nagłówka postu. Jeśli nie chcemy tworzyć unikatowego, w tym miejscu pojawi się opis z meta name Description.
- <meta property=”og:image” content=”https://www.devagroup.pl/blog/wp-content/uploads/2020/12/ksiazki-6.jpg”> – adres grafiki postu. Warto własnoręcznie wybrać wyświetlany obrazek. W przeciwnym wypadku Facebook samodzielnie wybierze grafikę z podlinkowanej strony.
- <meta property=”og:url” content=”https://www.devagroup.pl/blog/ksiazki-o-pozycjonowaniu” /> – link do strony docelowej, którą chcemy udostępnić.
Łatwo zauważyć, że metadane html oraz inne meta informacje znajdujące się w nagłówku, mogą mieć ogromny wpływ na pozycjonowanie strony i jej wysoką pozycję w wynikach wyszukiwania. Te kilka linijek niezbyt trudnego kodu może w zasadzie decydować o tym, czy nasza witryna w ogóle wyświetli się na ekranach urządzeń potencjalnych klientów.
« Wróć do słownika pojęć SEO/SEM/e-marketing
