Analýza struktury webu a její optimalizace. Jan Koldinský

České vysoké učení technické v Praze Fakulta elektrotechnická Katedra počítačů

Bakalářská práce

Analýza struktury webu a její optimalizace Jan Koldinský

Vedoucí práce: Ing. David Toth

Studijní program: Elektrotechnika a informatika, strukturovaný, Bakalářský Obor: Výpočetní technika 30. června 2009

iv

v

Poděkování Rád bych poděkoval vedoucímu své bakalářské práce, Ing. Davidu Tothovi, za věcné připomínky k práci a čas, který mi věnoval. Dále bych chtěl poděkovat své rodině a přátelům za pečlivé pročtení a korekturu.

vi

vii

Prohlášení Prohlašuji, že jsem práci vypracoval samostatně a použil jsem pouze podklady uvedené v přiloženém seznamu. Nemám závažný důvod proti užití tohoto školního díla ve smyslu §60 Zákona č. 121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů (autorský zákon).

Ve Veltrusích dne 30. 6. 2009

.............................................................

viii

Abstract Bachelor’s thesis deals with the analysis and design of new web structure scientific work CEG - Center of Experimental Geotechnics Faculty of Civil Engineering Czech Technical University in Prague. Analysis of the current structure is based not only from web metrics and statistics analyzer Google Analytics, but also their own, defined metrics associated with the parsed web structure. The final draft optimized structure is composed of two part. The optimized structure of the analysis and the requirements of CEG. The implementation is then chosen suitable webframework, which implements the final web structure. The result should be the implementation of such structures, which corresponds to findings from the analytical part. The rate of success and good proposal is verified by reverse analysis of new structures using their own metrics and web-based analyzer.

Abstrakt Bakalářská práce se zabývá analýzou a návrhem nové webové struktury vědeckého pracoviště CEG – Centrum experimentální geotechniky Fakulty stavební Českého vysokého učení technické v Praze. Analýza současné struktury vychází nejen z metrik a statistik webového analyzátoru Google Analytics, ale i z vlastních definovaných metrik souvisejících s analyzovanou webovou strukturou. Konečný návrh optimalizované struktury se skládá ze dvou částí. Z navržené struktury vycházející z analýzy a požadavků CEG. Pro implementaci je pak vybrán vhodný webový framework, pomocí kterého se konečný návrh implementuje. Výsledkem je implementace struktury, která odpovídá závěrům z analytické části práce. Míra úspěšnosti a správného návrhu je ověřena zpětnou analýzou nové struktury pomocí vlastních metrik a webového analyzátoru.

ix

x

Obsah 1 Úvod

1

2 Základní pojmy analýzy webové struktury 2.1 Návrhový vzor . . . . . . . . . . . . . . . . 2.2 Human Computer Interaction . . . . . . . . 2.3 Web Modeling Language . . . . . . . . . . . 2.4 Základní vlasnosti kvalitního webu . . . . . 2.4.1 Použitelnost webu . . . . . . . . . . 2.4.2 Přístupnost webu . . . . . . . . . . . 2.4.3 Optimalizace pro vyhledávače . . . . 2.4.4 Návštěvnost a vyhledávače . . . . . 2.5 Role návštěvníka . . . . . . . . . . . . . . . 2.5.1 Student . . . . . . . . . . . . . . . . 2.5.2 Učitel . . . . . . . . . . . . . . . . . 2.5.3 Odborná veřejnost . . . . . . . . . . 2.5.4 Obyčejný návštěvník . . . . . . . . . 2.6 Metrika webu . . . . . . . . . . . . . . . . . 2.6.1 Metriky Google Analytics . . . . . . 2.6.2 Metrika HUI . . . . . . . . . . . . . 2.6.3 Metrika LNM . . . . . . . . . . . . . 2.6.4 Metrika MNC . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

3 3 4 4 4 5 5 5 5 5 6 6 6 6 6 7 8 8 8

. . . . . . . . . . .

9 9 9 10 10 11 11 12 13 14 15 15

3 Analýza současné webové struktury 3.1 Hlavní stránka webu . . . . . . . . . 3.1.1 Metriky Google Analytics . . 3.2 Česká sekce webové struktury . . . . 3.2.1 Základní struktura . . . . . . 3.2.2 Metriky Google Analytics . . 3.2.3 Metrika HUI . . . . . . . . . 3.2.4 Metrika LNM . . . . . . . . . 3.2.5 Metrika MNC . . . . . . . . . 3.3 Celkové zhodnocení analýzy . . . . . 3.3.1 Hodnocené prvky . . . . . . . 3.3.2 Závěr analýzy . . . . . . . . .

xi

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

. . . . . . . . . . . . . . . . . .

. . . . . . . . . . .

xii

OBSAH

4 Návrh optimalizace webové struktury 4.1 Vstupní stránka . . . . . . . . . . . . . . . . . . 4.1.1 Analýza nové vstupní stránky . . . . . . 4.2 Vnitřní struktura webu . . . . . . . . . . . . . . 4.2.1 Navigační zkratky . . . . . . . . . . . . 4.2.2 Analýza vnitřní struktury metrikou HUI 4.3 Použití metrik pro analýzu . . . . . . . . . . . 5 Syntéza návrhu s požadavky CEG 5.1 Požadavky CEG na obsahovou stránku 5.2 Proces syntézy . . . . . . . . . . . . . 5.3 Výsledný návrh mapy portálu CEG . . 5.4 Metriky finálního modelu struktury . . 5.4.1 Vyhodnocení metriky HUI . . . 5.4.2 Vyhodnocení metriky LNM . . 5.5 Závěr analýzy webové struktury . . . .

webu . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

. . . . . . .

. . . . . .

17 17 17 18 18 18 19

. . . . . . .

21 21 22 23 23 23 23 24

6 Implementace konečného návrhu 6.1 Framework CMS . . . . . . . . . . . . . . 6.2 Požadavky CEG na webový framework . . 6.3 Výběr vhodného CMS frameworku . . . . 6.3.1 Plone . . . . . . . . . . . . . . . . 6.3.2 Drupal . . . . . . . . . . . . . . . . 6.3.3 Joomla! . . . . . . . . . . . . . . . 6.3.4 WebGUI . . . . . . . . . . . . . . . 6.4 Porovnání základních vlastností CMS . . 6.5 Testování jednotlivých CMS . . . . . . . . 6.6 Konečná volba CMS . . . . . . . . . . . . 6.7 Funkční bloky implementace . . . . . . . . 6.7.1 Přístupná navigace webu . . . . . 6.7.2 Navigace navrhované struktury . . 6.7.3 Přepínání jazykové verze webu . . 6.7.4 Ukázka funkčních bloků . . . . . . 6.8 Nasazení frameworku a tvorba struktury . 6.8.1 Použitá verze Plone . . . . . . . . 6.8.2 Tvorba struktury v Plone . . . . . 6.8.3 Screenshoty konečné implementace

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . .

25 25 25 25 26 27 28 28 28 29 30 31 31 31 31 32 32 33 33 33

7 Závěr 7.1 Zpětná analýza pomocí Google Analytics 7.1.1 Metrika MNC . . . . . . . . . . . . 7.1.2 Bounce rate . . . . . . . . . . . . . 7.2 Celkové zhodnocení . . . . . . . . . . . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

35 35 35 35 36

Literatura

39

OBSAH

xiii

A Seznam použitých zkratek

41

B Diagramy webové struktury 43 B.1 Návrh optimalizace struktury . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 B.2 Proces syntézy finální struktury . . . . . . . . . . . . . . . . . . . . . . . . . . 43 C Instalační a uživatelská příručka C.1 Požadavky na operační systém . . . . . . . C.2 Doporučené hardwarové prostředky . . . . . C.3 Spuštění Plone pod Windows XP . . . . . . C.4 Spuštění Plone pod distribucí Linux Debian C.4.1 Unified Installer . . . . . . . . . . . C.5 Vytváření struktury v Plone . . . . . . . . . C.5.1 Vytvoření položky . . . . . . . . . . C.5.2 Vložení odkazů . . . . . . . . . . . . C.5.3 Zveřejnění stránky . . . . . . . . . . C.5.4 Nastavení navigace . . . . . . . . . . D Obsah přiloženého CD

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

47 47 47 47 48 48 49 49 49 50 50 51

xiv

OBSAH

Seznam obrázků 3.1 3.2 3.3 3.4 3.5 3.6 3.7 3.8 3.9

Základní schéma hlavní stránky webu . . . . . . . . . . Metrika Zdroj provozu (Google Analytics) . . . . . . . . Metrika podle typu prohlížeče (Google Analytics) . . . . Graf metriky HUI pro hledané informace návštěvníkem . Stavový digram pro vyhledání informací ve struktuře . . Základní struktura a rozdělení podle sekcí . . . . . . . . Stavový diagram ohodnocení sekcí . . . . . . . . . . . . Graf metriky MNC pro jednotlivé sekce webu . . . . . . Statistika přístupů podle Google Analytics . . . . . . . .

4.1 4.2 4.3

Diagram nové základní struktury vycházející ze vstupní stránky . . . . . . . . 17 Diagram vnitřní struktury s navigačními zkratkami . . . . . . . . . . . . . . . 18 Graf metriky HUI pro novou strukturu . . . . . . . . . . . . . . . . . . . . . . 19

5.1 5.2 5.3

Schéma procesu syntézy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 Základní struktura finálního návrhu . . . . . . . . . . . . . . . . . . . . . . . 23 Graf metriky HUI pro finální model struktury . . . . . . . . . . . . . . . . . . 24

6.1 6.2 6.3 6.4 6.5

Uložení dat v databázi Plone [8] . . . . . . . . . . . MVC architektura systému Drupal [5] . . . . . . . . Ukázka funkčních bloků v konečné implementaci . . Vstupní stránka do struktury webu . . . . . . . . . . Horizontální navigace s aktuální pozicí ve struktuře .

7.1 7.2

Metrika MNC . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 Srovnání celkového bounce rate před a po optimalizaci . . . . . . . . . . . . . 36

. . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

. . . . . . . . .

. . . . .

10 11 12 12 13 14 15 16 16

26 27 32 34 34

B.1 Návrh optimalizace struktury . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 B.2 Proces syntézy finální struktury . . . . . . . . . . . . . . . . . . . . . . . . . . 45 C.1 Vytvoření položky . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 C.2 Vložení interního linku . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50

xv

xvi

SEZNAM OBRÁZKŮ

Seznam tabulek 3.1

Odchody z hlavní stránky webu . . . . . . . . . . . . . . . . . . . . . . . . . . 10

6.1

Srovnání vlastností vybraných CMS . . . . . . . . . . . . . . . . . . . . . . . 29

xvii

xviii

SEZNAM TABULEK

Kapitola 1

