Kompletny przewodnik po tagach Open Graph
Wszystko, co musisz wiedzieć o tagach OG dla idealnych podglądów w mediach społecznościowych
Wprowadzenie
W erze cyfrowej sposób, w jaki Twoja treść wygląda podczas udostępniania w mediach społecznościowych, może decydować o tym, czy ktoś kliknie, czy przewinie dalej. Tagi Open Graph (OG) to sekret atrakcyjnych podglądów linków. Stworzone przez Facebooka w 2010 roku, stały się standardem kontrolowania wyglądu URL-i przy udostępnianiu online.
Dlaczego tagi OG są ważne
1. Wyższy współczynnik klikalności
Badania pokazują, że linki z bogatymi podglądami otrzymują do 2x więcej zaangażowania niż zwykłe linki tekstowe.
2. Kontrola nad marką
Bez tagów OG platformy zgadują, co wyświetlić. Z tagami OG decydujesz, jaki obraz, tytuł i opis reprezentują Twoją treść.
3. Profesjonalny wygląd
Dobrze sformatowany podgląd linku sygnalizuje jakość i wiarygodność.
4. Spójność między platformami
Tagi OG zapewniają, że Twoja treść wygląda tak samo na Facebooku, LinkedIn, Twitterze czy w komunikatorach.
Pro Tip
Linki z zoptymalizowanymi tagami OG mogą zwiększyć ruch z mediów społecznościowych nawet o 150%.
Tagi specyficzne dla platform
Twitter Cards
Twitter (teraz X) ma własne meta tagi. Choć korzysta z tagów OG, tagi Twittera dają więcej kontroli.
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://example.com/image.png" />LinkedIn używa tagów OG, ale wymaga obrazów o wymiarach co najmniej 1200x627 pikseli.
WhatsApp & Telegram
WhatsApp i Telegram również używają tagów OG, ale agresywnie cachują podglądy.
Najlepsze praktyki
| Platform | Size | Ratio |
|---|---|---|
| 1200 x 630px | 1.91:1 | |
| 1200 x 628px | 1.91:1 | |
| 1200 x 627px | 1.91:1 | |
| 1200 x 630px | 1.91:1 |
- Tytuł: 60-90 znaków (Facebook obcina przy ~88)
- Opis: 150-200 znaków dla pełnego wyświetlenia
- URL: Używaj czytelnych URL-i
Częste błędy do uniknięcia
1. Brak og:image
Obraz przyciąga wzrok. Bez niego link wygląda niekompletnie.
2. Względne URL-e
Zawsze używaj absolutnych URL-i zaczynających się od https://.
3. Złe wymiary obrazu
Zbyt małe obrazy lub zły proporcje mogą być przycinane lub niewyświetlane.
4. Brak testów na różnych platformach
Każda platforma renderuje podglądy inaczej. Zawsze testuj.
5. Ignorowanie cache
Platformy cachują podglądy. Użyj debuggerów po zmianach.
Narzędzia do testowania
Przed publikacją zweryfikuj tagi OG za pomocą oficjalnych narzędzi:
Często zadawane pytania
Czym są tagi Open Graph?
Meta tagi kontrolujące wygląd URL przy udostępnianiu w mediach społecznościowych, definiujące tytuł, opis i obraz.
Dlaczego mój og:image się nie wyświetla?
Częste problemy: obraz za mały (min 200x200px), względny URL, plik za duży (max 8MB), lub stara wersja w cache.
Czy mogę użyć SVG jako og:image?
Nie, Facebook i większość platform nie obsługuje SVG. Użyj PNG lub JPEG.