Odkaz na stejnou stránku se na Facebooku a na síti X může zobrazit úplně jinak, jednou s velkým obrázkem a poutavým titulkem, podruhé jako holý text bez náhledu. Kontrola open graph a twitter cards na stránce ověří, jestli má web pro obě sítě připravené správné podklady, nebo jestli se spoléhá jen na to, co si sociální síť sama domyslí z obsahu stránky. Rychlé ověření vlastního webu nabízí tento test. Tento text navazuje na dřívější rozbor open graph značek a zaměřuje se hlavně na to, čím se od nich twitter cards liší a kdy se řeší samostatně.
Co kontrola open graph a twitter cards na stránce prověřuje
Kontrola ověří přítomnost tří základních open graph značek, tedy og:title, og:description a og:image, a k tomu i to, jestli stránka obsahuje samostatné značky s prefixem twitter, které si sdílený odkaz na síti X může vyžádat místo těch obecných. Pokud některá ze základních značek chybí, sociální síť se snaží obsah odhadnout sama z nadpisu, prvního odstavce či prvního nalezeného obrázku, výsledek pak u sdíleného odkazu často vypadá nedbale.
Proč se twitter cards řeší jako samostatná vrstva
Síť X umí ze základních open graph značek vycházet, jenže vlastní twitter značky jí dávají přesnější kontrolu nad typem karty i nad tím, jaký obrázek se zobrazí. Bez nich karta funguje jen na základě odhadu ze stejných dat, která vidí i Facebook, a odkaz tak nemusí na obou sítích vypadat stejně dobře. Právě tenhle rozdíl je důvod, proč se kontrola twitter cards vyplatí provádět odděleně od obecné kontroly open graph značek.
Twitter card jako nezbytný základ
Ze všech twitter značek je jen jedna skutečně nezbytná, a to twitter:card, která určuje typ zobrazené karty. Nejběžnější jsou dvě hodnoty:
- summary pro kartu s malým čtvercovým náhledovým obrázkem vedle titulku a popisku.
- summary_large_image pro kartu s velkým obrázkem nad titulkem, která na časové ose zabírá výrazně víc prostoru.
Vedle těchto dvou běžných hodnot existují ještě typy app pro odkaz vedoucí do mobilní aplikace a player pro vložené video či audio, běžný web ale ve většině případů vystačí se summary nebo se summary_large_image. Bez uvedené hodnoty twitter:card síť X kartu vůbec nesestaví a odkaz zůstane bez náhledu, i kdyby zbytek open graph značek byl vyplněný správně.
Twitter title, description a image jako doplněk k open graph
Značky twitter:title, twitter:description a twitter:image nejsou povinné, protože pokud chybí, síť X automaticky použije hodnoty z og:title, og:description a og:image. Doplnit je má smysl tam, kde chce mít web pro síť X jiný, třeba stručnější titulek nebo jiný obrázek než pro Facebook. U většiny běžných webů proto stačí vyplnit jen twitter:card a zbytek nechat na fallbacku z open graph značek.
Rozdílné rozměry obrázku pro X a pro Facebook
Facebook doporučuje pro og:image poměr stran 1,91 ku 1, zatímco síť X pracuje spíš s poměrem 2 ku 1 a snese i výrazně větší rozlišení, minimálně kolem 300 na 157 pixelů. Stejný obrázek proto na obou sítích nevypadá úplně identicky, na X bývá mírně oříznutý nahoře a dole. Horní hranice je u sítě X naopak dost vysoká, obrázek smí mít až 4096 na 4096 pixelů a velikost do 5 megabajtů, takže praktickým omezením bývá spíš minimální rozměr než ten maximální. Web, který chce mít náhled optimální na obou platformách, lze doplnit o samostatnou značku twitter:image s obrázkem upraveným přesně pro poměr stran sítě X, místo aby spoléhal na automatický ořez toho stejného obrázku, který se použije pro og:image.
Co doplňuje předchozí rozbor open graph značek
Nastavení základních značek og:title, og:description a hlavně og:image, včetně doporučených rozměrů kolem 1200 na 630 pixelů a nutnosti vyčistit mezipaměť po každé úpravě, popisuje tento dřívější text o kontrole open graph podrobně. Tahle kontrola na něj navazuje jen v jedné konkrétní věci, totiž v tom, jestli stránka počítá i se sítí X jako s platformou, která si žádá vlastní sadu značek, ne jen převzetí hodnot určených původně pro Facebook.
Jak výsledek ověřit před sdílením
Nejjednodušší způsob, jak zjistit, jak bude odkaz na síti X vypadat, je vložit adresu stránky do validačního nástroje ještě předtím, než se stránka skutečně sdílí. Výsledek se přitom u obou sítí ukládá do mezipaměti, takže po jakékoli úpravě značek je potřeba načtení vynutit znovu, jinak se dál zobrazuje starší, už neplatná verze náhledu.
Nejčastější chyby v praxi
V praxi se u open graph a twitter cards opakuje několik podobných problémů:
- Chybějící twitter:card, kvůli které síť X sestaví náhled jen z odhadu bez jistoty výsledku.
- Obrázek připravený jen pro poměr stran Facebooku, který se na síti X viditelně ořízne.
- Zapomenuté vyčištění mezipaměti po úpravě značek, takže se dál zobrazuje starší náhled.
- Twitter značky zkopírované z jiné stránky webu, takže odkaz na síti X ukazuje jiný titulek než ten skutečný.
Co si z této kontroly odnést
Otevřený graf řeší, jak stránka vypadá při sdílení na většině sociálních sítí, twitter card k tomu přidává jednu vrstvu navíc pro síť X, která si umí vzít vlastní titulek, popisek i obrázek, jak podrobně rozebírá i tento materiál o rozdílu mezi open graph a twitter cards. Doplnění chybějící twitter:card a ověření obrázku pro oba poměry stran patří mezi úpravy, které zabere jen pár minut, dopad na vzhled sdíleného odkazu je ale okamžitý.
Máte na svém webu nastavenou twitter:card, nebo se sdílený odkaz na síti X zatím spoléhá jen na to, co si síť domyslí sama?
- Kontrola open graph a twitter cards na stránce, která rozhoduje o vzhledu odkazu při sdílení - 30 července, 2026
- Komprese obrázků online, po které soubor zhubne, ale oko rozdíl nepozná - 29 července, 2026
- Byty k pronájmu v Liberci zdražují. Proč činže rostou a kdy se situace konečně zlepší? - 24 ledna, 2025
