Hodinu píšete příspěvek na LinkedIn, vložíte odkaz a čekáte, až se objeví náhled. Nic. Nebo hůř: zobrazí se špatný obrázek, nadpis je zkomolený a popis tvoří náhodný úryvek textu stránky, který bez kontextu nedává smysl.
Nejste v tom sami. Rozbité náhledy odkazů patří k nejčastějším problémům digitálního marketingu a zároveň k těm, které se dají nejsnáze opravit. Tento průvodce prochází osm nejčastějších příčin, ukazuje, na co se přesně podívat, a nabízí nástroj Open Graph Preview vložený níže, ve kterém si můžete otestovat vlastní URL.
Co jsou značky Open Graph?
Když sdílíte URL na LinkedInu, Facebooku, ve Slacku, na Twitteru/X, v iMessage nebo na téměř jakékoli sociální platformě, platforma nezobrazí jen holý odkaz. Na pozadí stáhne stránku, přečte sadu skrytých značek HTML, kterým se říká značky Open Graph (OG), a podle nich sestaví kartu s náhledem, která ukazuje nadpis, popis a obrázek.
Open Graph původně vyvinul Facebook a v roce 2010 ho zveřejnil jako otevřený protokol.[1] Od té doby se stal univerzálním standardem pro náhledy odkazů téměř na všech platformách. Typická sada značek OG v části <head> kódu HTML stránky vypadá takto:
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="A short description of this page." />
<meta property="og:image" content="https://example.com/images/preview.jpg" />
<meta property="og:url" content="https://example.com/your-page/" />
<meta property="og:type" content="website" />
Když jsou tyto značky přítomné, správné a dostupné, náhledy fungují výborně. Když kterákoli z nich chybí, je špatně nebo je zablokovaná, náhled se rozbije, někdy i bez jakéhokoli upozornění.
Neznáte některé pojmy? Ve Slovníku zkracování odkazů najdete srozumitelné definice značek Open Graph, sociálních náhledů, kanonických URL a souvisejících pojmů.
Otestujte svou URL hned teď
Než se pustíme do osmi příčin, zkontrolujte v nástroji níže URL, se kterou pracujete. Stáhne stránku stejně jako LinkedIn a Facebook a ukáže vám, které značky jsou přítomné, které chybí a jak bude náhled vypadat.
Vyzkoušejte zdarma, bez registrace
Kontrola Open Graph
Podívejte se na tagy za odkazem a na kartu, která z nich vznikne.
8 nejčastějších důvodů, proč je náhled odkazu rozbitý
1. Značky OG úplně chybí
Nejčastější příčina. Mnoho webů, hlavně starších, nástrojů na míru a stránek aplikací, značky Open Graph v HTML prostě nemá. Když je sociální platforma nenajde, improvizuje: může vzít <title> stránky, první odstavec textu nebo nezobrazit žádný obrázek.
Na co se podívat: Zobrazte zdrojový kód stránky (ve většině prohlížečů pravým tlačítkem → „Zobrazit zdrojový kód stránky“) a vyhledejte og:title. Pokud nic nenajdete, značky tam nejsou.
Jak to opravit: Přidejte pět základních značek uvedených výše do části <head> stránky. Pokud používáte WordPress, postarají se o to automaticky pluginy jako Yoast SEO nebo Rank Math. Většina nástrojů pro tvorbu webů (Squarespace, Webflow, Wix) má u každé stránky samostatný panel nastavení SEO nebo sdílení na sociálních sítích.
2. Obrázek OG je příliš malý
Platformy vyžadují minimální rozměry obrázku a obrázky pod touto hranicí odmítnou zobrazit. LinkedIn například pro velký formát karty vyžaduje obrázky o rozměrech alespoň 1200 × 627 pixelů.[2] Facebook doporučuje stejné rozměry a pokud je váš obrázek menší, zobrazí jen malou miniaturu nebo žádný obrázek.
Častí viníci: firemní logo (obvykle čtvercové a malé), favicona nebo fotka z fotobanky, která byla před nahráním zmenšena kompresí.
Na co se podívat: Nástroj pro náhled vám ukáže nalezený obrázek a jeho rozměry. Správně velký obrázek OG pro současné platformy má 1200 × 630 pixelů (poměr stran 1,91:1).
Jak to opravit: Vytvořte samostatný obrázek pro sdílení na sociálních sítích o rozměrech 1200 × 630 pixelů. Je to něco jiného než hlavní obrázek stránky: je navržený tak, aby dobře vypadal oříznutý do vodorovné karty. Nástroje jako Canva mají hotové šablony přesně v této velikosti.
3. Platforma má v mezipaměti starý náhled
LinkedIn, Facebook a další platformy ukládají náhledy odkazů agresivně do mezipaměti, někdy na dny, nebo dokonce týdny. I když značky OG opravíte, starý (rozbitý) náhled se proto zobrazuje dál, protože platforma stránku znovu nestáhla.
Tahle situace patří k nejvíc frustrujícím, protože oprava už je nasazená, ale zdá se, že se nic nezměnilo.
Jak to opravit: Každá velká platforma nabízí nástroj pro ladění, který vynutí nové stažení:
- LinkedIn: Použijte LinkedIn Post Inspector. Vložte URL, klikněte na „Inspect“ a nástroj stáhne aktuální data a vymaže pro tuto URL mezipaměť.
- Facebook / Meta: Použijte Meta Sharing Debugger. Vložte URL a klikněte na „Scrape Again“.
- Twitter/X: Mezipaměť se maže častěji, ale obnovení můžete vyvolat tak, že poprvé připojíte neškodný parametr dotazu (např.
?v=2) a pak ho odeberete.
Po každé změně značek OG začněte vymazáním mezipaměti.
4. V cestě stojí přesměrování
Pokud vaše URL před načtením cílové stránky přesměruje na jinou URL, některé platformy přečtou značky OG z mezilehlé URL místo z cílové stránky, nebo přesměrování vůbec nenásledují.[3]
Obzvlášť často se to stává u:
- krátkých odkazů (které přesměrují na dlouhou cílovou URL),
- starých URL, které přesměrovávají na nové kódem 301,
- odkazů se sledovacími parametry, které procházejí vrstvou přesměrování,
- affiliate odkazů vedených přes několik kroků.
Řetězec přesměrování, kdy URL A přesměruje na URL B a ta na URL C, problém výrazně zhoršuje. Každý krok je další příležitost, kdy to robot vzdá nebo přečte špatnou stránku.
Jak to opravit: Použijte co nejkratší cestu přesměrování (ideálně jediný krok přímo na cílovou stránku). Ověřte, že cílová stránka má správné značky OG. Pokud používáte zkracovač odkazů, zjistěte, zda vaše platforma podporuje předávání značek OG nebo vlastní nastavení sociálního náhledu. Mnoho platforem pro správu odkazů umožňuje nastavit data OG přímo u krátkého odkazu, takže na obsahu cílové stránky nezáleží.
5. Obrázek OG je příliš velký (velikost souboru)
Záleží na rozměrech, ale také na velikosti souboru. Oficiální doporučení Facebooku je držet obrázky OG pod 8 MB,[4] v praxi ale obrázky nad 1–2 MB často způsobí, že robotům při stahování vyprší časový limit, zvlášť na pomalejších serverech nebo sdíleném hostingu.
Snímek obrazovky ve 4K, nekomprimovaný soubor PNG exportovaný z grafického programu nebo nezpracovaná fotka z fotoaparátu mohou mít snadno 5–15 MB, i když mají správné rozměry v pixelech.
Jak to opravit: Před nahráním obrázek OG zkomprimujte. Nástroje jako Squoosh (bezplatný kompresor obrázků od Googlu, který běží v prohlížeči) nebo TinyPNG dokážou zmenšit soubor o 60–80 % bez viditelné ztráty kvality. Cílem je méně než 500 KB, aby se obrázek na všech platformách načítal rychle a spolehlivě.
6. Server posílá špatný typ MIME
Typ MIME je označení, které server připojí k souboru a které prohlížeči (nebo robotovi) říká, o jaký druh souboru jde. Pokud server pošle obrázek se špatným typem MIME, například označí JPEG jako text/html, roboti ho odmítnou a nezobrazí žádný obrázek, i když je samotný soubor naprosto v pořádku.[5]
Zní to jako okrajová věc, ale stává se to častěji, než byste čekali, hlavně u:
- obrázků z CDN se špatně nastavenými hlavičkami,
- souborů nahraných bez správné přípony (např.
previewmístopreview.jpg), - serverů, které všem neznámým souborům přiřazují
application/octet-stream.
Na co se podívat: Nástroj Open Graph Preview vám ukáže typ obsahu, který server pro váš obrázek OG vrací. Měl by to být image/jpeg, image/png, image/gif nebo image/webp. Cokoli jiného způsobí problémy přinejmenším na některých platformách.
Jak to opravit: Pokud server spravujete, nastavte ho tak, aby obrázky posílal se správnou hlavičkou Content-Type. Pokud používáte CMS nebo CDN, nahrajte obrázek znovu se správnou příponou a odeslané hlavičky ověřte ve vývojářských nástrojích prohlížeče (karta „Network“ → klikněte na požadavek na obrázek → „Headers“).
7. Značky OG a značky Twitter Card si odporují
LinkedIn a Facebook používají značky Open Graph. Twitter/X používá vlastní systém Twitter Cards.[6] Většina platforem se vrátí ke značkám OG, pokud značky Twitter Card chybí. Když jsou ale přítomné obě sady a odporují si (jiné nadpisy, jiné obrázky), některé platformy se zmatou a vykreslí tu špatnou, nebo mezi nimi nepředvídatelně přepínají.
Typická situace: vývojář přidal značky OG, které odkazují na obrázek s vodorovným bannerem, a později někdo z marketingu přidal značky Twitter Card, které odkazují na čtvercové logo. LinkedIn teď místo banneru ukazuje čtvercové logo.
Jak to opravit: Zkontrolujte obě sady značek společně. U většiny stránek by měly být protějšky og: a twitter: shodné, pokud nemáte záměrný důvod ukazovat na různých platformách různý obsah. Pokud chcete jednotnost, nastavte značky Twitter Card výslovně tak, aby odpovídaly značkám OG:
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title" />
<meta name="twitter:description" content="A short description." />
<meta name="twitter:image" content="https://example.com/images/preview.jpg" />
8. Post Inspector od LinkedInu má své zvláštnosti
Robot LinkedInu se v několika ohledech chová jinak než roboti Facebooku a Twitteru:
- Nenásleduje všechna přesměrování. Robot LinkedInu se někdy zastaví u prvního přesměrování a přečte značky z mezilehlé URL, ne z cílové stránky.[2]
- Respektuje
X-Frame-Optionsa některá pravidlarobots.txt. Pokud vášrobots.txtzakazuje robota LinkedInu (Linkedinbot), náhledy selžou. - Ověřování na CDN s obrázky. Pokud je váš obrázek OG za jakýmkoli ověřením, tokenem nebo podepsanou URL, které vyprší platnost, LinkedIn ho napoprvé úspěšně stáhne, ale při dalších pokusech po vypršení tokenu selže.
- Mezipaměť maže pomaleji. I když vynutíte nové stažení přes Post Inspector, příspěvky na LinkedInu, které už byly zveřejněny se starým náhledem, se nemusí aktualizovat. Tak je to navrženo.
Jak to opravit: Projděte URL nástrojem LinkedIn Post Inspector před zveřejněním, ne až po něm. Berte to jako kontrolu před startem pokaždé, když sdílíte důležitý odkaz. Ověřte, že váš robots.txt povoluje Linkedinbot. Obrázky OG poskytujte z veřejné a trvalé URL bez ověřování a bez tokenů, kterým vyprší platnost.
Jak aplikace sestavují kartu s náhledem
Každý bohatý náhled odkazu vzniká stejným postupem, ať odkaz vložíte do jakékoli aplikace.
- Stažení. Robot platformy si vyžádá vaši URL s vlastním identifikátorem prohlížeče (user agent), následuje přesměrování a přečte HTML, které server vrátí. Nespouští váš JavaScript tak jako prohlížeč, a proto značky vložené na straně klienta často chybějí.
- Přečtení značek. Hledá
og:title,og:descriptionaog:image(X nejdřív kontrolujetwitter:*a pak se vrací k Open Graph; Discord a Slack čtou také oEmbed, pokud ho web zveřejňuje). Pokud značka chybí, robot použije nadpis stránky, metapopis, nebo nic. - Stažení obrázku. URL obrázku se stahuje zvlášť a kontroluje se velikost souboru a rozměry. Relativní cesta, přesměrování nebo soubor, který je příliš velký nebo příliš malý, jsou nejčastějším důvodem, proč se karta vykreslí bez obrázku.
- Uložení do mezipaměti a vykreslení. Výsledek se uloží do
mezipaměti na hodiny nebo dny podle platformy a vykreslí se
v rozvržení dané platformy: velký obrázek nahoře u
summary_large_imagena X a na LinkedInu, kompaktní karta v iMessage, vložený blok s barevným pruhem v Discordu.
Kontrola náhledu odkazu provede kroky jedna až tři za vás a ukáže hotovou kartu pro osm platforem vedle sebe. Kontrola Open Graph ukazuje nezpracované značky, ze kterých karta vzniká. Pokud karta v nástroji vypadá správně, ale v aplikaci špatně, příčinou je téměř vždy krok čtyři: kopie v mezipaměti z doby před opravou.
Rychlý kontrolní seznam
Projděte ho před sdílením každého důležitého odkazu:
| Kontrola | Podmínka splnění |
|---|---|
og:title je přítomná | Ano |
og:description je přítomná | Ano |
og:image je přítomná | Ano |
og:url je přítomná a kanonická | Odpovídá cílové stránce |
| Rozměry obrázku | Alespoň 1200 × 630 px |
| Velikost souboru obrázku | Pod 1 MB (ideálně pod 500 KB) |
| Typ MIME obrázku | image/jpeg, image/png nebo image/webp |
| Počet přesměrování k cílové stránce | 1 nebo méně |
| Žádné URL obrázků s vypršelou platností nebo s ověřováním | Ano |
| Mezipaměť vymazaná přes LinkedIn Post Inspector | Spustit před zveřejněním |
| Značky Twitter Card odpovídají značkám OG | Ano |
Proč na tom záleží nejen kvůli vzhledu
Rozbitý náhled není jen kosmetická vada. Výzkumy opakovaně ukazují, že příspěvky s bohatým náhledem a obrázkem mají výrazně vyšší zapojení než příspěvky s holým textovým odkazem. Podle vlastních dat LinkedInu získávají příspěvky s obrázky o 98 % více komentářů než příspěvky bez nich.[2] Na Facebooku mají příspěvky s odkazem a vyladěným náhledem soustavně lepší výsledky než ty bez něj, a to v organickém dosahu i ve výkonu placených reklam.
Pokud jakkoli distribuujete obsah, ať jde o články na blogu, vstupní stránky, produktové stránky nebo tiskové zprávy, oprava značek Open Graph patří k 30minutovým investicím s nejvyšší návratností.
Zdroje
[1] Meta Platforms, Inc. (2010, průběžně aktualizováno). The Open Graph Protocol. ogp.me. https://ogp.me/
[2] LinkedIn. (2024). Share on LinkedIn — Developer Documentation: Best Practices. LinkedIn Developer Platform. https://learn.microsoft.com/en-us/linkedin/consumer/integrations/self-serve/share-on-linkedin
[3] Fielding, R., Nottingham, M., & Reschke, J. (2022). RFC 9110: HTTP Semantics, §15.4 (Redirection). Internet Engineering Task Force (IETF). https://www.rfc-editor.org/rfc/rfc9110#section-15.4
[4] Meta for Developers. (2024). Sharing Best Practices for Websites & Mobile Apps. https://developers.facebook.com/docs/sharing/best-practices/
[5] Freed, N., & Borenstein, N. (1996). RFC 2046: MIME Part Two — Media Types. IETF. https://www.rfc-editor.org/rfc/rfc2046
[6] X Corp. (2024). Cards — X Developer Platform. https://developer.x.com/en/docs/twitter-for-websites/cards/overview/abouts-cards
Naposledy aktualizováno: květen 2026. Viz také: Slovník zkracování odkazů – Open Graph / značky OG, sociální náhled, kanonická URL, řetězec přesměrování.