Úvod Analýza struktury webu je důležitým procesem při vývoji, prezentaci a celkovém životním cyklu webového projektu a to v jakékoliv oblasti realizace. Tato práce se zabývá analýzou webové prezentace věděckého pracoviště CEG Fakulty stavební ČVUT. I pro tento web je proces analýzy a optimalizace důležitým prvkem. Jedná se zejména o oblast výzkumu a výuky tohoto pracoviště. Prezetance těchto dvou prvků musí být kvalitní a precizní. Práce se skládá z několika menších celků. Nejdříve se vypracuje celková analýza stávající webové struktury. Tato analýza bude částečně vycházet z údajů webového nástroje Google Analytics. Analyzuje se, jaká je současná dostupnost informací na webu, které potenciální návštěvník v roli studenta, učitele, odborníka či běžného návštěvníka vyhledává. Jednotlivé závislosti a struktury jsou vyjádřeny a zhodnoceny pomocí vhodně zadefinovaných vlastních metrik. Další část práce je věnována optimalizačnímu návrhu řešení, které vychází ze závěrů analýzy. V této části je popsána nová a optimální struktura webu. Před implementací nové struktury je tento návrh sjednocen s požadavky vědeckého pracoviště CEG na strukturu a systém. Po této syntéze je navržená struktura definitivní. Konečná struktura je následně implementována pomocí vhodně vybraného CMS webového frameworku. Cílem práce je vytvořit takový návrh řešení webové struktury, který bude vycházet z celému procesu analýzy. Důležitým aspektem je definování a použití vhodných webových metrik pro analýzu. Dalším důležitým prvkem je volba správného webového frameworku pro realizaci řešení. Závěrečnou zpětnou analýzou konečného návrhu a následné realizace řešení je ověřeno, do jaké míry je návrh struktury a volba frameworku správným řešením.

1

2

KAPITOLA 1. ÚVOD

Kapitola 2

Základní pojmy analýzy webové struktury V následující kapitule jsou definovány základní pojmy analýzy, s kterými se v dalších kapitolách práce bude pracovat. Jedná se zejména o správné návrhy a postupy tvorby kvalitního webu, vymezení pojmu role návštěvníka stránek či definice metrik, které se aplikují na strukturu webu při analýze.

2.1

Návrhový vzor

V oblasti webového softwarového inženýrství existuje v dnešní době mnoho osvědčených metodik, které se promítají do standardizovaných postupů a nástrojů. Návrhové vzory mohou pomoci podstatným způsobem při vývoji aplikace, protože předávají především zkušenost s ověřeným řešením a jeho, do jisté míry, formalizovaný popis. Může se tím velmi urychlit proces návrhu, vývoje a zlepšit použitelnost, flexibilita a správa nějakého projektu. Návrhový vzor je proces softwarového inženýrství, který popisuje náčrt problému a popis jeho obecného řešení v konkrétních souvislostech. Návod řešení pak musí být natolik pružný, aby se vzor mohl aplikovat opakovaně. Může se jednat o popis či šablonu, jak řešit problém, který lze použít v mnoha různých situacích. Je důležité, aby skupina vzorů určená pro řešení účelově zaměřené skupiny problémů, byla popsána stejnou formou, strukturou, která zajišťuje jednotnou podobu jejich popisu. Snahou je, aby všechny části vzoru byly popsány stručně, výstižně a úplně [3]. Objektově orientované návrhové vzory vyjadřují obvykle souvislost mezi třídou a objektem. Počátky těchto vzorů nejsou v softwarovém inženýrství, ale v šedesátých letech byl tento termín použit v architektuře Christopherem Alexandrem. Každý návrhový vzor má přesný a pevně daný popis vazby a funkčnosti na další objekty či jiné vzory. Mezi základní typy návrhových vzorů patří Creational Patterns, Structural Patterns a Behavioral Patterns [3].

3

4

KAPITOLA 2. ZÁKLADNÍ POJMY ANALÝZY WEBOVÉ STRUKTURY

2.2

Human Computer Interaction

Interakce člověk-počítač je disciplína zabývající se návrhem, vyhodnocením a zaváděním interaktivních počítačových systémů pro lidské použití a studium jevů kolem nich. Jedná se o oblast metodiky a principů, která má své základy v době prvních osobních počítačů. V dnešní době je interakce počítače s člověkem nedílnou součástí našeho života. Z pohledu počítačové vědy je kladen důraz na interakci zejména mezi jedním nebo více lidmi a jedním nebo více výpočetními zařízeními. Klasická situace je taková, kdy osoba používá interaktivní grafiku programu na pracovní stanici. Rozhraní člověk-počítač může být popsáno jako okamžik komunikace mezi uživatelem a jeho počítačem. Tok informací je definován jako smyčka interakce. Smyčky interakce mají několik aspektů [12]: • Pracovní prostředí - podmínky a cíle stanovené na uživatele, tj. prostředí, ve které je počítač interaguje s člověkem. • Vstupní tok - uživatel má určité specifické úkoly, které vyžadují použití počítače. • Zpětná vazba - vazba hodnotící procesy, které přecházejí z člověka prostřednictvím rozhraní k počítači a zpět.

2.3

Web Modeling Language

Existuje mnoho metodik a principů, jak správně postupovat při tvorbě dobrého a kvalitního webového projektu. Jedna z nejnovějších webových metodik se nazývá WebML (Web Modeling Language), která vznikla poměrně nedávno. Vychází z konceptu UML (Unified Modeling Language), avšak definuje i kompletní proces návrhu internetových aplikací a podporuje celý životní cyklus produktu. WebML je tak speciálně navrženo pro tvorbu internetových aplikací [13]. Tato metodika je založena na dvou základních modelech – konceptuálním a navigačním. Konceptuální model tvoří klasický E-R (relační) model nebo OO (Objektově Orientovaný) model a umožňuje tzv. pohledy nad daty pro návrh uživatelského rozhraní. Navigační model zachycuje pohyb uživatele mezi jednotlivými stránkami webu. WebML využívá klasických nástrojů pro vývoj jako jsou např. CASE diagramy v UML [13].

2.4

Základní vlasnosti kvalitního webu

Návrh správné webové struktury jakéhokoliv projektu je nesmírně důležitý. Web musí být rychlý, dynamický s kvalitní službou. Návštěvník se na tento webový portál bude rád vracet. Základní pilíře kvalitního webu tvoří Použitelnost a Přístupnost webu, Optimalizace pro vyhledávače a Návštěvnost stránek [4].

2.5. ROLE NÁVŠTĚVNÍKA

2.4.1

5

Použitelnost webu

Správná navigace v celém projektu udrží návštěvníka na stránkách. Celý web by měl být přehledný, měl by obsahovat funkční dynamické menu pro správnou orientaci se zpětnými meziúrovňovými odkazy. Není-li návštěvník výjimečně trpělivý, nezdrží se na nevhodně vybudované webové struktuře příliš dlouho.

2.4.2

Přístupnost webu

Přístupnost webu je soubor pravidel, které zajišťují, aby samotné stránky nebránily návštěvě webu. Každý nepoužívá stejný prohlížeč internetových stránek či rozlišení svého monitoru / LCD je jiné, musí tak být zajištěna nezávislost na zobrazovacím médiu. Stránky by měly mít i podporu a správné zobrazení v mobilním telefonu [4]. Člověk se specifickým zdravotním postižením by měl mít šanci se na určitý web podívat. Dnes jsou oblíbené RSS kanály, jejichž správná funkčnost závisí na správné struktuře jednotlivých stránek a dodržováním konvencí W3C pro tvorbu webu. Jedná se dodržování zápisu a správného použití specifických jazyků, prostředků či modelů. Mezi základní konvence W3C patří: XHTML, CSS, XML, DOM, SVG, PNG a další. Pokud jsou konvence dodrženy, je zaručeno správné zobrazení či zpětná kompatibilita v určitém prohlížeči [14].

2.4.3

Optimalizace pro vyhledávače

Při správně zvolené struktuře webových stránek (správné definování nadpisů a hlaviček v HTML kódu) má portál šanci být snáze vyhledán internetovým vyhledávačem s přední pozicí při hledání klíčových slov návštěvníkem. Tato optimalizace se nazývá SEO [4].

2.4.4

Návštěvnost a vyhledávače

Dobrý web si udrží daleko více návštěvníků, procento návratnosti může být také vysoké, tj. pokud si stránku návštěvník oblíbil, je možné, že se někdy na ni opět vrátí. Pokud má projekt dobrou marketingovou reklamu, dozví se o něm větší množství lidí mnohem rychleji.

2.5

Role návštěvníka

Pro hodnocení struktury je vhodné určit jednotlivé skupiny návštěvníků, kteří vstupují na analyzovanou strukturu webu. Každý návštěvník webu vždy hledá určité specifické informace. Proto je vhodné návštěvníky rozdělit podle určitých rolí. Jelikož analyzovaným webem je výzkumné pracoviště vysoké školy, největší procento návštěvníků budou zřejmě studenti a učitelé, dále odborná veřejnost, vědci zabývající se podobnou problematikou. Samozřejmě na stránky může zamířit i obyčejný návštěvník, tj. bez příslušného vzdělání a odborných znalostí. Jednotlivé role návštěvníka se však prolínají. Pro analýzy budou brány v úvahu tyto 4 základní role: student, učitel, odborník, obyčejný návštěvník.

6

KAPITOLA 2. ZÁKLADNÍ POJMY ANALÝZY WEBOVÉ STRUKTURY

2.5.1

Student

Nejvíce se bude zajímat o výuku předmětů, kontakty na učitele, materiály pro studium, teoretické pasáže problematiky. Pravděpodobně jeden z nejčastějších návštěvníků stránek.

2.5.2

Učitel

Role učitele se prolíná s rolí studenta a odborné veřejnosti. Největší podíl návštěv s touto rolí bude zřejmě do sekce s výukou předmětů, publikační činností a informacemi k dané problematice.

2.5.3

Odborná veřejnost

Lidé v oboru se budou nejvíce zajímat o informace z výzkumu, popis experimentů, teoretické odborné pasáže pro- blematiky, kterou studuje toto pracoviště. Oblasti okolo výzkumu bude také navštěvovat většina uživatelů tohoto webu z ciziny, proto jsou řazeny do této role.

2.5.4

Obyčejný návštěvník

Laickou veřejnost budou nejvíce zajímat základní informace o pracovišti, úvod do problematiky a kontakty na příslušné osoby na tomto pracovišti.

2.6

Metrika webu

Pojem metrika má v informatice velice široký význam. V teorii grafů lze metriku definovat jako funkci, která ke dvěma libovolným vrcholům v souvislém grafu dosadí nejkratší vzdálenost. Tato funkce se potom nazývá metrika grafu. Pro analýzy webových struktur lze tuto definici přijmout, pokud se bude brát v úvahu webová struktura jako graf. Metrikou grafu lze zjistit a analyzovat místo a způsob uložení informací ve webové struktuře [1]. V oblasti webových Business projektů je metrika ukazatelem hodnocení efektivnosti a výkonnosti, která se skládá z několika prvků: • Použitelnost webu a vzory • Uživatelem dodaná data • Výkon stránek • Transakce a finanční analýza Takto definované metriky lze rozdělit do dvou základních skupin. Measure to Control (MTC) jsou kvantitavní metriky, které sledují hodnotu návštěvníka či transakce ve struktuře, odpovídají na otázky typu jak často či kolik. Typickou MTC metrikou je například jednotlivá návštěvnost stránek, poměry odchodu a návratnosti dané stránky či doba strávená na určitém místě struktury. Druhou skupinou jsou metriky typu Measure to Analyze (MTA), které mohou být kvalitativní i kvantitavní. Používají se pro pochopení využití webu a sledování trendu či změn

