Jiskra [datová vizualizace struktury webu]

Úvod

Vizualizace webových dat s názvem Jiskra (anglicky Spark) vznikla původně v roce 2015. Vstupní data pochází z textového sitewide crawlu webu dodavatele plynu a elektřiny, který byl tehdy v prvích fázích vstupu na silně konkurenční trh. Vizualizace pomohla odhalit několik vlastností a chyb webu, které v klasickém tabulkovém zobrazení dat zůstávaly skryté. Ve článku popisuji postup vytvoření grafu v Gephi, zvolené parametry grafu a interpretaci zobrazených dat.

Vznik grafu v krocích

Na vytvořeném grafu jsou jasně viditelné velké „clustery“ uzlů v horní a dolní části. Jedná se o dvě největší silně propojené sekce webu, takzvané „huby“. Bohužel silné propojení je pouze uvnitř daných sekcí, nikoliv do celého webu. Ve středové části grafu jsou viditelná centra (autoritativní uzly) nejintenzivnějšího prolinkování napříč celým webem. Jedná se o hlavní navigaci (tři do červena až oranžova zbarvené uzly) a externí odkazy (světlé uzly), kam odkazují téměř všechny ostatní stránky webu. Právě díky třem zbarveným uzlům veprostřed je možné lépe identifikovat poslední cluster, který se nachází vlevo. Jedná se o třetí tematickou sekci webu. Byznysově sice zajímavou, ale špatně performující. Graf jasně zobrazuje proč. Třetí sekce má minimum obsahu, je hůře prolinkovaná a celkově silně upozaděná, na webu téměř neviditelná.

Nejsvětlejší uzly jsou stránky, které na zkoumaný web neodkazují vůbec nebo jen zcela minimálně. Malé okrajové uzly jsou typicky obrázky a assety, které se vyskytují na konkrétních stránkách. Na těch není nic zvláštního. Množství velkých světlých uzlů v centrální sekci a blízko středu všech clusterů je lehce zarážející. Na vstupu jsem neprovedl dostatečné začištění dat. Typicky nepotřebuji vidět uzly (URL) pro měřicí scripty nástrojů jako Google Tag Manager nebo assety jako je logo a další obrázky. V datové laboratoři proto podobné uzly mažu. Zároveň nacházím anomálii. Konkrétně uzly, které mají název obsahující subdoménu stage. Těmto ručně upravím barvu na sytě růžovou, aby byly na grafu jasně rozpoznatelné.

Nově vidím, že mi v grafu stále zůstává hodně podezřelých světlých uzlů v centrální oblasti a také světlé uzly v jednotlivých clusterech. Problémy jsou nyní jasně viditelné. Nastal čas je rozebrat a najít řešení a postup optimalizace webu.

Plán změn na webu

1) Nejdříve vyřešíme růžové uzly na okraji grafu. Jedná se o obrázky, které nefungují, protože jsou načítány ze staging prostředí (subdoména stage), které je pro uživatele a roboty nedostupné. Je jasně viditelné, že problém se vyskytuje jen v jedné oblasti webu. Nebudeme opravovat jednotlivé obrázky v obsahu stránek. Příčinou je totiž drobný bug v kódu, díky kterému by při dalším releasu k chybě došlo znovu a potenciálně ve větší míře. Je proto nutné opravit zdroj chyby a zajistit prevenci. Aktuální rozsah je minimální. Zadání i řešení je jednoduché a rychlé. Ignorování chyby by ovšem mohlo způsobit nedostupnost obrázků na celém webu, což už by bylo poměrně nepříjemné. Proto se jedná o úkol s vyšší prioritou.

2) Následně začneme připravovat úpravu hlavní informační architektury webu. Primárně hlavní navigace a dalších site-wide prvků. Externí odkazy smazat nemůžeme, protože se jedná o prolinkování na profily na sociálních sítích a satelitní weby. Některé ale nejsou pro drtivou většinu uživatelů nezbytně nutné, takže je můžeme upozadit. To bude práce na UX. A hlavní navigaci bude nutné rozšířit a přidat odkazy i na důležité relevantní podstránky jednotlivých sekcí. To bude práce pro SEO a UX.

3) Třetí a neméně důležitý bod je vytvoření domovské stránky webu. Na první pohled to není úplně zřejmé, ale uprostřed grafu by se neměly vyskytovat pouze tři uzly zbarvené do červena, ale minimálně čtyři. Každý ze tří uzlů je hlavní stránka pro jednu ze tří velkých sekcí na webu. Ale zcela chybí domovská stránka, která by sloužila jako hlavní rozcestník a především jako vstupní stránka pro brandová a hodně obecná klíčová slova. Absence domovské stránky způsobuje silné zmatení vyhledávače, který často neví, kterou stránku má ve vyhledávání zobrazit. Zobrazené stránky se neustále střídají a dochází k neustálé a nahodilé fluktuaci pozic. Velmi často se tak stává, že vyhledávač běžného zákazníka pošle na stránky určené třeba pro B2B. A naopak, potenciálního B2B zákazníka pošle na zcela irelevantní stránky a ceníky pro běžnou klientelu. Návštěvnost webu je sice obstojná, ale bounce rate (míra okamžitého odchodu) je obrovská, protože většina lidí nedostala správné informace. Jen málokomu se chce něco intenzivněji dohledávat a odchází zpět do vyhledávání. Velmi pravděpodobně bude následovat kliknutí na konkurenční web. Značka je na trhu nová a návštěvníci zatím nemají dostatek důvěry.

