O tym narzędziu
Tagi Open Graph (OG) kontrolują sposób wyświetlania strony udostępnianej na platformach społecznościowych. Facebook, LinkedIn, Slack, Discord i wiele innych czytają tagi OG w celu tworzenia kart podglądu. Bez odpowiednich tagów OG udostępnione linki wyglądają na uszkodzone — ogólne ikony ulubionych, brakujące obrazy, obcięte tytuły. Dzięki nim akcje wyglądają na dopracowane, a współczynniki klikalności znacznie się poprawiają.
Standardowe tagi OG: og:title (tytuł pokazany w podglądzie), og:description (fragment tekstu), og:image (obraz podglądu, najlepiej 1200×630), og:url (kanoniczny adres URL), og:type (zwykle „strona internetowa” lub „artykuł”). Warstwa tagów kart Twittera na górze: twitter:karta, twitter:tytuł, twitter:opis, twitter:obraz. Większość narzędzi wraca do OG, gdy brakuje tagów specyficznych dla Twittera.
Ten generator generuje kompletny zestaw tagów OG i Twitter Card na podstawie Twoich danych wejściowych. Wklej wynikowy kod HTML do <head> strony. Rezultatem jest prawidłowe renderowanie podglądu na wszystkich głównych platformach społecznościowych.
Dlaczego warto korzystać z generatora tagów OG
Strony bez tagów OG wyglądają źle po udostępnieniu. Pusty obraz, ogólny tytuł, brak opisu — podgląd słabo konkuruje z prawidłowo otagowanymi stronami w kanałach. W przypadku content marketingu i udostępniania linków ma to bezpośredni wpływ na współczynnik klikalności.
Odręczne pisanie tagów OG jest powtarzalne. Każda strona potrzebuje własnego zestawu. Generator generujący poprawne tagi na podstawie kilku danych wejściowych pozwala uniknąć literówek i pominiętych właściwości, które zakłócają podglądy w mediach społecznościowych.
Szczegóły techniczne
Tagi OG używają atrybutu meta właściwości (nie nazwy): <meta property="og:title" content="..." />. Atrybut właściwości jest wymagany dla OG; niektóre parsery akceptują nazwę jako rezerwę, ale właściwość jest poprawna.
Wymagania dotyczące obrazu: 1200 × 630 pikseli do renderowania siatkówki, współczynnik proporcji 1,91:1. Tagi og:image:width i og:image:height pomagają platformom poprawnie buforować obrazy. og:image:alt udostępnia tekst dotyczący dostępności.
Tagi kart Twittera wykorzystują atrybut nazwy: <meta name="twitter:title" content="..." />. Twitter powraca do tagów OG, gdy nie ma specyficznych dla Twittera, dlatego często wystarczy dobrze ustawiony OG. Dodanie twitter:card jawnie wybiera typ karty (najczęściej jest to summary_large_image).
Często zadawane pytania
- Czy mogę dostosować wygenerowane dane wyjściowe?
- Tak. Narzędzie zapewnia różne opcje dostosowywania, aby dostosować wydruk do konkretnych potrzeb. Dostosuj ustawienia przed wygenerowaniem lub wygeneruj ponownie, korzystając z różnych opcji.
- Czy wygenerowane treści są bezpłatne?
- Tak. Wszystko, co wygenerujesz za pomocą tego narzędzia, jest Twoją własnością i możesz z niego korzystać w celach osobistych, edukacyjnych lub komercyjnych, bez żadnych ograniczeń i wymagań dotyczących autorstwa.
- Czy to wymaga konta?
- Nie. Narzędzie jest gotowe do użycia od razu, bez rejestracji, bez e-maila i bez rejestracji. Wystarczy otworzyć stronę i rozpocząć generowanie.
- Czy moje dane wejściowe są poufne?
- Tak. Całe przetwarzanie odbywa się w Twojej przeglądarce. Twoje dane wejściowe i wygenerowane dane wyjściowe nigdy nie są wysyłane do żadnego serwera zewnętrznego.
- Czy mogę użyć tego samego obrazu OG na każdej stronie?
- Możliwe, ale nieoptymalne. Obrazy specyficzne dla strony są pod względem klikalności lepsze od ogólnych obrazów obejmujących całą witrynę. Użyj wartości domyślnej jako rezerwowej, ale twórz obrazy na stronę dla ważnych treści.
- Czy wymagana jest deklaracja wymiarów obrazu?
- Pomocne, ale nie wymagane. og:image:width i og:image:height pozwalają platformom buforować obrazy bez ponownego pobierania w celu określenia wymiarów. Przyspiesza kolejne akcje.
- Czy moje dane zostały przesłane?
- Nie. Generowanie odbywa się w Twojej przeglądarce.
- Jak przetestować tagi OG?
- Debuger udostępniania na Facebooku, moduł sprawdzania poprawności kart Twitter i inspektor postów LinkedIn pobierają i sprawdzają. Użyj ich po wdrożeniu nowych tagów OG.