2.6. METRIKA WEBU

7

MTC metrik. Tyto metriky odpovídají na otázky typu kde, kam, proč a kdo je aktuálně uživatelem. Jedná se například o ukazatele původu návštěvníka - odkud na stránky přišel a jak stránky našel, zachycují tak jeho pohyb ve struktuře [2].

2.6.1

Metriky Google Analytics

Tento webový analyzátor od společnosti Gogole obsahuje metriky MTC i MTA. Poskytuje statistiky a přehledy o jednotlivých stránkách či souborech stránek. Tento systém je implementován do jednotlivých stránek pomocí Google Analytics Tracking Code (GATC). Jedná se o skrytý fragment JavaScriptu vložený do stránky, který uživatel přidá ke každé stránce portálu. Tento kód slouží k shromažďování soukromých dat návštěvníka a následně je předává zpět na servery Google ke sběru dat pro zpracování. Zpracování dat probíhá v intervalu hodiny, i když to může být 3-4 hodiny zpětně v reálném čase. Kromě vysílání informací na serverech Google GATC nastavuje soubory cookie při každé návštěvě z daného počítače. To slouží k ukládání anonymních informací, jako např. zda byl návštěvník na daném místě již dřív (nový nebo vracející se návštěvník), jaký je čas současné návštěvy, z jakých odkazujících stránek nebo kampaní návštěvník přišel přes vyhledávač, příchod pomocí klíčových slov, banneru, e-mailu apod. Jednotlivé statistiky daných metrik lze rozdělit do 3 základních skupin [11]: • Sledování návštěvníků - počty návštěv, unikátních návštěvníků a zobrazených stránek, demografické charakteristiky – odkud jsou uživatelé, statistiky používaných prohlížečů, operačních systémů, rozlišení obrazovky, loajalita návštěvníků – kolikrát se vracejí na stránky, za jak dlouhou dobu apod. • Obsah a navigace po webu - jaké jsou nejnavštěvovanější stránky, jak se uživatelé po stránkách pohybují, kam přijdou, kudy odejdou, unikátní pohled, analýza používání interního vyhledávání. • Zdrojů návštěvnosti - odkud uživatelé přicházejí, jaká klíčová slova hledají ve vyhledávačích, kolik uživatelů přichází z placených kampaní. Pomocí jednotlivých metrik Gogole Analytics se bude analyzovat daná struktura webu. Z těchto komplexních statistik budou použity jen některé relevantní informace potřebné k analýzám. Sběr dat těchto metrik probíhal v období od 1. října 2008 do 30.dubna 2009. Nejen tyto metriky jsou však použity pro komplexní analýzu webu. Je vhodné si definovat vlastní, které se týkají konkrétní analýzy a druhu webového portálu. Z výše uvedených definic metrik jsou pro další analýzy definovány tyto metriky: • Metrika HUI – Hloubka uložené informace (grafová metrika) • Metrika LNM – Logika navigačního menu (metrika typu MTA) • Metrika MNC – Metrika nejčastějších cest (metrika typu MTC)

8

2.6.2

KAPITOLA 2. ZÁKLADNÍ POJMY ANALÝZY WEBOVÉ STRUKTURY

Metrika HUI

Touto metrikou lze vyjádřit míru dostupnosti informace v závislosti na místě uložení ve struktuře. Tj. do jaké úrovně webové struktury si návštěvník musí dojít pro požadovanou informaci. Celý web lze považovat za orientovaný graf, kde smyčky vyjadřují zkratky do vyšších úrovní struktury. V místě uzlu se nachází požadovaná informace – hypertextová stránka [1]. Čím bude hodnota této metriky menší, tím relativně rychleji se k dané informaci návštěvník dostane. Tento fakt také závisí na správné navigační logice, tj. na výstižných odkazech v menu či zpětných odkazech do vyšší úrovně. Pokud je navigace nevhodná, uživatel stránek je zmaten, čas vyhledání informace je pak o to vyšší. Metrika HUI je vyjádřena číslem vyjadřujícím úroveň uložené informace.

2.6.3

Metrika LNM

LNM metrika zkoumá logické rozložení navigace. Určuje, zda se návštěvník podle menu správně orientuje a jestli klíčové sekce struktury jsou logicky pojmenovány a nejsou zavádějící. Proto pro každou roli návštěvníka může, ale nemusí, hodnocení LNM metrikou vypadat jinak. Dobrá funkčnost navigační logiky zajistí návštěvníkovi rychlý a pohodlný přístup k informacím, které na webu hledá. Tato metrika je vyjádřena sémantickou akcí určující chování návštěvníka v jednotlivých rolích při průchodu struktury.

2.6.4

Metrika MNC

Metrika nejčastějších cest ukazuje vytíženost cest do jednotlivých sekcí a podsekcí webu. Jednotlivé sekce se ohodnotí podle role návštěvníka. Metrika ukáže, které sekce mají velkou návštěvnost a které naopak ne. Výsledkem by mělo být ponechání sekce, rozdělení do více sekcí či sloučení více sekcí do jedné. V tomto případě není brána v úvahu navigační logika, předpokládá se, že se návštěvník za nějaký čas dostane na požadovanou stránku s hledanou informací. Jednotlivé ohodnocení spočívá v počtu přístupů od každé role. Při analýze struktury pomocí metriky MNC se vezme v úvahu určitý počet nejnavštěvovanějších stránek, jejich počet se rozdělí podle jednotlivých sekcí. Tento počet se poté vynásobí ohodnocením dané sekce, do které návštěvník směřoval pro informace. Oceněny jsou jednotlivé položky v navigační logice.

Kapitola 3

Analýza současné webové struktury Analýza současné struktury vychází z definic metrik popsaných v přechozí kapitole. V následujících odstavcích bude popsán současný stav webové struktury – celkové rozvržení, statistiky přístupů a zhodnocení metrik pomocí webového analyzátoru Google Analytics a vlastních webových metrik. Tento způsob analýzy není však jediný, existují alternativní řešení. Jedno z řešení je zaplatit nemalý finanční obnos firmě zabývají se analýzou a optimalizací. Firma posléze veškeré analýzy udělá za nás. Další alternativou jsou komerční a free softwarové nástroje pro analýzu - např. ClickTracks, Google Analytics, WebTrends či NetTracker. V plné verzi těchto nástrojů je k dispozici mnoho různých statistik a webových přehledů. Základní webové statistiky nabízejí například webové servery toplist.cz či blueboard.cz.

3.1

Hlavní stránka webu

Při zobrazení vstupní stránky struktury je k dispozici rozcestník pomocí obrázku, který směruje návštěvníka do jednotlivých částí webu. Zde se nachází také členění na českou a anglickou verzi projektu. Efekt obrázku je poměrně působivý, nicméně takto řešená a rozvržená vstupní stránka není příliš vhodná. Na hlavní stránce stránce by se mělo objevit základní menu se směrováním do jednotlivých struktur webu a základní informace o pracovišti.

3.1.1

Metriky Google Analytics

Nejvíce odchodů z této stránky je na českou verzi stránek (cca 48%), 12% odchodů tvoří stránky FSV ČVUT. 32% tvoří tzv. ukončení stránky – návštěvník stránku opustí. Na vstupní hlavní stránku je to poměrně vysoké procento. Kompletní statistika odchodů návštěníka z hlavní stránky je uvedena v tabulce 3.1. Jednotlivé přechody jsou zvýrazněny na obrázku 3.1. Čas strávený na této stránce je přibližně 52 sekund, což je na takto koncipovanou hlavní stránku poměrně hodně [11].

9

10

KAPITOLA 3. ANALÝZA SOUČASNÉ WEBOVÉ STRUKTURY Sekce CZ EN FSV ČVUT CZ/Mock-Up-CZ EN/Mock-Up-CZ Opuštění webu

Odchody 48% 4% 12% 2% 2% 32%

Tabulka 3.1: Odchody z hlavní stránky webu

Obrázek 3.1: Základní schéma hlavní stránky webu

3.2

Česká sekce webové struktury

Na českou verzi projektu se dostaneme z hlavní stránky kliknutím na část obrázku. Stránka obsahuje vlevo navigační menu s odkazy na příslušné sekce, v dolní části stránky jsou přímé odkazy do jednotlivých sekcí. Na hlavní straně v české sekci je popis činnosti pracoviště. Celkové uspořádání působí trochu chaoticky. Menu v dolní části není přes celou obrazovku, návštěvník si jednotlivých odkazů nemusí všimnout. Základní pojmenování sekcí není úplně ideální, návštěvník musí hledat, než najde odkaz na požadované informace. V pravém horním rohu je k dispozici odkaz na přepnutí stránek do anglické verze. Ve struktuře je však návštěvník vrácen na hlavní stránku anglické verze.

3.2.1

Základní struktura

Ačkoliv hlavní stránka působí dojmem rozsáhlého webu, díky velkému množství odkazů, je základní struktura rozložena do 5 sekcí: • Úvodní statě - tato sekce obsahuje úvod do problematiky výzkumu, kterým se pracoviště zabývá - úložiště radioaktivního odpadu, bentonit a jeho vlastnosti a ložiska, informace o současných výzkumných projektech. • Výzkum v CEG - podle názvu by se zde měly objevovat informace o výzkumu, ale tato sekce spíše popisuje základní vlastnosti materiálů a zemin, dále jsou obsahem teoretické pasáže o různých analýzách - mikroskopie, fyzikální a matematické modelování, atd.

3.2. ČESKÁ SEKCE WEBOVÉ STRUKTURY

11

• Mock-Up-CZ - stránky popisující experiment pracoviště. • Experiment 2002 - stránky popisující experiment pracoviště, v současné době v této sekci webu nic není. • . . . o CEG - zde jsou základní informace o pracovišti, kontakty, popis činnosti, granty, publikační činnost a výuka předmětů.

3.2.2

Metriky Google Analytics

Metrika Zdroj provozu na obrázku 3.2 říká, jakým způsobem se návštěvníci dostanou na analyzovaný web. Polovinu provozu webu tvoří vyhledávače, dle statistik se na prvních místech objevuje google.com a seznam.cz. Mezi odkazující weby patří hlavně česká Wikipedia a stránky FSV ČVUT [11].

Obrázek 3.2: Metrika Zdroj provozu (Google Analytics)

Další obecnější metrikou je podíl jednotlivých prohlížečů. V prohlížečích jasně dominují Internet Explorer a Firefox, webové stránky a veškeré funkční jednotky by měly být optimalizovány hlavně pro tyto dva prohlížeče. Hodnoty zobrazeny na obrázku 3.3. Přístup na web je přibližně z jedné poloviny díky internetovým vyhledávačům, struktura stránek a hlavně samotný kód stránky musí být optimalizován, při vyhledávání určitých slov se dostanou pak na přední pozice výsledku hledání. V následující tabulce je přehled jednotlivých prohlížečů, bráno s ohledem na procentuální návštěvnost stránek.