4) Předposlední úkol nás vezme k samotnému obsahu stránek v jednotlivých informačních hubech. Pokusíme se vylepšit obsah a vzájemně lépe propojit stránky napříč webem. Vymyslíme zkratky a sekundární navigaci. To vše vylepší nejen prolinkování webu, ale především usnadní orientaci uživatelů na webu a také sníží počet kliknutí nutný k přechodu do jiné sekce webu. Po začištění dat činí průměrná délka cesty na webu 3,083. To znamená, že než se uživatel dostane z jednoho konce na druhý, musí udělat tři a více kliknutí. Na takto relativně malý web je to docela hodně. Měli bychom se zkusit dostat pod tři kliknutí. Trochu pomůže homepage. Hodně pomůže lepší prolinkování z obsahu podstránek jednotlivých sekcí webu a prvky sekundární navigace.

5) Poslední úkol bude eliminace nebo alespoň omezení světlých uzlů uvnitř jednotlivých hubů. Typicky se jedná o různé statické PDF dokumenty, které fungují jako koncové URL, ze kterých se uživatelům jen velmi špatně vrací zpět na hlavní část webu. Jejich obsah lze jednoduše naformátovat a vložit přímo do obsahu relevantních stránek. Bude to výrazně přívětivější k uživatelům, které nebudeme nutit stahovat PDFka. Jednoduše celý obsah naservírujeme přímo na webu. Mimo jiné tím výrazně usnadníme a zrychlíme cestu ke konverzi uživatele v nového zákazníka.

Poznámka. Nejedná se o kompletní výčet problémů webu, ani rozbor všech aspektů grafu.

Vizualizovat či nevizualizovat

Všechny výše uvedené úpravy a úkoly by měly přirozeně vyplynout i z klasického auditu webu vedeného zkušeným expertem. Hlavní benefit vizualizace je nečeknaně právě to samotné grafické zpodobnění vnitřní informační struktury webu. Umožňuje zaměřit pozornost na specifické detaily a metriky, které při optimalizaci webů mají velký význam, ale nejsou běžně používané. Vizualizace však není nutnost natož povinnost. Je to pomůcka pro lepší a hlubší pochopení webů a toku informací na nich.

Jiskra

Jiskra patří mezi první grafy, které jsem v Gephi zpracoval. Veřejně jsem ho ukázal a využil už v roce 2015 v rámci Gephi workshopu na eventu SEOloger #10: Gephi: Vizualizace nejen SEO dat. V roce 2026 se mi v rámci obnovy ztraceného obsahu podařilo oživit i staré soubory z Gephi se zde popsaným materiálem. Název vizualizace reprezentuje jiskru nutnou pro znovuoživení mého webu. Jiskru vášně po hloubkovém zkoumání webů, kterou jsem před více než dekádou získal při práci junior link buildera a SEO specialisty. Zvolený motiv nenápadně poukazuje na hlavní tematiku webu, ze kterého data pochází, což byl zemní plyn a elektřina. Reprezentuje také nenápadnou nepříliš povedenou jiskru, která kdysi zažehla plamínek vášně ke grafům v některých účastnících workshopu. Na ně, jsem nejvíce hrdý. Na Jednoho Konkrétního ozvláště, protože to s grafy dokázal dotáhnout zatraceně daleko a stal se z něj skutečný mistr svého řemesla.

Vybrané parametry vizualizace

• Začištění dat: nulové
• Celkem uzlů: 634
• Celkem hran: 8482
• Typ grafu: orientovaný
• Algoritmus: Force Atlas
• Gravity: 65 (silněji přitahuje uzly do centra grafu)
• Repulsion strength: 400 (vzájemné odpuzování uzlů)
• Attraction Distribution: ano
• Adjust by Sizes: ano
• Velikost uzlů: dle Out-Degree (počet hran mířících ven z uzlu)
• Barva uzlů: dle Out-Degree (počet hran mířících ven z uzlu)
• Manuálně nastavená barevná škála: #FEF0D9 (0 %); #F1784B (50 %); #B30000 (100 %)

Graf ve vysokém rozlišení ke stažení

Ultra HD tapeta na plochu. Rozlišení 3840 × 2160 px. Poměr stran 16:9. Velikost souboru 7.03 MB.
Stahujte zde: https://zdeneknespor.cz/wp-content/uploads/2026/10/2026-10-19-spark-4k.jpg

Licence

Licence UHD grafiky: CC BY-NC-ND 4.0.

Závěr

Zde popsaná práce pochází s neohrabaných začátků mé kariéry. Nehledě na to, text nemá pouze sentimentální hodnotu. Závěry z analýzy grafu jsou stále validní a užitečné pro různé disciplíny webové optimalizace. Podstata fungování vnitřní struktury webů se totiž nemění. Krom toho věřím, že má tahle jiskra potenciál zažehnout inspiraci a chuť zkoumat hlubiny informačních struktur.