Funkce a přínosy

SeoLabs SERP Snippet náhled přesně měří šířku titulku a simulovaného popisu pomocí Canvas API, takže výsledky odpovídají reálnému vykreslení v prohlížeči. Zároveň zvýrazní dotazy, zobrazuje KPI a doporučení, umí sbalit dlouhé breadcrumbs, přepínat mezi desktop/mobil (včetně rozdílných řádkových limitů) a vytváří vizuální náhled FAQ a sitelinks. Nevyužíváme žádné placené API ani knihovny – vše běží offline.

• Přesné měření titulku a popisu v pixelech pro aktuální fonty.
• Zvýraznění klíčových slov (celá slova i dílčí shoda, case-sensitive/insensitive).
• Automatické načtení dat z URL včetně JSON‑LD, Open Graph, Twitter Card a hreflang.
• Varianty náhledu: Standard, News, Product a Video.
• FAQ náhled, sitelinks, datum v popisu, rating.
• Export HTML a PNG, sdílení stavu přes URL, import/export nastavení.
• Diagnostika: KPI, QA panel s doporučeními a SERP data na jednom místě.

Proč měřit pixely a simulovat řádkování

Optimální délka titulku a popisu není o počtu znaků, ale o reálné šířce a zalomení textu. Vyhledávače vykreslují text konkrétním fontem a velikostí, a teprve podle dostupného místa rozhodují, co zobrazit a kde přidat elipsu. Pouhý počet znaků je proto zavádějící. Tento nástroj počítá s aktuální šířkou kontejneru (desktop/mobil), měří text v pixelech, a simuluje přechod na nový řádek přes tokenizaci slov a mezer. Díky tomu dostaneš výsledek, který se blíží reálnému SERPu.

Jak to funguje pod kapotou

• Canvas measureText měří šířku textu pro daný font; zvýrazněné shody se měří tučným fontem, aby byl výpočet přesný.
• Popis se rozdělí na tokeny, přidává po jednom a jakmile se nevejde, zalomí na další řádek; poslední řádek se ukončí elipsou.
• Breadcrumbs se skládají podle dostupného místa – střed se sbalí na „…“.
• KPI a QA panel ti pomohou rychle rozhodnout, zda je titulek/popis v normě a jak ho vylepšit.

Jak nástroj používat (krok za krokem)

1. Zadej URL a klikni na „Načíst z URL“. Pokud web blokuje CORS, použij „Z HTML“ nebo „Ze schránky“.
2. Uprav breadcrumbsy, titulek a popis. Sleduj KPI a QA doporučení.
3. Zapni mobilní náhled, případně sitelinks, FAQ a rating.
4. V „Pokročilé nastavení“ můžeš přepnout variantu (News/Product/Video) nebo přizpůsobit šířky.
5. Hotový snippet si zkopíruj jako HTML nebo vyexportuj do PNG.

Best practices pro title a description

• Hodnota a jasnost: začni nejsilnějším benefitem, číslem nebo unikátní propozicí.
• Konzistence s dotazem: použij přirozeně klíčová slova; nástroj zvýrazní shody v titulku i popisu.
• Řízení délky: pro desktop mířit na jeden řádek, pro mobil počítat s menší šířkou a až třemi řádky popisu.
• CTA a očekávání: popis může obsahovat jemné CTA, ale vyhni se clickbaitu a přehnaným slibům.
• Strukturovaná data: u obsahových stránek používej FAQ schema; u produktů Product/Review; u článků Article/NewsArticle.
• Testuj: měň drobnosti (pořadí, interpunkce, čísla) a sleduj KPI; drobná změna může rozhodnout o přetečení.

Časté otázky k SERP snippetu

Je lepší měřit znaky nebo pixely?

Pixely. Počet znaků je jen hrubý odhad a nebere v úvahu font, tučnost, mezery a skutečnou šířku kontejneru. Tento nástroj proto měří pixely.

Proč se někdy data z URL nenačtou přímo?

Některé weby blokují prohlížeč (CORS, anti‑bot). Používáme veřejné proxy a fallback „readability“. Pokud nic nezabere, funguje „Z HTML“/„Ze schránky“.

Ukládají se někam moje data?

Ne. Všechno běží lokálně v prohlížeči. Stav se ukládá pouze do localStorage tvého zařízení.