3.2.3

Metrika HUI

Na obrázku 3.4 je znázorněna metrika HUI pro 10 vybraných informací, pro které by si uživatel mohl do struktury přijít. Jednotlivé úrovně jsou ohodnoceny postupně čísly, hlavní stránka má číslo 1 - 1. úroveň. Toto značení se liší od klasické teorie grafů, kde kořen, tj. v našem případě hlavní stránka, má hloubku 0. Je zřejmé, že některé informace, které návštěvník hledá, by bylo výhodné posunout o úroveň výše, například pro roli studenta má Výuka předmětů HUI=4. Student návštěvník se musí do této úrovně z hlavní stránky nějakým způsobem dostat.

12

KAPITOLA 3. ANALÝZA SOUČASNÉ WEBOVÉ STRUKTURY

Obrázek 3.3: Metrika podle typu prohlížeče (Google Analytics)

Obrázek 3.4: Graf metriky HUI pro hledané informace návštěvníkem

3.2.4

Metrika LNM

Metrikou LNM se provede analýza logického rozložení navigace, zda se návštěvník podle menu správně orientuje a jestli klíčové sekce jsou správně pojmenovány a nejsou zavádějící. Princip této metriky je zachycen na obrázku 3.5. Analýza LNM pro současný stav struktury je popsána pro jednotlivé role: • Student Zvolí pravděpodobně verzi českého webu (český student), pokud si všimne navigačního menu dole na stránce, celkem pohodlně se dostane na stránku předmětů, kontaktů, atd. V opačném případě se zaměří na menu v levé části, má zvolit sekci Úvodní statě, ...o CEG? V této navigační logice není zcela jasné, kde má potřebné údaje hledat,

3.2. ČESKÁ SEKCE WEBOVÉ STRUKTURY

13

Obrázek 3.5: Stavový digram pro vyhledání informací ve struktuře

pokud nakonec najde správnou sekci, jednotlivé odkazy na položky jsou již logicky pojmenovány. • Odborná veřejnost Zvolí si českou - anglickou verzi webu (česká odborná veřejnost, cizinci), na hlavní stránce si všimne odkazu na Grantovou či Publikační činnost V levém menu si všimne výstižného pojmenování Výzkum CEG - nicméně tato sekce spíše popisuje teoretické pasáže a poskytuje materiál pro studium, informace u výzkumu jsou spíše vloženy v sekci Úvodní statě. Informace o experimentech najde v menu poměrně snadno - přímé odkazy do sekce. • Obyčejný návštěvník Zvolí pravděpodobně verzi českého webu (česká veřejnost). Největší přístup k informacím bude zřejmě přímým odkazem Popis činnosti, celkem dobře výstižná je i položka v levém menu Úvodní statě, tato sekce obsahuje úvod do problematiky a výzkumu pracoviště.

3.2.5

Metrika MNC

Jedná se o analýzu struktury podle role návštěvníka, kde každý bude vstupovat do určitých sekcí, ohodnocení bude spočívat v počtu přístupů od každé role. Na obrázku 3.6 je znázorněno hned několik dělení toku dat. Jedná se o základní strukturu české verze se základním dělením do sekcí. Oranžová barva značí oblast s nejvyšším procentuálním podílem zobrazení stránek - podíl od každé role, zelené podbarvení vyznačuje nejvytíženější sekci nejfrekventovanějších stránek. Z obrázku 3.6 vyplývá, že nejvíce průchodů strukturou webu z hlediska role návštěvníka by teoreticky mělo být přes sekci ceg-uvod. Podle metrik z Google Analytics je nejvytíženější cesta do sekce ceg-vyzkum. Z deseti nejfrekventovanějších stránek jde osm právě sem. Při

14

KAPITOLA 3. ANALÝZA SOUČASNÉ WEBOVÉ STRUKTURY

Obrázek 3.6: Základní struktura a rozdělení podle sekcí

analýze struktury pomocí metriky MNC se pro hodnocení bere v úvahu 25 nejnavštěvovanějších stránek. Celý princip je zachycen ve stavovém diagramu na obrázku 3.7. Polovina přístupů na stránky je pomocí vyhledávače, tedy přímou cestou na stránku ve struktuře. V opačném případě je cesta k informaci směrována přes strukturu webu, ohodnocena je podle vstupu do příslušné sekce. Hodnoty MNC lze vynést do grafu pro jednotlivé sekce s patřičným ohodnocením. I přes nejvíce ohodnocenou sekci ceg-uvod je největší podíl cest do sekce o výzkumu. Sekce s experimentem vykazují MNC malé hodnoty, proto by bylo dobré zvážit, zda tyto dvě rozdělené sekce nějakým způsobem nesloučit. Na obrázku 3.8 je zobrazena analýza MNC současné struktury pro nejfrekventovanější stránky na webu. Podrobnější analýzu jednotlivých sekcí, zejména těch, které jsou nejčastěji využívány, získáme pomocí metrik z Google Analytics. Na obrázku 3.9 je seznam s nejvíce jedinečným zobrazení stránek, tj. zobrazení, kdy se počítá při opakovaném prohlížení pouze jednou. Podle této metriky je největší zájem je o informace týkající se teoretických pasáží problematiky související s výzkumem pracoviště.

3.3

Celkové zhodnocení analýzy

Současná webová struktura byla hodnocena z několika hledisek. Díky webovému analyzátoru Google Analytics se mohly použít klasické webové metriky pro získání potřebných údajů. K těmto metrikám byly přidány další tři - HUI, LNM a MNC, které vycházejí ze současné struktury a náplně celého webového projektu.

3.3. CELKOVÉ ZHODNOCENÍ ANALÝZY

15

Obrázek 3.7: Stavový diagram ohodnocení sekcí

Analýza byla prováděna na struktuře internetových stránek Centra experimentální geotechniky (CEG), pracoviště Fakulty stavební ČVUT v Praze. CEG zajišťuje výuku předmětů Mechanika zemin a hornin, Výzkum ukládání radioaktivního odpadu. Dále se pracoviště zabývá vědeckou a experimentální činností z oblasti geotechniky, materiálů a podzemí. Stránky mají interaktivní vazbu na jeden experiment pracoviště pomocí on-line kamery.

3.3.1

Hodnocené prvky

Analyzována byla vstupní stránka projektu, kam návštěvníci nejčastěji odcházejí a proč. Bylo zjištěno, že přibližně polovina všech návštěv stránek je pomocí vyhledávačů. Nejčastějším webovým prohlížečem je Internet Explorer a Firefox. Pomocí metrik se zkoumala struktura a rozložení informací v celém projektu - hloubka dosažitelnosti informace. Prozkoumána navigační logika, zda funguje a odkazuje na správné relevantní informace dané sekce. Byly určeny role návštěvníka a na jejich základě byly ohodnoceny jednotlivé sekce pro metriku, která nám zachycuje význam informace pro návštěvníka s průchodem v dané sekci.

3.3.2

Závěr analýzy

Současná webová struktura není optimální. Na základě výše provedených analýz je potřeba celkovou webovou strukturu přepracovat, lépe specifikovat a rozdělit jednotlivé sekce pro lepší navigaci a orientaci v uložených informacích v podobě hypertextových dokumentů. Většina návštěvníků používá českou verzi webu, jako vhodné řešení se nabízí dynamický odkaz na přepínání jazyka webu v celkové navigaci. Je potřeba přesněji specifikovat základní navigační menu a zvolit výhodnější rozložení stránky v hlavní stránce index.html. Po této úpravě by procento odchodů z hlavní stránky mělo podstatně klesnout. Podle výsledků použitých metrik by bylo přínosné přesunout některé informace do vyšší úrovně a naopak. Dále je nutné rozdělit některé sekce díky časté návštěvnosti na základě

16

KAPITOLA 3. ANALÝZA SOUČASNÉ WEBOVÉ STRUKTURY

Obrázek 3.8: Graf metriky MNC pro jednotlivé sekce webu

Obrázek 3.9: Statistika přístupů podle Google Analytics

dostupnosti informace. Podrobnější realizace změn ve struktuře je popsána v následující kapitole.

Kapitola 4

Návrh optimalizace webové struktury Návrh nové struktury webu vychází z použitých metrik a informací získaných z webového analyzátoru. Na základě analýz, které byly provedeny na současné struktuře, jsem došel k závěrům, jakým způsobem strukturu předělat. Návrh je rozdělen na dvě části: uspořádání celé struktury a rozvržení hlavní stránky webu.

4.1

Vstupní stránka

Podle tabulky 3.1 odchází většina návštěvníků do české struktury webu. Hlavní stránka bude obsahovat navigační menu do jednotlivých částí struktury. Základní struktura návrhu nové vstupní stránky je zobrazena na obrázku 4.1. Diagram zachycuje směřování návštěvníka z hlavní stránky do dalších částí struktury. Výběr cizojazyčné verze struktury nebude pouze součastí hlavní stránky, přepnutí jazyka bude možné v jakémkoliv místě struktury do stejného místa struktury v jiném jazyce. Základní návrh celé struktury webu je na obrázku B.1 v příloze na konci práce.

Obrázek 4.1: Diagram nové základní struktury vycházející ze vstupní stránky

4.1.1

Analýza nové vstupní stránky

Jednotlivé sekce jsou pojmenovány tak, aby bylo zřejmé, které informace se v dané sekci nacházejí. Zjednodušená logika navigačního menu umožní snadnější orientaci ve struktuře.

17

18

KAPITOLA 4. NÁVRH OPTIMALIZACE WEBOVÉ STRUKTURY

Návštěvník tak nebude mít problém s navigací a hledáním potřebných informací.

4.2

Vnitřní struktura webu

Jednotlivé sekce jsou členěny na další podsekce, pro základní oblasti webu jsou na diagramech v příloze práce znázorněny jejich jednotlivé struktury. Tyto změny byly provedeny na základě výsledků metriky HUI, snahou bylo některé informace přesunout do vyšší úrovně pro lepší dostupnost. Podle výsledku metriky MNC byly jednotlivé sekce s experimenty sloučeny do jedné, rozdělení na konkrétní experimenty je provedeno až v této sekci.

4.2.1

Navigační zkratky

Důležitou vlastností navigační struktury jsou navigační zkratky. Pokud by se tato struktura hodnotila metrikou LNM, jednotlivé role návštěvníka nebudou mít problém s logikou navigace. Jednotlivé položky v navigační logice jsou výstižně pojmenovány. Bude-li se například chtít návštěvník z úrovně Činnost pracoviště dostat přímo na stránku Výzkum bez použití zkratek, musí se nejprve vrátit na hlavní stránku. Možné zkratky jsou znázorněny ve struktuře červenými šipkami (pouze ukázkově) na obrázku 4.2.

Obrázek 4.2: Diagram vnitřní struktury s navigačními zkratkami

4.2.2

Analýza vnitřní struktury metrikou HUI

Nová vnitřní struktura je analyzována metrika HUI, kde se vezmou k porovnání stejné požadadované informace, které byly použity pro analýzu stávající struktury. Hodnoty této metriky jsou podstatně nižší než u původní struktury. Z toho vyplývá, že se uživatel stránek dostane k informacím o něco rychleji. Obrázek 4.3 znázorňuje metriku HUI, hodnoty nedosahují ani úrovně 3.

4.3. POUŽITÍ METRIK PRO ANALÝZU

19

Obrázek 4.3: Graf metriky HUI pro novou strukturu

4.3

Použití metrik pro analýzu

Pro analýzu struktury je použita pouze taková metrika, která není závislá na on-line provozu webu, kde se sbírají informace o návštěvníkovi procházející určitá místa ve struktuře. Metriky závislé na provozu webu se použijí až na finální návrh, po nasazení nové struktury. Proto pro analýzu tohoto návrhu struktury je použita metrika HUI, popř. LNM. Obě tyto metriky nejsou závislé na provozu webu na internetu.

20

KAPITOLA 4. NÁVRH OPTIMALIZACE WEBOVÉ STRUKTURY

Kapitola 5

Syntéza návrhu s požadavky CEG Současná struktura webového portálu, která byla analyzována, není zcela kompletní. V nové optimalizované struktuře se objeví některé nové prvky a požadavky, některé položky budou odstraněny. Navrhovaná struktura je tedy sjednocena s požadavky a vyhodnocena některými metrikami, které byly použity v analýze současné struktury. Po této syntéze je celkový návrh struktury konečný a připraven k implementaci.

5.1

Požadavky CEG na obsahovou stránku webu

Následuje seznam položek, které by měla navrhovaná struktura obsahovat, nejedná se o požadavek na samotnou strukturu, ale pouze o informace a materiály, které se zde budou nacházet: • O CEG – Kontakty – Popis činnosti – Historie pracoviště • Pedagogická činnost – Materiály pro studenty • Experimentální výzkum – Přehled zkoušek a materiálových vlastností ∗ Objemové a měrné hmotnosti ∗ Zrnitostní rozbor ∗ Váhová a objemová vlhkost – Nakládání s radioaktivními odpady ∗ Problematika ukládání odpadů ČR ∗ Bentonit, ložiska bentonitu

21

22

KAPITOLA 5. SYNTÉZA NÁVRHU S POŽADAVKY CEG

∗ Požadavky na vlastnosti bentonitů – Experimentální činnost ∗ Malé a střední modely fyzikálních barier ∗ Mock-Up-CZ, Dismantling, TIMODAZ – CIDEAS • Akreditovaná laboratoř • Publikační činnost • UEF-Josef

5.2

Proces syntézy

Celkový návrh základní struktury bude vycházet ze dvou základních modelů: • Model dle analýzy současného stavu • Požadavky a doplnění podkladů od CEG Postup změny původně navržené struktury na finální je na obrázku 5.1.

Obrázek 5.1: Schéma procesu syntézy

5.3. VÝSLEDNÝ NÁVRH MAPY PORTÁLU CEG

5.3

23

Výsledný návrh mapy portálu CEG

Celková struktura je ve finální podobě rozdělena do 5 základních sekcí. Striktně je oddělen základní popis pracoviště, výuka a výzkum pracoviště. Následující obrázek zachycuje základ finální struktury, celkový proces syntézy je znázorněn a obrázku B.2 v příloze na konci této práce. V každé příslušné sekci a v každém místě struktury webu existují navigační zkratky pro rychlejší pohyb a orientaci. Způsob realizace těchto zkratek je popsán v implemetační části práce.

Obrázek 5.2: Základní struktura finálního návrhu

5.4

Metriky finálního modelu struktury

Finální model je ohodnocen metrikou HUI a LNM, tedy metrikami, které nevycházejí z dat z webového analyzátoru Gogole Analytics. Pro tyto metriky jsou použity stejné vstupní údaje, které byly použity pro analýzu současného stavu struktury.

5.4.1

Vyhodnocení metriky HUI

Po úpravě struktury a syntéze s požadavky se výsledky této metriky shodují s výsledky navrhované struktury před syntézou. Požadované informace jsou rychle dostupné - základní údaje jsou všechny v první úrovni struktury webu, největší hodnota HUI je rovna 3, tj. tato struktura má tři úrovně hierarchie webu, které podchycují nejdůležitější informace, které se dají na tomto webu získat. Výsledky metriky HUI jsou zobrazeny na obrázku 5.3.

5.4.2

Vyhodnocení metriky LNM

V takto navrhované struktuře by jednotliví návštěvníci s určitou rolí neměli mít problém s orientací a navigací ve struktuře. Obyčejný návštěvník najde základní informace hned v první sekci. Jednotlivé položky menu jsou jasně a logicky pojmenovány. Odborník v roli návštěvníka bude přímo směrován logikou menu do sekce s výzkumem pracoviště, kde mu jsou k dispozici i experimenty pracoviště. Studenti a učitelé mají rychlý přístup ke kontaktům na jednotlivé osoby pracoviště či sekce věnované výuce. Pro ilustraci je uvedeno vyhodnocení metriky LNM pro roli Odborníka:

24

KAPITOLA 5. SYNTÉZA NÁVRHU S POŽADAVKY CEG

Obrázek 5.3: Graf metriky HUI pro finální model struktury

• Pomocí lokalalizace webového prohlížeče webová aplikace rozpozná, zda se jedná o českého odborníka či zahraničního (nastaví anglickou verzi webu automatiky) - v sekci o výzkumu nalezne všechny informace týkající se dané problematiky, pohodlně se z této sekce dostane i k experimentům. Celá navigace základní struktury s aktuální pozicí ve struktuře je vždy dobře viditelná a dostupná.

5.5

Závěr analýzy webové struktury

Současná struktura webu vykazuje některé nedostatky, které byly zjištěny při jednotlivých analýzách. Výsledek navrhované nové struktury by tyto nedostatky měl odstranit. Pro návrh nové struktury byly použity pouze ty metriky, které se aplikovaly na současný stav a byly schopny vyjádřit nějaký výsledek bez statistiky přístupů jednotlivých uživatelů, tj. bez provozu webu na internetu. Právě tento způsob analýz využívá webový analyzátor Google Analytics, kde se sleduje jednotlivá návštěvnost, vstupy na stránky atd. Pro navrhovanou verzi nelze tyto metriky použít, lze z nich pouze vyvodit závěry, jakým způsobem vylepšit současný stav. Proto nová struktura musí být nejdříve implementována, poté zanalyzována zmiňovaným analyzátorem. Na základně těchto výsledků se posoudí, zda nový návrh struktury byl úspěšný či nikoliv.

Kapitola 6

Implementace konečného návrhu Na základně analýz byla vytvořena finální struktura webu. V této kapitole je popsána její implementace. Samotná implementace opět závisí na požadavcích CEG na daný systém. Výběr systému vyjde z několika kandidátů, ve zvoleném frameworku se následně implementuje navržená struktura.

6.1

Framework CMS

Jako druh webového frameworku je vybrán systém pro správu obsahu (CMS). Koncepce CMS se hodí pro tuto implementaci nejvíce, zejména kvůli jednoduché správě celého systému, řízení přístupu k uloženým informacím na webu či definování jednotlivých rolí uživatele. CMS také umožňuje velmi snadnou a efektivní manipulaci s obsahem webu a celé struktury bez zásahu do zdrojového kódu, umožňuje tak spravovat obsah webu i ne zcela zkušeným programátorům webových aplikací [8].

6.2

Požadavky CEG na webový framework

Mezi základní požadavky na systém je snadná správa celého webu - přehledné administrátorské rozhraní, průhledné definování uživatelů a jejich práv k obsahu. Správce systému by neměl nic programovat, proto je vybrán typ CMS. Dalším důležitým požadavkem je podpora vícejazyčného systému s možností přidání překladu k danému článku. Dále by systém měl obsahovat kvalitní editor na psaní článků, vkládání obrázků, revize u článků, snadný export-import dat, systém by měl mít možnost vývoje do budoucna a kvalitní podporu a dokumentaci pro uživatele systému. Nasazená technologie musí být stabilní a server, na kterém systém poběží při běžném provozu nesmí být exktrémně zatěžován. Implementovaný systém není jediný, který na tomto serveru poběží.

6.3

Výběr vhodného CMS frameworku

Z výše uvedených požadavků patří volba typu frameworku CMS vhodné řešení způsobu realizace optimalizované struktury. Prezentace a správa informací na internetu je v dnešní

25

26

KAPITOLA 6. IMPLEMENTACE KONEČNÉHO NÁVRHU

době triviální záležitostí právě díky CMS systémům. Na trhu jich je celá řada, nicméně jejich hlavní fuknce je u všech stejná. CMS se ani tak neliší svou funkčností, ale způsoby a metodami s různými vlastnostmi, které tvoří základní principy celého systému. Jedná se o řízený způsob prezentace dat z databáze na internetu. Rozdíly mezi CMS jsou právě ve schopnosti publikace informace a používání standartního uživatelského rozhraní. Nelze říci, který CMS je nejlepší, vždy je potřeba brát v úvahu i požadavky a fuknce, které jsou od systému očekávány. Základní kritéria pro volbu systému s požadavky CEG na systém jsou následující: • existující lokalizace v národním jazyce • schopnost včleňovat nové prvky do systému • průhledná správa překladů webu do dalších jazyků • generování validního XHTML kódu se SEO optimalizací • rychlá a pohodlná tvorba struktury či její změna Jak již bylo zmíněno, extistuje celá řada systémů, ale zdaleka ne všechny však odpovídají uvedeným požadavkům. Pracoviště CEG již používá pro jinou webovou prezentaci CMS systém Plone, nabízí se tak řešení, použít tento systém i pro tuto implementaci. Výběr byl však proveden z množiny dalších systémů s porovnáním nasazeným systémem Plone. Mezi systémy, které nabízejí takové fuknce a možnosti, které by splnily základní kritéria, patří: Plone, Drupal, Joomla! a WebGUI. Právě z těchto systémů byl vybrán nejvíce vhodný pro implementaci struktury na základně vzájemného porovnání a vyzkoušení. Základní porovnání vlasností systému je pomocí CMS Matrix [7].

6.3.1

Plone

Framework Plone je jeden z mnoha CMS systémů, které složí k pohodlné správě obsahu a dat. Je vyvíjen v jazyce Python a implementován pomocí frameworku Zope, který je kompletně také napsán v Pythonu. Zachycuje pracovní postup publikování dokumentů, kde je potřeba vytvořenou položku zveřejnit či předat ke schválení. Po zveřejnění je tato položka dostupná nepřihlášenému uživateli.

Obrázek 6.1: Uložení dat v databázi Plone [8]

6.3. VÝBĚR VHODNÉHO CMS FRAMEWORKU

27

Systém používá jako úložiště dat transakční objektovou databázi (ZODB), běžící na aplikačním serveru Zope. První verze systému byla vydána v roce 2001, v současné době je nejnovější verzí Plone 3.2.2 z počátku dubna letošního roku. Plone generuje validní XHTML a CSS kód podle standardů W3C s optimalizací SEO pro vyhledávače. Dále zaručuje přístupnost pro nevidomé či uživatele s jakýmkoliv dalším zdravotním handicapem. Mezi silnou stránku tohoto systému určitě patří bohatá funkcionalita a podpora mnoha cizích jazyků bez přidání jakýkoliv dalších produktů do systému. Pomocí dalších doplňků lze významně změnit layout a vzhled stránky [8].

6.3.2

Drupal

Drupal je Open Source CMS naprogramovaný v jazyce PHP využívající databázi MySQL, PostgreSQL a v nově chystané verzi i databázi Oracle. Výhodou tohoto systému je, že běží prakticky na každém webovém hostingu. Systém je založen na MVC architektuře a celkové modularitě, kde veškerá funkčnost včetně činnosti jádra je rozdělena do jednotlivých modulů. Díky této vlastnosti je velice flexibilní a poskytuje API pro rozšiření systému o další funkce [5].

Obrázek 6.2: MVC architektura systému Drupal [5]

Architektura databáze je založena na jednotce „node“, prvek obsahu. Mezi jednotky patří cokoliv, co se publikuje, tj. článek, příspěvek, anketa či vlastní definovaný typ jednotky. Podle oprávnění od administrátora systém umožňuje, psát komentáře naprosto ke všemu. Drupal má vlastní vyhledávací jádro, po přidání modulu lze pohodlně generovat mapu webu či použít funkce RSS. Mezi kladné stránky patří přátelská URL, umožňuje tak definovat více aliasů k jedné stránce, při lokalizaci cizího jazyka lze tuto vlasnost plně využít jako lokalizované cesty

28

KAPITOLA 6. IMPLEMENTACE KONEČNÉHO NÁVRHU

(/en/welcome-to-drupal/ a cs/vitejte-v-drupalu/). Tento systém má velmi propracovaný modul autorizace, na všechno lze nastavit oprávnění - od možnosti psát článek, tvořit blogy či sekce, mazat diskuzi až po práva překládat články apod. I přes velkou flexibilitu má tento systém záporné stránky. Pro začínající uživatele by mohla být matoucí neobvyklá terminologie, která se používá pro tvorbu obsahu. Místo použití výrazu „taxonomie“, „slovník“ či „uzel“ by bylo srozumitelnější říkat „obsah“, „kategorie“, „článek“, atd. Systém nemá zcela intiutivní rozhraní pro správu a celkovou administraci. Díky své modularitě je Drupal po základní instalaci velmi omezený, uživatel podle potřeby přidává další moduly. Bohužel často tyto moduly nejsou vždy zpětně kompatiblní s danou verzí systému, a proto uživatel musí hledat jiné alternativy cesty k požadované funkci či modulu [5].

6.3.3

Joomla!

Joomla! je další Open Source CMS systém, který je napsán kompletně v PHP a založen na modelu MVC. Na rozdíl od Drupalu je tento systém napsán objektově. Běží nad MySQL databází. Překlad slova „Joomla“ znamená „všechno dohromady“ či „vcelku“. Základní instalace tak obsahuje poměrně hodně fukncí. Tento CMS je daleko více propracovaný co do grafických možností a šablon. Jako Drupal je založen na jednotlivých modulech, ne však tak výrazně. Joomla! dovoluje administrátorům nastavit globální konfigurační parametry, které mají vliv na každý článek. Lze tak definovat, jaké články od autora se zveřejní pro všechny návštěvníky. Základním nedostatkem je neúplné definování oprávnění uživatele. Tvorba struktury není flexibilní, umožňuje definovat pouze jednoduché sekce a kategorie. Jakákoliv manipulace se strukturou není snadná. Článek je většinou třeba smazat a vytvořit znovu na zvoleném místě [6].

6.3.4

WebGUI

WebGUI je poměrně kvalitní CMS systém napsaný kompletně v Perlu. Tento CMS obsahuje mnoho funkcí, které jsou vhodné pro různé organizace. Systém má konzistentní uživatelské rozhraní, umožňuje tak třídit obsah do jednoduché hierarchie s mnoha vlastnostmi, které pomáhají při tvorbě obsahu (například fuknce drag-and-drop při tvorbě obsahu). WebGUI precizně odděluje styly a obsah stránky, což umožňuje rychlou a snadnou správu obsahu. Jako přechozí systémy používá friendly URL, nepoužívá tedy nevhodné ID pro přidělení názvu stránky [10]. Základní verze je poměrně bohatá co do funkčnosti, kvalitní API umožňuje vývojářům rychlé přidání nových funkcí. Rozšiřující vlastnosti systému jsou přidávány pomocí WEbGUI pluginů. Ačkoliv tento systém má podporu jazykové lokalizace, podpora češtiny není velká. Systém a správa překladu také značně zaostává za ostatními zmiňovanými systémy.

6.4

Porovnání základních vlastností CMS

Následující tabulka 6.1 srovnává jednotlivé vlastnosti každého systému. V tabulce jsou uvedeny požadavky, které by daný systém měl splňovat. Pokud je u dané vlastnosti uvedeno

6.5. TESTOVÁNÍ JEDNOTLIVÝCH CMS Vlastnost/CMS Databáze Jazyk Aplikační server Drag-N-Drop Čisté URL Šablony Funkce zpět Překlady Správa překladů Více-jazyčný obsah Fotogalerie Mapa webu UTF-8 podpora WYSIWYG Editor

Plone Zope Python Zope ano ano ano ano ano ano ano omezeno ano ano ano

Drupal MySQL,Postgres PHP PHP 4.3.5+ ano ano omezeno ano ano omezeno ano ano omezeno ano omezeno

29 Joomla! MySQL PHP PHP ne ano ano ne omezeno omezeno omezeno omezeno omezeno ano ano

WebGUI MySQL Perl Perl mode ano ano ano ano omezeno ne ano ano ano ano ano

Tabulka 6.1: Srovnání vlastností vybraných CMS

„omezeno“, znamená to, že daný CMS systém tuto vlastnost přímo nepodporuje, a je nutné pro požadovanou fuknci přidat správné a kompatibilní moduly s verzí systému. Jednotlivé vlastnosti jsou porovnány pomocí webu CMS Matrix [7].

6.5

Testování jednotlivých CMS

Srovnání jednotlivých vlastností ještě nestačí ke konečnému rozhodnutí, který systém pro implementaci zvolit. U vybraných systémů je třeba vyzkoušet základní fuknce a tvorbu struktury webu. Základní demoverze vybraných CMS lze vyzkoušet přímo on-line na webu. Pro prověření a vyzkoušení instalace byl systém Drupal a Joomla! testován na virtuálním OS Linux pomocí VMware Playeru. Plone a WebGUI byly vyzkoušeny on-line na webu, včetně administrace a základní tvorby struktury. Některé postřehy jsou již zmíněny u popisu jednotlivých systémů v kapitole 6.3. Celkové shrnutí jednotlivých systémů: • Plone - tento systém byl vyzkoušen přímo na webu, veškeré úpravy a tvorba struktury jsou poměrně snadné. Má velmi kvalitní správu překladů či snadnou manipulaci, propojování a tvorby celého obsahu. Po přidání příslušných doplňků lze pomocí tohoto systému nahrávat více souborů najednou, což u ostatních systémů nebylo prakticky možné. Nedostatkem je nepřenositelnost databáze. Aplikační server Zope má svojí specifickou databázi, kterou nelze bez problémů přenést na databázi MySQL popř. Oracle, kterými disponují ostatní zmiňované systémy. Ačkoliv Plone má velmi dobrý šablonovací systém, s přechodem na novější verze dochází k menším problémům s layoutem stránky webu.

30

KAPITOLA 6. IMPLEMENTACE KONEČNÉHO NÁVRHU

• Drupal - velice snadná klikací instalace, menší problém se objevil u nastavení přístupových práv v jádře PHP. Celá administrace působila zmateně, zabralo nějaký čas než byly zjištěny a pochopeny jednotlivé fuknce systému. Podle požadavků na systém bylo nutné doplnit velké množství modulů (v základní instalaci systému je jen de facto jádro systému). Narazil jsem na problém s nekompatibilitou některých verzí modulů a to i po vyzkoušení několika variant. Systém začal zastavovat běh Apache server s MySQL databází při generování galerií, nebyl jsem schopen nalézt takový modul, který by byl opět kompatibilní se systémem. Domnívám se, že díky velkému nárůstu modulů kvůli dosažení správné funkčnosti systému se systém stal méně stabilním. • Joomla! - tento systém má opět snadnou instalaci pomocí webového rozhraní. Zde nastal problém s manipulací struktury. Pokud bylo nutné článek, popř. celou skupinu přesunout na jinou úroveň struktury, nebylo to prakticky možné. Struktura se musela na novém místě vytvořit znovu, bez nějaké efektivní možnosti přesunu z původního místa. Ačkoliv tento systém graficky působí velmi elegatně, s funkčností je to slabší. Práva uživatelů lze nastavit pouze globálně a ještě navíc hodně omezeně. • WebGUI - systém byl vyzkoušen přímo na webu. Velmi přijemné administrátorské prostředí s jednoduchou tvorbou, i přes naistalování několika doplňků nebyla správa překladů moc plnohodnotná a dostatečně funkční, proto dál tento systém nebyl podrobně zkoumán.

6.6

Konečná volba CMS

Po srovnání vlastností a základním vyzkoušení všech vybraných systému, jsem dospěl k závěru, že nejlepším řešení pro tvorbu nové struktury je systém Plone. Vycházel jsem ze základních požadavků, které byly kladeny na systém. Jak ve srovnání jednotlivých fukncí, tak i v samotném testování tohoto systému splňoval Plone uvedené požadavky nejlépe. V jednotlivých bodech je uvedeno, proč jsem se rozhodl právě pro tento systém: • Plná lokalizace češtiny - tuto vlastnost mají téměr skoro všechny zkoumané CMS. V některém systému však nebyla úplná (např. WebGUI). • Manipulace s daty a tvorba struktury - velká přednost Plone, pohodlné, rychlé a flexibilní pro přesuny či změny dat. • Podpora vícejazyčné struktury - jednoduchá správa překladů, články se zobrazují jen v tom jazyce, ve kterém jsou napsány nebo přeloženy. Pokud překlad do cizího jazyka určité stránky neexistuje, systém nabídne uživateli výběr jazyka, ve kterém je stránka k dispozici. • Doplňky v systému - pro splnění požadavků nebylo nutné do systému přidávat velký množství dalších doplňků, téměr veškeré fuknce jsou v základní instalaci. Protiklad v tomto bodě byl Drupal, do kterého bylo nutné přidat velké množství modulů. • Celkový dojem - práce s tímto systémem byla příjemná a téměř bezproblémová. Plone má kvalitní uživatelskou podporu se srozumitelnou dokumentací celého systému.

6.7. FUNKČNÍ BLOKY IMPLEMENTACE

6.7

31

Funkční bloky implementace

Struktura webu je rozdělena na jednotlivé bloky, které mají konkrétní vlastnosti a funkce, které vzájemně spolupracují. Z těch bloků vychází pak celková implementace struktury. Z požadavků CEG a z výsledků analýz vyplývá, že jeden z nejdůležitějších bloků je správná navigační logika, dynamické přepínání jazykové verze webu či editace článků s překlady do dalších jazyků.

6.7.1

Přístupná navigace webu

Kromě samotného obsahu je navigace jeden z nejdůležitějších prvků každé webové stránky. Úloha navigace je poměrně jednoduchá - převést uživatele z jedné stránky na druhou. Reprezentuje samotnou strukturu webu a aktuální pozici ve struktuře, kde se uživatel nachází. Základní vlastnosti přístupné navigace jsou následující [4]: • Oddělení od obsahu • Konzistentní napříč celým webem • Týká se pouze určeného webu • Srozumitelné odkazy

6.7.2

Navigace navrhované struktury

K základní navigaci jsou použity nadpisy, které jsou ve struktuře položeny nejvýše. Tato první úroveň bude tvořit statické menu, průchodem strukturou se nebude měnit. Další úrovně, které jsou tvořeny nadpisy jednotlivých sekcí uvnitř struktury, budou v navigaci generovány dynamicky. Dynamické menu je generováno kliknutím na položku v hlavním statickém menu a zobrazí strukturu druhé úrovně. Takto lze generovat navigaci do dalších úrovní struktury, pokud je dostupná. Systém Plone, který byl zvolen pro implementaci, umožňuje definovat horizontální a vertikální navigaci. V horizontální navigaci jsou definovány základní odkazy do jednotlivých součástí struktury, vertikální navigace navíc obsahuje externí odkazy související se strukturou.

6.7.3

Přepínání jazykové verze webu

Základním požadavkem CEG je vícejazyčná verze struktury. Přepínání jazyka je na každé stránce realizováno pomocí symbolu vlaječky. Při přepnutí jazyka uživatel zůstane logicky v aktuální pozici ve struktuře, nebude tedy přesměrován na hlavní stránku zvoleného jazyka. Pokud nebude překlad do zvoleného jazyka dané stránky k dispozici, uživatel bude informován o tom, ve které jazykové verzi je k dispozici požadovaný překlad.

32

6.7.4

KAPITOLA 6. IMPLEMENTACE KONEČNÉHO NÁVRHU

Ukázka funkčních bloků

Na obrázku 6.3 jsou zobrazeny jednotlivé funkční bloky implementace. Položky pod Výzkumem jsou generovány dynamicky a nejsou tak v základní navigaci. Horizontální a vertikální na- vigace zvýrazňuje aktuální pozici ve struktuře. Celá cesta do aktuálního místa struktury je generována pod horizontální navigací. K přepínání jazykové verze slouží vlaječky umístěné v pravé části stránky ve stejné poziční úrovni, jako celá cesta struktury. Ve výřezu obrázku 6.3 nejsou bohužel vidět.

Obrázek 6.3: Ukázka funkčních bloků v konečné implementaci

6.8

Nasazení frameworku a tvorba struktury

Instalace je rozdělena na 2 základní kroky - instalace Zope serveru a vytvoření instance Plone. Instalační balíčky existují pro různé operační systémy. Jelikož systém poběží na Linuxovém serveru, postup instalace pomocí tzv. Unified Installer je následující [9]: Instalace Zope server v režimu Klient-Server: ./install.sh zeo

6.8. NASAZENÍ FRAMEWORKU A TVORBA STRUKTURY

33

Vytvoření instance Plone: ./install.sh zeo --instance=nova_instance Instalace vyžaduje knihovny gcc, g++ a Python v minimálních verzích. Nové instance Plone lze také přidávat přes grafické rozhraní ZMI (Zope Management Interface) Zope serveru. Podrobnější popis instalace a nasazení systému je popsán v Instalační příručce C. Mezi přidané doplňky patří Google Site Maps pro snadnější indexaci stránek ve vyhledávači Google, FlashUpload pro nahrání více souborů najednou na server a LinguaPlone pro podporu překladů stránek do dalších jazyků. Posledním doplňkem je Plonegalleryview, který umožňuje ze složky obsahující fotografie, automaticky vygenerovat fotogalerii.

6.8.1

Použitá verze Plone

Pro implementaci byla zvolená poslední dostupná verze Plone 3.2.2 s nejnovějším aplikačním serverem Zope 2.10.7-final a jazykem Python 2.4.5.

6.8.2

Tvorba struktury v Plone

Struktura v Plone se tvoří poměrně jednoduše a pohodlně. Při založení nové položky ve struktuře je vhodné dávat souborům krátké názvy, tento název se parsuje bez mezer a diakritiky na URL vytvořené položky. Samotný název lze zpětně změnit, jeho URL zůstane stejná. Díky materiálům od CEG, které obsahovaly poměrně hodně obrázků, byl často využit produkt na tvorbu galerií či nahrání více souborů najednou. Pro ostrý provoz bylo nutné vytvořit i překlady základních stránek struktury do anglického jazyka. Implementace byla prováděna on-line v nové instanci Plone na do časné adrese, po dokončení byla přesunuta na konečnou adresu: http://ceg.fsv.cvut.cz

6.8.3

Screenshoty konečné implementace

Obrázky 6.4 a 6.5 zachycují výsledek implementace struktury v Plone. Pro ukázku jsou vybrány jen určité části, nikoliv kompletní stránka webu. Grafická prezentace struktury není součástí této bakalářské práce.

34

KAPITOLA 6. IMPLEMENTACE KONEČNÉHO NÁVRHU

Obrázek 6.4: Vstupní stránka do struktury webu

Obrázek 6.5: Horizontální navigace s aktuální pozicí ve struktuře

Kapitola 7

Závěr Celkové zhodnocení úspěšnosti návrhu optimalizované struktury je provedeno zpětnou analýzou. Bezprostředně po implementaci struktury byl zahájen sběr statistických dat z provozu webu na internetu. Na základě těchto statistických údajů je v poslední kapitole zhodnocena celková práce a její přínos.

7.1

Zpětná analýza pomocí Google Analytics

Sběr dat začal k 1. květnu 2009, kdy základní optimalizovaná struktura s implementací byly dokončeny. Vyskytl se však jeden problém. Implementace byla nasazena na původní adresu webu, veškeré vyhledávače včetně Googlu měly v paměti zaindexovanou starou strukturu. Vyhledávače aktualizují indexy v závislosti na aktuálnosti jednotlivých stránek, resp. jak často se stránky mění. V CMS Plone byl přidán doplněk Google Sitemaps, který efektivněji indexuje stránky pro vyhledávač Google. Ani tento doplněk nepomohl. Tento problém se projevil ve statistikách Google Analytics, kde se tak objevovaly stránky, které již neexistují. Začátkem června se situace zlepšila a došlo ve vyhledávačích zaindexování stránek nového webu. Jeden z předkladů byl snížit procento odchodů ze vstupní stránky, podle statistik se tento odchod povedl o 10 procent snížit oproti původnímu stavu struktury.

7.1.1

Metrika MNC

Na obrázku 7.1 je zobrazena metrika MNC pro 25 nejnavštěvovanějších stránek. Pro srovnání jsem vzal stejný počet jako při analýze původní struktury. Díky charakteru webu je přístup do části struktury o výzkumu markatní. Kvůli sloučení některých sekcí (stránky o experimentu byly přesunuty pod výzkum) je hodnota MNC o něco vyšší než v původní analýze. Vytíženost této sekce nevadí, veškeré informace jsou směrovány do jednoho bodu první úrovně struktury, v dalších úrovních se již člení podle charakteru výzkumu.

7.1.2

Bounce rate

Nepřesný překlad Bounce rate z angličtiny znamená poměr návratů stránky. Jedná se o míru návštěvy jedné stránky vůči ostatním. V praxi to znamená situaci, kdy návštěvník

35

36

KAPITOLA 7. ZÁVĚR

Obrázek 7.1: Metrika MNC

přijde na určitou stránku, poté klikne na externí odkaz, popř. web zavře. Čím je bounce rate menší, tím lépe a návštěník webu neopouští strukturu hned v prvním bodě návštěvy, prochází strukturu dále [11]. Vzal jsem celkový bounce rate za určité období před a po optimalizaci a výsledky porovnal. Z dlouhodobějšího trendu je bounce rate menší po optimalizaci struktury. Na obrázku 7.2 je tento trend zobrazen pro 2 stejně dlouhá období: • Před optimalizací a původní struktura - zelená barva • Po optimalizaci a implementaci nové struktury - modrá barva

Obrázek 7.2: Srovnání celkového bounce rate před a po optimalizaci

7.2

Celkové zhodnocení

Na základně vlastních definovaných metrik a statistik z Google Analytics je optimalizovaná struktura lépe uspořádana než ta původní. V práci byly použity určité metody analýzy struktury, které lze aplikovat na podobné projekty. Jedná se zejména o školní webové prezetance, na tyto projekty lze použít definované metriky, které se objevují v této práci. Dalším

7.2. CELKOVÉ ZHODNOCENÍ

37

přínosem je srovnání jednotlivých CMS systémů v určitém směru vyplývající z jednotlivých požadavků na jeho fuknci, v tomto případě požadavky vědeckého pracoviště CEG. Analýzy byly prováděny na české části struktury a výsledný návrh se použil jak pro českou, tak i anglickou verzi struktury. Alternativní možností by bylo analýzy kompletně oddělit a vytvořit nezávislé řešení pro každý jazyk. Dohromady by pak vznikla jedna komplexní struktura vytvořená z více částí. Do těchto částí by uživatel přistupoval pomocí přepnutí jazykového kontextu webu. Pro samotnou analýzu lze definovat další metriky. Bylo by například vhodné vytvořit metriky více spjaté se studií HCI, v této práci se k této studii váže metrika LNM. Optimalizovaná struktura byla implementována kompletně v češtině a v základu byl vytvořen anglický obraz pro cizince. Pro úplnost implementace je nutné dopřekládat zbytek struktury do anglické verze. Použitý CMS framework Plone není určitě jediné řešení implementace. Dokáži si představit vytvoření této struktury například v Drupalu se stejnou funkčností jako v Plone. Avšak z mých získaných zkušeností při testování CMS systémů by to nebyl rozhodně lehký úkol. Webová struktura CEG byla analyzována, optimalizována a následně pomocí CMS Plone implementována. Předpoklady, které vycházely ze závěrů analýzy, byly potvrzeny zpětnou analýzou konečného návrhu. Lze tedy říci, že celý proces analýzy s optimalizací byl úspěšný.

38

KAPITOLA 7. ZÁVĚR

Literatura [1] Devanshu Dhyani and Wee Keong Ng. A survey of web metrics. In ACM Computing Surveys (CSUR), pages 469–503. Nanyang Technological University, Singapore, 2002. [2] P. Paul G. Strupp. An introduction to web metrics. http://www.libqual.org, stav z 30. 5. 2009. [3] R. Pecinovský. Návrhové vzory. Computer Press s.r.o, Brno, 1st edition, 2007. In Czech. [4] D. Špinar. Tvoříme přístupné webové stránky. Zoner Press, 1st edition, 2004. In Czech. [5] CMS Drupal - dokumentace systému. http://drupal.org/handbooks/, stav z 7. 12. 2008. [6] CMS Joomla! - dokumentace systému. http://help.joomla.org/, stav z 23. 10. 2007. [7] CMS Matrix - porovnávání vlastností cms. http://www.cmsmatrix.org/matrix/cms-matrix/, stav z 12. 6. 2009. [8] CMS Plone - dokumentace systému. http://plone.org/documentation/manual/, stav z 14. 6. 2008. [9] CMS Plone - instalace produktu. http://plone.org/documentation/phc_topic_area?topic=Installation/, stav z 14. 6. 2008. [10] CMS WebGUI - dokumentace systému. http://www.webgui.org/, stav z 4. 6. 2009. [11] Google analytics. http://www.google.com/analytics/, stav z 30. 4. 2009. [12] HCI bibliography - definition of HCI. http://hcibib.org/, stav z 23. 3. 2009. [13] The Web Modeling Language. http://www.webml.org/webml/page1.do, stav z 20. 5. 2009. [14] W3C technical reports and publications. http://www.w3.org/TR/#Recommendations, stav z 13. 4. 2009.

39

40

LITERATURA

Příloha A

Seznam použitých zkratek API Application Programming Interface CEG Centrum experimentální geotechniky CMS Content Management System CSS Cascading Style Sheets DOM Document Object Model FSV Fakulta stavební GATC Google Analytics Tracking Code HUI Hloubka uložené informace LNM Logika navigačního menu MNC Metrika nejčastějších cest MTA Measure to Analyze MTC Measure to Control PNG Portable Network Graphics RSS Rich Site Summary SEO Search Engine Optimization SVG Scalable Vector Graphics UML Unified Modeling Language W3C The World Wide Web Consortium WebML Web Modeling Language XHTML Extensible HyperText Markup Language

41

42

XML Extensible Markup Language ZMI Zope Management Interface ZODB The Zope Object Database

PŘÍLOHA A. SEZNAM POUŽITÝCH ZKRATEK

Příloha B

Diagramy webové struktury B.1

Návrh optimalizace struktury

Na obrázku B.1 je zobrazena základní struktura po analýzách a optimalizaci, na kterém jsou zřejmé jednotlivé úrovně webu. Ačkoliv jsou kontakty fyzicky uloženy v sekci O CEG, pro lepší dostupnost je v základní navigaci symbolický link do místa struktury této sekce.

B.2

Proces syntézy finální struktury

Proces syntézy zachycuje konečnou úpravu návrhu optimalizované struktury po požadavku CEG. Přerušovaná černá čára vyznačuje, které položky ve struktuře se v procesu syntézy neměnily. Červená čára značí změnu od původního návrhu. Podle podkladů CEG se některé stránky sloučily (Činnost pracoviště a Popis pracoviště), sekce Experimenty byla přesunuta pod Výzkum. Jelikož tato sekce neměla podle analýz vysokou četnost přístupů, lze ji přesunout o jednu úroveň ve struktuře níže. Celý proces je zachycen na obrázku B.2.

43

44

PŘÍLOHA B. DIAGRAMY WEBOVÉ STRUKTURY

Obrázek B.1: Návrh optimalizace struktury

B.2. PROCES SYNTÉZY FINÁLNÍ STRUKTURY

50

Analýza struktury webu a její optimalizace

INDEX

«link»

45

INDEX

O CEG «link»

«link»

Činnost pracoviště

«link»

Popis Pracoviště

«link»

Výzkum

«link»

Výzkum odpadů

«link»

Fyz. a mat. vlastnosti

«link»

Bentonit

«link»

Vlasnosti materiálů

Popis č innosti

«link»

«link» «link»

Kontakty

Historie pracoviště

Výzkum

«link»

Přehled zkoušek a materiálových vlastností

«link»

Radioaktivní odpady

Bentonit

«link»

«link»

Experimenty pracoviště

CIDEAS

«redirect» «link»

Experimenty

«link»

«link»

«link»

Experiment 2002

«link»

Mock-UP-CZ

Výuka

«link»

Výuka «link»

«link»

Vyuč ované předměty

Povinné předměty

Pomůcky pro studenty

«link»

Akreditovaná laboratoř

«link»

Publikace

«link»

Laboratoře

«link»

Kontakty

«redirect»

Web - kamera

«redirect»

UEF - JOSEF

«redirect»

UEF - JOSEF

«redirect»

FS ČVUT

«redirect»

FS ČVUT

Obrázek B.2: Proces syntézy finální struktury

46

PŘÍLOHA B. DIAGRAMY WEBOVÉ STRUKTURY

Příloha C

Instalační a uživatelská příručka Instalační příručka popisuje postup nasazení CMS systému Plone pod OS Windows XP a Linux Debian. V další části je popsána tvorba struktury pod tímto systémem. Použitá verze Plone pro nasazení je 3.2.2, veškeré postupy se váží k této verzi systému [9].

C.1

Požadavky na operační systém

• Windows XP nebo vyšší • OSX 10.4.x nebo vyšší • Linux 2.6.x nebo vyšší CMS Plone je napsán kompletně v jazyce Python, pro verzi Plone 3.x je potřeba verze Python 2.4, novější verze 2.5, 2.6 nebo 3.0 nejsou podporovány.

C.2

Doporučené hardwarové prostředky

• 2GHz CPU • 1GB RAM - pro rozsáhlejší portály Plone • 2GB místo na disku

C.3

Spuštění Plone pod Windows XP

Instalace pod Windows XP je poměrně snadná, skládá se z několika kroků - instalace Plone s aplikačním serverem Zope a vytvoření instance Plone, tj. jednoho portálu. Postup je popsán v následujích bodech: 1. Stáhnout instalační balíček pro Windows z adresy: http://plone.org/products/ plone/releases/3.2.2

47

48

PŘÍLOHA C. INSTALAČNÍ A UŽIVATELSKÁ PŘÍRUČKA

2. Spustit instalaci balíčku. Automaticky se nastaví port serveru Zope (standartně naslouchá na 8080) a port instance Plone (standartně 80). 3. Spustit Plone Controller, který se nachází v C:\Program files\Plone. Tento controller lze zavolat přímo z instalce balíčku - na jejím konci. Pomocí tohoto GUI se nastavují jednotlivé porty či se spouští Zope server a přistupuje se k administraci instancím Plone pomocí ZMI. K tomuto rozhraní se lze dostat přes webový prohlížeč: http://localhost:8080/manage 4. Po autorizaci stačí ve slože root, kde jsou uloženy jednotlivé instance, vytvořit novou vybrat Plone site pomocí Add v pravé části tohoto rozhraní. Nová instance je dostupná na adrese: http://127.0.0.1:8080/nova_instance

C.4

Spuštění Plone pod distribucí Linux Debian

Zde je postup instalace téměř stejný (vytvoření instance pomocí ZMI), liší se pouze základní instalací - pomocí standartních instalačních balíčků Debianu. Instalce pomocí atp-get: apt-get install plone Start/Stop Zope serveru: /etc/init.d/zope start Debian použivá nestandartní porty, Zope server běží na 9673.

C.4.1

Unified Installer

Pro Unix-like systémy byl od verze Plone 3 vytvořen komplexní instalační balíček, který obsahuje všechny potřebné knihovny a vzájemné závislosti. Tento způsob instalace nabízí 2 různé strategie nasazení Zope serveru: • Stand-alone Zope - testování, základní funkčnost. • ZEO Klient/Server konfigurace - klasické nasazení, více procesů sdílející ZODB, ladění. Pro použití této instalace je potřeba mít nainstalováno: gcc, g++, GNU make, GNU tar, bzip2 a gzip. Základní postup při instalaci v režimu ZEO. 1. Stáhnout instalační balíček Unified Installer z adresy: http://plone.org/products/ plone/releases/3.2.2 2. Instalace v režimu ZEO:

C.5. VYTVÁŘENÍ STRUKTURY V PLONE

49

./install.sh zeo 3. Pomocí této instalace lze vytvořit jednotlivé instance Plone: ./install.sh zeo --instance=nova_instance Zde je potřeba v adresáři vytvořené instance v souboru buildout.cfg nastavit správné porty a nakonec provést update pomocí: bin/buildout

C.5 C.5.1

Vytváření struktury v Plone Vytvoření položky

Po instalaci a vytvoření instance lze vytvářet strukturu webu. Aby uživatel mohl manipulovat se strukturou musí mít příslušná práva. Všechny vytvořené položky jsou ve výchozím nastavení přidány do navigace, každou položku však lze z navigace odstranit. Druhy položek které lze vytvořit, jsou zobrazeny na obrázu C.1.

Obrázek C.1: Vytvoření položky

C.5.2

Vložení odkazů

Důležitou funkcí při tvorbě struktury je linkování jednotlivých položek na nějaké místo ve struktuře. V Plone to lze velmi efektivním způsobem. Při editaci textu se zvolí vložení externího či interního linku a vybere se položka ve struktuře, na kterou se link má vázat. Takto lze velmi pohodlě celou strukturu provázat. Způsob zadání linku je na obrázku C.2.

50

PŘÍLOHA C. INSTALAČNÍ A UŽIVATELSKÁ PŘÍRUČKA

Obrázek C.2: Vložení interního linku

C.5.3

Zveřejnění stránky

U každé položky je možnost nastavit časové období zveřejnění této položky pro nepřihlášené návštěvníky stránek. Po vytvoření položky se automaticky nestává zveřejněnou, tato vlastnost se musí vždy nastavit. Tímto lze vytvořit určitý pracovní postup, kdy jeden správce stránek vytvoří nějakou položku a jiný tuto položku zkontroluje a zveřejní.

C.5.4

Nastavení navigace

V nastavení portálu lze definovat jednotlivé vlastnosti navigace: • Generovat položky automaticky - implicitně dostanou všechny položky vytvořené v nejvyšší úrovni svůj globální navigační oddíl. Vhodné pro automatické generování navigace, pokud je potřeba navigaci tvořit ručně, tak lze tuto volbu vypnout. • Vytvářet panely pro jiné položky než složky - standardně bude jakákoliv položka v kořenovém adresáři portálu zobrazena samostatně. Pokud tato volba bude vypnuta, bude ve vertikálním statickém navigačním menu pouze položka typu složka. • Zobrazované typy položek - pro každý druh položky lze definovat, zda bude implicitně zahrnuta do navigace.

Příloha D

Obsah přiloženého CD • README.TXT • text - bakalářská práce v PDF a zdrojové kódy pro Latex – figure - adresář obrázků k práci pro Latex • analyza - diagramy struktury po optimalizaci a konečný návrh po syntéze • webStruktura - vykopírovaná implementovaná struktura webu

51