Vysoká škola ekonomická v Praze Fakulta informatiky a statistiky Katedra informačních technologií Student: Vedoucí bakalářské práce: Oponent bakalářské práce: Jiří Frank prof. Ing. Zdeněk Molnár, CSc. Ing. Vladimír Brdek, Ph.D. TÉMA BAKALÁŘSKÉ PRÁCE Audit webových stránek e-shopů ROK: 2011
Prohlášení Prohlašuji, že jsem bakalářskou práci zpracoval samostatně a že jsem uvedl všechny použité prameny a literaturu, ze kterých jsem čerpal. V Praze dne 9.5.2011 Podpis 2
Poděkování Tímto bych rád poděkoval vedoucímu práce prof. Ing. Zdeňku Molnárovi, CSc. za neustálou ochotu, maximální vstřícnost, cenné rady, ale také za velkou trpělivost. Dále pak Lubomíru Jungwirthovi za poskytnutý web k praktické části auditu. 3
Abstrakt Tato práce popisuje základní metodiky auditu webových stránek a obecné zásady, které by měl dodržovat každý web. Metodiky jsou zaměřeny na hodnocení technických náležitostí a grafické podoby, dále pak na analýzu SEO aspektů, návštěvnosti a výkonnosti. Navržená sada hodnotících prostředků je poté prakticky aplikována při auditu konkrétního internetového obchodu a jeho hlavních konkurentů. Z analytické části jsou vyvozeny závěry a doporučení, které jsou uvedené v závěrečné kapitole. Tyto návrhy by měly pomoci zlepšit současný stav obchodu. Hlavní přínos práce spočívá v definování ucelené základní sady metodik, které lze efektivně používat v praxi. Abstract This paper describes the basic methodology of the auditing of websites and general principles that should be followed by each site. Methodologies focus on the evaluation of technical requirements and graphic design, as well as analysis of the aspects of SEO, traffic and performance. This proposed set of evaluation techniques is then practically applied in the audit of one particular online store and its main competitors. Conclusions and recommendations are drawn from the analysis and these are discussed in the final chapter. These recommendations should help improve the current state of trade. The main contribution of this work is in defining a comprehensive set of essential methodologies that can be effectively applied in practice. 4
Obsah 1. Úvod... 7 1.1. Cíle práce... 7 1.2. Struktura práce... 8 2. Metodiky hodnocení webových stránek... 9 2.1. Cílová skupina... 9 2.2. Technické zásady dobrého webu... 9 2.3. Grafické ztvárnění webu... 19 2.4. Zhodnocení SEO a SEM... 21 2.5. Analýza návštěvnosti... 29 2.6. Metodiky zvyšování výkonnosti webu... 31 2.7. Analýza výkonnosti e-shopu... 34 3. Analýza webových stránek vybraných internetových obchodů... 37 3.1. Současný stav obchodu... 37 3.2. Stanovení hlavní konkurence... 37 3.3. Cílová skupina... 38 3.4. Výběr metodik testování... 38 3.5. Analýza technických náležitostí... 38 3.6. Zhodnocení SEO a SEM... 46 3.7. Analýza návštěvnosti... 49 3.8. Analýza výkonnosti e-shopu... 53 3.9. Srovnávací tabulka... 54 4. Návrhy a doporučení pro zlepšení aktuálního stavu obchodu... 55 4.1. Zobrazování v jednotlivých prohlížečích... 55 4.2. Přístupnost a použitelnost... 55 5
4.3. Velikost webu... 55 4.4. Použitý značkovací jazyk a styly... 55 4.5. Grafické ztvárnění webu... 56 4.6. SEO a SEM... 56 4.7. Nákupní proces... 57 4.8. Závěrečné slovo k návrhům... 57 5. Závěr... 58 6. Terminologický slovník... 60 7. Zdroje... 62 8. Přílohy... 64 8.1. Příloha 1 Graf trhu prohlížečů ve světě... 64 8.2. Příloha 2 Graf trhu prohlížečů v ČR... 65 8.3. Příloha 3 Hodnocení webu uživateli... 66 8.4. Příloha 4 Srovnávací tabulka... 67 6
1. Úvod S webovými stránkami se setkává velká většina z nás denně při práci a zábavě, prakticky kdykoliv a kdekoliv, pokud sháníme nějakou informaci a máme k dispozici internet. Internet prodělal za poslední roky obrovský rozvoj z hlediska širokého rozšíření a přístupové rychlosti. S tím samozřejmě souvisí měnící se požadavky na webové stránky, již nám nestačí strukturovaný text, díky vysokým rychlostem si můžeme dovolit tvořit stránky plné grafiky, interaktivních prvků a dalších vizualizací, náročných na přenesená data. V České Republice má internetové připojení více než 50% domácností a přes 90%společností s větším počtem než deset zaměstnanců [1], což dává internetu jako takovému obrovský potenciál. V podstatě se zde vytvořil další kanál, na kterém lidé sdílejí informace, komunikují, nakupují a dělají mnoho dalších věcí, které toto médium umožňuje. Za těchto okolností zároveň roste dramaticky počet nových webových stránek. Tyto technologie jsou tak běžné, že většina techničtěji zaměřených středoškoláků dokáže udělat nějaký web. Díky tomu se také poměrně často setkáváme s nekvalitními weby, které jsou pro běžného uživatele nepřehledné, pomalé a neoptimalizované. Dalším častým problémem webů je malá návštěvnost nebo nezájem ze strany návštěvníků i přes to, že daný web nabízí např. kvalitní informace a dané téma je pro uživatele zajímavé. 1.1. Cíle práce Prvním cílem práce je definování základních metodik pro audit internetových stránek, pomocí kterých bude možné zhodnotit stránku ze všech zásadních úhlů pohledu. Těchto metodik může být celá řada. Tato práce je zaměřena primárně na technickou stránku, grafickou podobu, SEO analýzu a analýzu návštěvnosti, protože tyto aspekty považuji za klíčové pro výslednou úspěšnost webu. Druhým cílem bude teoretické poznatky převést do praxe a aplikovat je na internetový obchod s osvětlením "Svetlaaosvetleni.cz". Zároveň je nutné podrobit této analýze i jeho hlavní konkurenty z důvodu identifikace potenciálních konkurenčních výhod a nevýhod. Výstupem by měl být obraz skutečnosti, který zmapuje současný stav definovaných internetových obchodů. 7
Třetím a závěrečným cílem, vyplývajícím z předchozích dvou, bude případný návrh zlepšení, která by měla přispět ke zvýšení efektivity obchodu, návštěvnosti či funkčnosti tak, aby bylo dosahováno co nejlepších prodejů. 1.2. Struktura práce Kapitola první zahrnuje úvod, cíle a strukturu práce. Hlavní část práce je věnována tématu a to s rozdělením do třech hlavních kapitol. Ve druhé kapitole se zabývám teoretickou částí nazvanou metodiky hodnocení webových stránek, která řeší první cíl. Další kapitola je věnována druhému cíli a to praktické části analýzy webů. Podstatou třetí kapitoly a zároveň třetím cílem je návrh zlepšení současného stavu webu. Po těchto třech kapitolách následuje stručné shrnutí celé práce nazvané jako závěr. Aby byl v obraze i méně znalý čtenář, uvádím jednoduchý terminologický slovník. Úplně na závěr jsou k dispozici použité zdroje, obrázky a tabulky, které jsou díky svému rozsahu umístěny v sekci přílohy. 8
2. Metodiky hodnocení webových stránek Před samotným auditem konkrétní stránky je třeba stanovit pravidla, kterých by se měla každá dobře napsaná stránka držet. Je nezbytné testovat jak technické aspekty dané realizace, tak obsahovou, vizuální i statistickou stránku webu. V několika následujících kapitolách je definována metodologie, která dokáže bezpečně analyzovat jakoukoliv webovou stránku z hlediska všech klíčových aspektů. 2.1. Cílová skupina Při tvorbě stránky by si měl každý autor položit základní otázku. Pro koho bude web určen? Pokud jsme schopni cílovou skupinu relativně dobře definovat, víme, kdo bude web navštěvovat. Tak můžeme navrhnout web, obsah, vzhled i marketing takovým způsobem, aby byl pro danou skupinu optimální. Pokud víme, že na stránce budeme nabízet kočárky, naši návštěvníci resp. návštěvnice budou pravděpodobně ženy. Pokud víme, že na stránce budeme nabízet chytré telefony, největší procento uživatelů bude mladšího věku. Veškeré takto zjištěné informace by měl zásadně odrážet design, marketing či případné optimalizace. 2.2. Technické zásady dobrého webu Kvalitu každé stránky definuje zejména technická realizace a obsah. Tou důležitější je na počátku technická realizace i přesto, že není na první pohled vidět. Její význam spočívá v jedné zásadní věci. Pokud máme skvělý obsah, kvalitní články a výborné autory, nemusí to vůbec nic znamenat, neboť při špatném zobrazování či chybné optimalizaci nebude uživateli vycházet vstříc. Stránka by měla být technicky realizovaná takovým způsobem, aby podpořila svým precizním kódováním kvalitní obsah. 2.2.1. Obecné zásady Při tvorbě webu je důležité dodržovat pravidla. Některá z nich jsou velice zásadní a nelze je opomíjet. Naopak je třeba se jimi zabývat ve všech etapách webu. 2.2.1.1. Znaková sada Poměrně důležitou záležitostí je použitá znaková sada. Pokud bude špatná, nelze zaručit dobré zobrazování všech znaků pro všechny uživatele, v různých jazycích a ve 9
všech kvalitních prohlížečích. Pro český jazyk jsou nejrozšířenější znakové sady Unicode (konkrétně implementace UTF-8), Windows-1250 a ISO 8859-2. Sada Unicode je na rozdíl od zbylých dvou určena pro použití všemi jazyky najednou, tj. v případě máme-li web lokalizován do více jazyků, pak je více než výhodné toto kódování použít. Mezi další výhody patří shodné zobrazování znaků ve všech moderních operačních systémech. Problém nastává v případě, kdy znaková sada není definována. Pak se automaticky použije výchozí sada prohlížeče a web bude s největší pravděpodobností absolutně nečitelný. 2.2.1.2. Zobrazování v jednotlivých prohlížečích Internetové prohlížeče jsou zprostředkovateli mezi webovými stránkami a jejich uživateli. To ony zobrazují obsah, vykreslují obrázky, graficky ztvárňují značky v kódu a mnoho dalších záležitostí, které uživatel považuje za samozřejmé. Na světě je hned několik ústředních prohlížečů a poměrně dost dalších, méně významných. Z této různorodosti vyplývá velká pravděpodobnost, že některé prohlížeče budou zobrazovat stránky jinak než ostatní. Tento problém dělá stále už řadu let vrásky nejednomu kodérovi. V posledních letech se snaží výrobci důsledněji dbát standardů definovaných konsorciem W3C a obsah vypadá téměř shodně nebo velice podobně ve většině případů a ve většině prohlížečů. Převládajícím problémem bývá prohlížeč Internet Explorer 6 od firmy Microsoft. Ten byl dodáván spolu s operačním systémem Windows XP a poměrně velký počet uživatelů ho používalo nebo stále používá. Situace se v posledních letech pomalu zlepšuje. Lidé přechází od zastaralých prohlížečů typu IE6 k modernějším jako je např. Opera, Firefox nebo Chrome. Otázkou je, zda se vyplatí optimalizovat stránky i pro IE6. Odpověď je jednoduchá. Tento prohlížeč používá celosvětově cca 11% uživatelů. U stránky s 10 000 přístupy denně je to 1100 lidí a to rozhodně není zanedbatelné množství. Proto lze považovat stránku, které se nezobrazuje korektně v nejrozšířenějších prohlížečích, za velký problém. V příloze 1 je aktuální rozdělení prohlížečů mezi uživatele na celém světě, v příloze 2 v České republice. 10
2.2.1.3. Použitelnost Použitelnost je spíše doporučením než technickou zásadou, ale s technikou zpracování přímo souvisí. Pokud je web použitelný, nečiní uživatelům problém najít informaci, pro kterou přišli. Informaci by měli najít v rozumném čase a bez velkého přemýšlení. Bez složitého uvažování by též měli být schopni identifikovat jednotlivé odkazy, kam směřují, kde se nachází menu a další ovládací prvky či informace. 2.2.1.4. Přístupnost Pokud tvrdíme o stránce, že je přístupná, znamená to, že je uzpůsobena i pro návštěvníky s určitou formou postižení. Může se jednat např. o barvoslepost, nevidomost či hluchotu. Tato přístupnost se může dále týkat návštěvníků pracujících ve zhoršených podmínkách (ovládání webu bez myši, na mobilním zařízení a dalších). Pokud budeme dbát přístupnosti, vycházíme těmto lidem vstříc maximální možnou mírou. Abychom měli stránky přístupné i pro tyto skupiny návštěvníků, je nutné důsledně dodržovat pravidla přístupnosti 1. Obsahem těchto pravidel jsou zejména požadavky na alternativní texty k netextovým prvkům na stránce, dobrá orientace i bez použití obrázků a barev a dostatečné strukturování webu značkami. Dodržování těchto norem je z mého hlediska etické, funkční a nijak výrazně neztěžuje samotný vývoj. Výsledkem může být web, se kterým si bez problémů poradí i hlasové moduly pro nevidomé. Bude se v něm snadno orientovat i člověk, který je barvoslepý. Projdeme ho jednoduše bez myši nebo si ho zobrazíme funkčně na telefonu. 2.2.1.5. Layout Volba druhu layoutu je zásadní pro výslednou podobu stránek. Tato problematika je natolik rozsáhlá, že zde není prostor pro přesný popis techniky tvorby jednotlivých layoutů. Jako základ pro orientaci postačí názvy (odkazují na TAGy nebo na techniku, kterou využívají). Názory, jak dělit layouty webu jsou poměrně rozmanité, nicméně toto základní členění splňují všechny layouty [2]. a) Tabulkový b) Rámcový c) CSS layout 1 Pravidla přístupnost dostupné například na této webové stránce http://www.pravidla-pristupnosti.cz/ 11
Tabulkový layout je poměrně starý přístup k návrhu webu. Jeho výhodou je, že se dá relativně jednoduše a rychle stylovat (dříve byl nejběžnější dvou nebo třísloupcový layout). Na složité grafické návrhy se tento layout moc nehodí, špatně se s ním pracuje. Mezi další nevýhody patří v některých prohlížečích vykreslování tabulky až poté, co je zcela načtena. Rámcový layout je vcelku zastaralou technikou, které se používá velice výjimečně. Problémový je zejména tisk, indexování roboty, zobrazování na mobilních zařízeních a v neposlední řadě se i stěží graficky upravuje. CSS layout je v současné době nejmodernější, nejaktuálnější a nejčastější přístup k layoutu. Kombinuje rychlost, úspornost a logickou strukturovanost kódu [3]. Při změně vzhledu není nezbytně nutný zásah do HTML kódu. Pro tvorbu webu je doporučován zpravidla tento layout, málokdy je výhodnější použít některý z předešlých. 2.2.1.6. Mapa webu Tato sekce by měla být součástí každého webu a to hned z dvou důvodů. Uživatel se může podívat na strukturní členění stránek a získat tak lepší přehled o tom, kde co najde. Druhý důvod je významově orientovaný na funkci vyhledávačů, vyhledávačům pak při procházení (crawlingu) daného webu stačí přijít do této sekce a získat tak seznam celého webu k bezproblémovému indexování. Mapa webu by měla být nejen funkční (pro vyhledávače) ale i přehledná (pro uživatele). 2.2.1.7. Robots.txt, Sitemap.xml Textový soubor robots.txt slouží k ovlivnění indexování webu robotem (vyhledávačem). Můžeme zde nadefinovat, kam se má robot prioritně dívat, a naopak kam se vůbec dívat nemá. Tento soubor by měl vždy existovat, i když bude prázdný. Jinak dojde při každém pokusu o stažení tohoto souboru k vyvolání chybové stránky, což zbytečně překáží v chybovém logu. Pokud by pokus o stažení souboru skončil chybou serveru (stavový kód 500), může dojít k vyřazení všech stránek z indexu vyhledávače. [4] Oproti tomu sitemap.xml je výčtem stránek webu v jazyce XML o přesné struktuře 2. Tento soubor není nutné vytvářet, ale taktéž pomáhá při indexaci. 2 Přesnou strukturu tohoto souboru včetně popisu jednotlivých značek můžeme nalézt na http://sitemaps.org/protocol.php 12
2.2.1.8. Favicon Jedná se o ikonku, kterou můžeme pozorovat například u záložky otevřené stránky, v oblíbených položkách webového prohlížeče nebo v rámci zástupce na ploše. Bývá ve velikostech 16x16 pixelů ve formátu ICO, ale lze ji definovat i v jiných formátech jako je v PNG nebo JPG. Pokud bude ikona umístěna v rootu webu a bude se nazývat favicon.ico, není třeba na ni speciálně odkazovat. Používání ikonek je účelné, dobře vypadá, napomáhá uživatelům v orientaci a tvoří poznávací znamení webu. 2.2.1.9. Velikost webu Poměrně důležitým faktorem je samotná velikost stránek. A to nejen z pohledu uživatele, který nerad vyčkává při načítání stránky, ale i z pohledu vyhledávače. Jako maximální velikost webu se udává 100 kb, optimálně pak 40 kb. Vyhledávače preferují stránky úsporné na velikost. V případě, že je stránka příliš veliká, robot může z důvodu příliš dlouhého načítání odejít. Pokud chceme velikost stránek zmenšit, pak je vhodná komprimace obrázků, skriptů a případně i rozdělení stránek na menší celky. 2.2.2. Použitý značkovací jazyk a styly Tato problematika je velice rozsáhlá. Na použití XHTML 1.0 nebo HTML 4.01 je poměrně dost názorů. Ve výsledku není, až tak důležité v jakém jazyce je web nakódován, ale zda je v něm nakódován správně. O HTML 5 není účelné prozatím hovořit, je implementován pouze u několika nejnovějších prohlížečů. Ve svých závěrech budu v této kapitole vycházet z použití značkovacího jazyk XHTML1.0, který používá celosvětově více než 60% webů 3. Obrázek 1 - Podíl jednotlivých značkovacích jazyků na webových stránkách. Zdroj: Powermapper.com 3 Zdroj: http://try.powermapper.com/demo/statsversions.aspx 13
2.2.2.1. Druhy XHTML Při použití XHTML máme na výběr ze tří DTD a) Strict b) Transitional c) Frameset XHTML Strict 4 omezuje použití některých značek kvůli oddělení formy od obsahu, forma se přesouvá do kaskádových stylů (CSS). XHTML Transitional 5 je uzpůsoben pro přechod mezi HTML a XHTML, jedná se o přechodovou vrstvu. Není tak přísná, co se týče zákazu používání značek definujících formu. XHTML Frameset 6 dovoluje použití rámů pro rozdělení okna na dvě a více části. Nejvýhodnější a formálně nejsprávnější bývá až na výjimky používaní DTD XHTML Strict. Každá změna formální podoby stránek bude jednodušeji a rychleji proveditelná díky použití CSS. 2.2.2.2. Validita Pokud řekneme o stránce, že je validní, znamená to, že splňuje syntaktická pravidla daná svým DTD. DTD je soubor pravidel, oproti kterým lze stránku validovat 7. Těchto pravidel je celá řada a je dobré se jich držet. Vyhneme se tak pochybné interpretaci stránky prohlížečem nebo vyhledávačem. 2.2.2.3. Správné strukturování značek Správné umisťování značek do dokumentu je jedním ze základních kamenů problematiky zvané SEO. Zásluhou dobře posouzeného obsahu prohlížečem je používání a správné začlenění značky. Samozřejmě s adekvátním počtem výskytů. Příklad dobře navržené struktury by mohl vypadat takto: 4 DTD XHTML 1.0 Strict dostupný zde:http://www.w3.org/tr/xhtml1/dtds.html#a_dtd_xhtml-1.0- Strict 5 DTD XHTML 1.0 Transitional dostupný zde: http://www.w3.org/tr/xhtml1/dtds.html#a_dtd_xhtml- 1.0-Transitional 6 DTD XHTML 1.0 Frameset dostupný zde: http://www.w3.org/tr/xhtml1/dtds.html#a_dtd_xhtml- 1.0-Frameset 7 Otestovat stránku lze např. na stránkách konsorcia W3C http://validator.w3.org/ 14
<h1>nadpis webu</h1> <h2>nadpis kapitoly</h2> <p>obsah kapitoly</p> <p>další odstavec kapitoly<p> <h3>podnadpis kapitoly</h3> <ul> <li>výčet bodů závěru kapitoly</li> <li>výčet bodů závěru kapitoly </li> <li>výčet bodů závěru kapitoly </li> </ul> <h2>název další kapitoly na stránce</h2> <p>obsah další kapitoly</p> 2.2.2.4. Výstupy na jednotlivých zařízeních Abychom zajistili specifický výstup pro zařízení typu počítač, tiskárna nebo mobilní zařízení, lze využít vlastnost kaskádových stylů. Ty nám umožňují rozlišit, pro které zařízení je daný styl určen. Existuje 10 typů 8 různých zobrazovacích scénářů. V praxi jsou k vidění ve většině případů jen tyto: a) Screen určený pro výstup na obrazovce počítače b) Projection určený pro prezentace nebo výstup na projektoru c) Print určený pro tisk (měl by být úsporný jak barevně, tak obsahově,ale přehledný) 2.2.3. Použité technologie a jejich vliv na funkčnost Každá webová stránka používá určité technologie, které zásadně ovlivňují její funkčnost, použitelnost a bezpečnost. 2.2.3.1. Pěkné adresy Velké množství dnešních webů používá tuto technologii. Důvodů je několik. Vcelku jednoduše se tato funkcionalita vytváří a je efektní a funkční. Uživatel nechce zkoumat nepřehledný tvar adresy, ale na první pohled jasně vidět, kde se nachází. http://www.spatnyweb.cz/index.php?kategorie=prvni&subkategorie=druha (špatně) http://www.dobryweb.cz/clanky/kategorie/prvni/druha (dobře) 8 Kompletní přehled pro CSS verze 2 lze nalézt zde: http://www.w3.org/tr/css2/media.html 15
2.2.3.2. Používání sessions a cookies V této problematice mnoho programátorů chybuje. Tím může sobě i uživateli způsobit poměrně velké nepříjemnosti. Zásadní rozdíl mezi cookies a sessions je ten, že cookies se ukládají v prohlížeči (pokud to prohlížeč umožní, tuto funkcionalitu lze ve většině prohlížečů vypnout a zapnout) a sessions se ukládají na serveru. Cookies si tedy může kdokoliv přečíst, sessions nikoli. Špatné použití může způsobit jak bezpečností, tak funkční problém. Uvedu dva příklady špatného použití se správným řešením. a) Informace, zda je uživatel přihlášen (v horším případě i s heslem a dalšími osobními údaji) se uloží do cookies v tomto případě se používají jedině sessions, v případě cookies může jakákoliv cizí osoba se základními znalostmi této problematiky získat citlivé údaje nebo se dostat na zabezpečenou stránku bez oprávnění b) Informace, zda uživatel vyplnil anketu se ukládá do cookies řešení pomocí cookies je možné, ale nikoliv dostačující. Pokud uživatel vypne cookies, může hlasovat v anketě bez problémů i víckrát. Je vhodné tuto situaci ošetřit ukládáním IP adresy do databáze. Tuto situaci u nepřihlášených uživatelů nelze řešit se 100% úspěšností. 2.2.4. Interaktivní prvky Poslední roky prodělávají velký rozvoj technologie, které umožňují stránku různými způsoby vizualizovat. Ať už se jedná o grafické efekty nebo o funkce, které umožňují modifikovat obsah stránky s novými daty bez znovunačtení stránky. Jedná se zejména o Flash (jeho málo rozšířenou obdobu Silverlight) nebo Javascript s asynchronní výměnou dat se serverem tzv. AJAXEM. Další obrovský rozvoj proběhl na poli sociálních služeb (zejména Facebook, Twitter nebo Youtube). Přirozeně na to zareagovali tvůrci stránek se snahou integrovat ve větší či menší míře tyto služby i na své stránky. 2.2.4.1. Flash Flash je, jednoduše řečeno, prostředí pro snadnou tvorbu animací, aplikací, prezentací či webových stránek. [5] Je důležité uvědomit si, že tato technologie si vybírá svou daň ve formě vyšší zátěže na počítač. Přesto, že jsou poslední dobou snahy tento problém řešit delegováním některých výpočtů na grafickou kartu, ne všechny aplikace jsou tímto způsobem optimalizovány. Řešit Flashem celou stránku bývá účelné 16
jen u některých webů (menšího rozsahu). Např. osobní stránky umělce nebo filmu. Mimo webové stránky se často používá Flash na drobné aplikace, hry, bannery a další, kde exceluje na celé čáře. Problémem je stále indexace stránek, napsaných kompletně ve Flashi, vyhledávači. Vyhledávače se snaží procházet obsah, ale nemůžou na něj nijak odkázat. Pokud řešíme cokoliv na stránce ve Flashi, je nutné tvořit alternativní obsah pro uživatele, kteří ho nemají nebo nemohou mít nainstalován. 2.2.4.2. Javascript Jedná se o skriptovací jazyk, který ve svém jméně obsahuje slovo Java, s tou však nemá nic společného. Tento jazyk je poměrně dlouho známý, nicméně jeho význam vzrůstá až v posledních letech. Tuto technologii trápí v prohlížečích pomalost při složitých operacích. Naštěstí se výrobci prohlížečů snaží své Javascriptové enginy optimalizovat. Javascript je výborná technologie, které nám může být zejména v kombinaci s AJAXEM prospěšná. Pomůže při tvorbě vychytávek, například různých druhů našeptávačů, nebo automaticky rotujících obrázků. Pokud se rozhodneme využít služeb tohoto jazyka, je nutné jako u Flashe, počítat se situací, kdy uživatel nedisponuje podporou pro tuto technologii. Pokud má uživatel vypnutý Javascript, je nutné ošetřit tento problém takovým způsobem, aby to v ideálním případě uživatel nijak nezaznamenal. 2.2.4.3. Integrace sociálních sítí Sociální síť Facebook nám umožňuje integrovat některé funkcionality do našich webových stránek, které mohou být dobrou funkční nebo marketingovou pomůckou. Přihlašování na naše stránky pomocí FB účtu se jeví jako zajímavá volba. Nicméně jen jako doplňkový způsob, protože ne každý uživatel disponuje FB účtem. Dále máme možnost integrovat tlačítka I like it. Uživatel klikne a na Zdi svého profilu se zobrazí, jestli se mu daná stránka líbila a to vidí i jeho přátelé. Další možností je Fanbox jako box, který vložíme na naše stránky. Uživatelé vidí, komu se daná stránka také líbí, kolika lidem se líbí a jaké jsou poslední novinky na zdi fanouškovské stránky. Pluginů je celá řada. Jejich umisťování na stránky je nutné dobře zvážit, abychom nedávali plnou funkcionalitu webu jen lidem s Facebook účtem. 17
Twitter nám umožňuje sdílet odkaz na jakoukoli zajímavou stránku jedním stisknutím tlačítka. Případně můžeme vytvořit profil stránky, psát novinky a integrovat si třeba na partnerské weby box, kde se tyto novinky budou vypisovat. Youtube je síť, kde probíhá sdílení videí. Dá se toho poměrně šikovně využít. Například tímto způsobem, na server vložíme video propagující náš produkt, zároveň ho vložíme na své stránky. Přehrávání delšího videa je pro náš server poměrně náročně (při velkém počtu uživatelů), u takto vloženého videa přes Youtube tento problém delegujeme na servery Googlu (majitele Youtube). Lidé se tedy k našemu videu mohou dostat nejen přes naše stránky ale i přes stránky Youtube, který má obrovskou návštěvnost 9. V případě, že je video zajímavé, uživatelé Youtube ho mohou sdílet na Facebooku, Twitteru a dalších sociálních sítích. Tomuto efektu se říká virální marketing a je to tzv. marketing zdarma. 2.2.5. Zabezpečení Jakýkoliv web, kde se zpracovává vstup od uživatele v případě POST nebo GET metod, je nutné adekvátním způsobem zabezpečit. V tomto případě zahrnujeme pouze výše zmíněnou bezpečnostní problematiku a problém zabezpečování adresářů. Použití firewallů není tak docela podstatou webového auditu. Důležité je správné nastavení serveru specialistou. Další častou chybou bývají špatně ukládaná hesla, která poskytují útočníkovi poměrně zajímavý cíl. V následujících odstavcích se budu stručně zabývat těmi nejběžnějšími chybami, které jsou na stránkách běžně k vidění. Cross-sitescripting (XSS) Princip tohoto útoku spočívá v podstrčení kódu do webu, který je následně interpretován jako HTML nebo Javascript. Podstrčením Javascriptového kódu může útočník získat citlivá data o dané osobě. Řešení spočívá v důsledné kontrole jakýchkoliv vstupů od uživatele, které jdou následně na výstup. Cross-siteRequestForgery (CSR) Další poměrně známá metoda útoku je založena na nechtěném volání jedné stránky ze stránky cizí. Vše demonstruji na příkladu. Když jsme přihlášeni např. 9 Pravděpodobně kolem 2,5 milionu návštěvníků měsíčně viz http://www.ct24.cz/media/80823-pocetuzivatelu-ceskeho-youtube-se-za-rok-zdvojnasobil/ 18
v našem redakčním systému (útočník ho zná, ví, jakým způsobem se volají například funkce pro smazání uživatele) a máme oprávnění na smazání určité osoby, stačí útočníkovi, aby nás donutil (například v e-mailu) zobrazit obrázek, který bude mít jako zdroj uvedenou adresu na smazání uživatele. Obrana spočívá buď v kontrole hlavičky referer (nespolehlivé, prohlížeče ji nemusí přenášet) nebo v přiložení tokenu (nějakého náhodného řetězce), který se bude odesílat spolu s formulářem pro odstranění uživatele a zároveň se uloží do sessions. Při samotném odstranění uživatele pak zkontrolujeme, zda token odpovídá. Tím zajistíme, že požadavky budou pocházet výlučně z našich stránek. SQL Injection Jak již název napovídá, jedná se o podstrčení části sql kódu např. pomocí políčka jméno, nebo heslo u přihlašování do aplikace. Pokud se v databázi používá tento příkaz: SELECT * FROM users WHERE username = $a [6] Můžeme pomocí proměnných do $a i do $b podstrčit kód například takto SELECT * FROM users WHERE username = 1 OR 1 = 1 [6] Obrana je jednoduchá a spočívá v důsledném escapování všech řetězců, které směřují od uživatele do databáze. Možných bezpečnostních problémů a druhů útoků je samozřejmě celá řada, nicméně výše uvedené jsou nejběžnější a velice často opomíjené. 2.3. Grafické ztvárnění webu Při grafickém návrhu bychom měli dbát několika pravidel, která mohou usnadnit život nejednomu uživateli. Kvalitní design webu by měl být přehledný, barevně přístupný (pro uživatele, kteří mají problémy se zrakem), dostatečně kontrastní a měly by být používány převážně bezpatková písma. Samotnou grafiku je poměrně obtížné hodnotit vzhledem k tomu, že se jedná o subjektivní názor. Je tedy vhodné oslovit více lidí a zjistit, jak se daná grafika líbí právě jim. 19
2.3.1. Barvy Barvy bychom měli volit střídmě. Text umístěný na pozadí by měl být vždy kontrastní 10 a písmo čitelné za každé situace při nejrůznějších kalibracích monitoru. Web by měl být laděn do sady barev. Barevná paleta by měla být uzpůsobena tak, aby uživatelé, kteří jsou barvoslepí nebo slabozrací nebyli příliš limitováni, tj. důležité je nespoléhat se na barvy vůbec (nepoužívat zvýrazňování barvou namísto tučných formátování atd.). [7] 2.3.2. Intuitivnost Každý uživatel by měl nekompromisně a za každé situace vědět, kde se na stránkách nachází (v jaké sekci), kde je navigační menu, okamžitě poznat odkaz, ideálně poslední modifikaci stránky. Tato problematika souvisí i se správným označováním odkazů. Např. odkaz s názvem Index je pro většinu uživatelů nestravitelný, naproti tomu odkaz Hlavní strana je krystalicky jasný. 2.3.3. Optimalizace obrázků Všeobecně u webových stránek by mělo být zásadní slovo střídmost. Výjimky mohou tvořit weby kreativců či umělců. Cílem grafiky je uživatele zaujmout a neodradit. Optimalizace obrázků a volbu vhodných formátů nelze opomíjet. Všeobecně se lze řídit tímto rozdělením: JPG Formát JPG (též JPEG) je vhodný pro ukládání fotografií a obrázků s velkou barevnou hloubkou. JPG neumožňuje dělat průhledné nebo animované obrázky. Ukládá se do souborů s příponou.jpg nebo jpeg. JPG používá ztrátovou kompresi, to znamená, že část informace vypouští. Metoda provedení tak, aby to lidské oko pokud možno nepoznalo. Míru této komprese lze nastavit v grafickém programu. [8] GIF GIF také používá kompresi, ale neztrátovou, takže jsou tyto soubory relativně větší než JPG, ale zato jsou přesné (zachovávají barvy a kontury). Existuje zde ale 10 Pěkný nastroj na otestování čitelnosti pomocí barvy písma a barvy pozadí je k nalezení např. zde: http://www.sovavsiti.cz/kontrast/ 20
určité omezení, poskytuje maximálně 256 barev. Jedna z barev se může označit jako průhledná (tu prohlížeč potom nezobrazí), gify též podporují animace. [8] PNG Jedná se o poměrně nový formát obrázků na internetu. Podporuje částečnou průhlednost, dají se s ním řešit složitější grafické efekty. PNG je zamýšlen jako náhrada komerčního formátu GIF. Je bezztrátový podobně jako GIF a hodí se mimo jiné i pro fotografie určené k dalšímu zpracování. 2.3.4. Rozlišení Každá webová grafika by měla respektovat určité rozlišení (v ideálním případě všechny rozlišení, mimo extrémů, ale to bývá dost obtížně proveditelné). Standardně se weby optimalizují pro rozlišení 1024x768 a vyšší. Zmíněné a vyšší rozložení používá přes 90% uživatelů. Oprávněnost této skutečnosti dokládá i Obrázek 2. 20% 18% 16% 14% 12% 10% 8% 6% 4% 2% 0% Obrázek 2 Zastoupení jednotlivých rozlišení v ČR. Zdroj: Toplist.cz, Únor 2011 2.4. Zhodnocení SEO a SEM Velký význam má SEO a SEM především pro vyhledávače. Jak v případě indexování obsahu, tak v případě řazení výsledků vyhledávání. Vlastní řadící algoritmy 21
vyhledávačů jsou tajné, nikdo přesně neví, jak vzorec pro výpočet pozice vypadá. Z toho vyplývá, že se můžeme pouze snažit vyjít vyhledávači vstříc některými obecnými zásadami tzv. SEO nebo většinou komerčním SEM. V následujících podkapitolách se budu zabývat otázkami optimalizace webových stránek pro vyhledávače a jejich možnou podporou pomocí placených marketingových služeb. 2.4.1. Vyhledávače Stránky zabývající se vyhledáváním jsou obecně jedny z nejnavštěvovanějších stránek na světě. Stovky milionů uživatelů denně hledá pomocí klíčových slov odkazy na stránky, které je zajímají. Vyhledávače jsou tedy poměrně mocné. Ony jsou ty nástroje, které velkou částí rozhodují o úspěchu nebo neúspěchu našich stránek. Mezi nejpopulárnější vyhledávače v ČR patří Seznam (cca 40% všech vyhledávání) a Google (CZ i SK cca 43 % všech vyhledávání). Obrázek 3 - Graf vývoje podílu jednotlivých vyhledávačů v ČR za období od 01.01.2011-08.03.2011. Zdroj: http://vyhledavace.chose.cz/ Zatímco v České republice dominuje český vyhledávač Seznam a sekundujeme mu Google, ve světovém měřítku má Google cca 70%, Yahoo cca 14% a Bing cca 10% podíl na vyhledávání. 11 2.4.1.1. Princip vyhledávačů Vyhledávače jsou v podstatě sady aplikací, které obstarávají sběr dat, indexování a poskytování více či méně relevantních výsledků (odkazy). Každá firma tají své 11 Data z července 2010, zdroj: http://www.hitwise.com/us/press-center/press-releases/google-searchesjun-10/ 22
mechanismy a to zejména algoritmy hodnotící jednotlivé stránky. Ale i přes to mají všechny moderní vyhledávače základ podobný, viz. Obrázek 4 umístěný níže. Celý proces u jednotlivých vyhledávacích enginů je poměrně složitý a pro auditora není nutné tento proces ovládat. Důležité je mít dobrý přehled o indexování a řazení. Stahování Indexované stránky Distribuce hotové databáze Dotaz na www.interval.cz Obrázek 4 Zjednodušené schéma principu vyhledávačů 23
2.4.1.2. Indexování obsahu Procesem indexování je myšlen sběr dat o jednotlivých stránkách a ukládání do databáze. Robot, který prochází weby (crawler), potřebuje nějaké vodítko, aby věděl, že vznikla nová stránka. Toho se dá docílit tak, že se na některou již indexovanou stránku vloží odkaz na tuto novou stránku a robot ji při dalším průchodu zaindexuje automaticky. Další možností je vyhledávač nasměrovat a doporučit mu, aby se na danou stránku podíval. Tuto funkcionalitu má většina vyhledávačů. U Googlu můžeme dokonce vyhledávači dát k dispozici odkaz na soubor sitemap.xml zmíněný výše, tím mu usnadníme práci a on snadněji naše stránky zaindexuje v kompletní podobě. Pro správné proindexování stránek je vhodné, aby na každou ze stránek vedl odkaz. V opačném případě by robot nemusel existenci dané stránky vůbec odhalit. Roboti pravidelně přeindexovávají stránky v různých intervalech, které nelze určit. U souboru sitemap.xml lze definovat interval, nicméně jedná se jen o doporučení a robot se jím nemusí vůbec řídit. 2.4.1.3. Řazení výsledků vyhledávání Každý vyhledávač tuto problematiku řeší více či méně podobným způsobem jako ostatní. Při indexování dochází k určení ohodnocení stránky ze strany vyhledávače. Tento proces se řídí různými faktory, o kterých se zmíním v dalších kapitolách. Obecně se dá říci, že čím více se hledaná slova na stránce vyskytují a čím mají významnější pozici (titulky, nadpisy), tím je stránka řazena výše. Sleduje se i text odkazů mířících na stránku, zda obsahuje hledané slovo. [9] Dalším faktorem jsou takzvané ranky, které reprezentují věrohodnost nebo důležitost zdroje. Ta se odvíjí od množství zpětných odkazů. Význam odkazů se taktéž měří rankem. Google používá svůj Google Page Rank (hodnoty 0 10, čím větší číslo, tím věrohodnější zdroj), Seznam používá Seznam Rank tzv. S-rank (hodnoty 0 100, čím větší číslo, tím lepší). Rank své stránky se dá kontrolovat na různých webech 12. 12 Například na http://ranky.cz/ 24
2.4.2. SEO Optimalizace pro vyhledávače je dnes velice moderní marketingový pojem. Nabízí ho téměř každá firma zabývající se webovými stránkami, ale ne každá už přesně ví, co má pro její dosažení udělat. Nejde jen vylepšit stránku tak, aby ji vyhledávač kompletně a správně zaindexoval podle našich představ, ale slouží i ke zlepšení pozice ve vyhledávačích. V několika následujícíh podkapitolách se pokusím shrnout základní principy SEO 13. 2.4.2.1. Důležité prvky na stránce Při tvorbě stránky je důležité vědět, které prvky jsou důležité pro vyhledávače a které nikoli. S postupem času vyhledávače měnily svoje hodnocení těchto prvků zejména z důvodu podvodných praktik. Faktory, které zmiňuji, se nazývají on-page (jsou na stránkách) a off-page (figurují mimo stránky). Tabulka 1 shrnuje základní prvky stránek včetně důležitosti. Co vyhledávače sledují Jak je to v HTML Důležitost (váha) titulek <title>text titulku</title> obrovská klíčová slova <meta name=keywords content="slovo, slovo"> značná, někdy žádná (Google) popis (description) <meta name=description různá content="stručný popis"> nadpis 1. úrovně <H1>Nadpis</h1> značná ostatní nadpisy <Hn>Nadpis</hn> sporná začátek stránky <body>několik prvních slov... větší než malá adresa URL jméno souboru včetně cesty různá text odkazů mířících na tu <a href="adresa">text u některých vyhledávačů stránku z jiného serveru odkazu</a> obrovská (Google, Jyxo) alty u obrázků <img alt="zástupný text"...> malá text stránky text malá používání značek pro <strong><i> malá formátování textu katalogový popisek co zadáte do případného různá (pouze na 13 V. Janouch definoval tento vztah SEM = SEO + PPC + placené vyhledávání v jiných zdrojích 25
spřízněného katalogu Seznamu) Validní kód Well-formed prakticky žádná, ale správnost je důležitá pro roboty Tabulka 1 Přehled prvků na webu a jejich sledovanost vyhledávači (Zdroj: modifikovaná tabulka z [9]) Z uvedené tabulky vidíme, že ne všechny prvky mají pro vyhledávače stejný význam. 2.4.2.2. Klíčová slova Obecně platí, že na stránkách by se měla vyskytovat klíčová slova, pro která provádíme optimalizaci v dostatečné frekvenci (ne však za každou cenu, přílišné opakování klíčových slov působí podivně). Pro volbu správných klíčových slov je nutné provést analýzu produktu, trhu a vyhledávačů. Při analýze produktu je nutné stanovit klíčová slova, která ho jasně a výstižně definují. Dále je dobré zjistit, na jaká slova jsou optimalizovány konkurenční stránky a kdo na ně odkazuje. Poměrně dobrým nástrojem je Yahoo! Site Explorer 14. Pro samotnou analýzu klíčových slov je výborný nástroj Google Keywords Analyzer 15, který dokáže z webu nebo klíčových slov určit to nejvhodnější na základě statistik ze svého vyhledávače. Vše je vyvedeno v pěkném a přehledném rozhraní, Google nám provede analýzu klíčových slov a dá nám k dispozici i nejrůznější statistiky. Při volbě klíčových slov platí několik zásad, které je vhodné dodržovat: 1) Optimalizovat na slovní spojení dvou až pěti slov 2) Neoptimalizovat na příliš obecné spojení (velká míra opuštění) 3) Neoptimalizovat na příliš konkrétní spojení (nikdo by takové slovo nemusel např. vůbec hledat) 4) U B2B používat žargon 5) Využívat varianty slov, synonyma, antonyma 14 http://siteexplorer.search.yahoo.com/ 15 https://adwords.google.com/select/keywordtoolexternal 26
2.4.2.3. Zpětné odkazy a copywriting Zpětné odkazy jsou jedny z nejmocnějších technik pro zvyšování pozic ve vyhledávači. U zpětných odkazů je sledován nejenom jejich počet, ale i kvalita, tj. odkud který odkaz je a jak je daná stránka ohodnocena. Nejvyšší význam má zpětný odkaz ze stránek, které jsou určitým způsobem obsahově příbuzné s webem, na který odkazují. Ideálním případem je, když na naše stránky někdo odkazuje sám od sebe. To se nám však rozhodně nepoštěstí, pokud jsme s webem na počátku. Určitě se nevyplatí umisťovat odkaz na stránku na tzv. link farmy. Vyhledávače zdokonalují techniky rozpoznávaní těchto webů a mohou nás penalizovat. Poslední dobou se stává populární copywriting. Jedná se o činnost, kdy specialista na texty na internetu píše takové texty, které mají čtenáře přesvědčit k určité činnosti (kliknout na odkaz, nakoupit). Texty jsou nejdůležitějšími prvky na stránkách, ať už se jedná o text na vlastních stránkách nebo text reklamního proužku, vždy by měl být dostatečně kvalitní a to jak z pohledu spisovatele, tak marketéra, vyhledávače a návštěvníka. 2.4.3. Reklama na internetu SEM je zkratka Search Engine Marketing, do které se podle některých řadí také SEO a jakákoliv reklama na internetu. Marketingových prostředků pro zviditelnění stránek existuje celá řada: a) Plošná reklama a. Reklamní proužky tzv. bannery b. Vyskakovací okna pop-up c. Tlačítka b) Zápisy do katalogů c) Přednostní výpisy d) Kontextová reklama e) Behaviorální reklama f) PPC systémy g) Emailing h) Affiliate 27
Plošná reklama se zobrazuje všem ve stejné formě. Objevuje se ve formě grafických, textových nebo animovaných proužků na stránkách. Další možností jsou vyskakovací okna. Tato metoda naštěstí mizí, prohlížeče ji dokážou blokovat. Příčina je jednoduchá, tato forma reklamy nejvýrazněji obtěžuje návštěvníka. Dalším způsobem zobrazování jsou různá tlačítka nebo odkazy. Zápisy do katalogů se myslí zápisy do oborových, firemních a dalších katalogů. Uživatelé sem chodí, aby našli např. zedníka v Benešově. Přednostními výpisy se rozumí např. přednostní (většinou placený) výpis odkazu na nějakou stránka, která se bezprostředně týká např. zedníka v Benešově. Kontextová reklama je jakákoli z předchozích akorát s tím rozdílem, že se zobrazuje v kontextu buď s obsahem stránky, vyhledávaným slovem nebo jen v určité kategorii. Může se jednat o tučné nebo podtržené slovo v textu, které je odkazem na určitou stránku. Forem této reklamy je poměrně dost. Kontextová reklama je i PPC reklama, která je v posledních letech velice populární. Behaviorální reklama je jakási inteligentní reklama, která analyzuje dříve navštívené webové stránky a na základě našich preferencí se nám snaží zobrazit tu, která by nás mohla nejvíce zajímat. PPC reklama je na internetu poměrně nová. Její výhody jsou nesporné, poměrně nízká cena a velmi přesné cílení. Její princip spočívá v zobrazování (v kontextu) např. s hledaným slovem, kategorií článků, webem a další. PPC reklama je známá především z vyhledávačů, kde mimo relevantních výsledků zobrazuje také placené odkazy, které jsou jako placené označeny, bývá jich jen několik. Nespornou výhodou této reklamy je, že za reklamu neplatíme do té doby, dokud nedojde ke kliknutí na odkaz. Mezi nejznámější PPC systémy patří celosvětově Google Ad Words, Yahoo! Search Marketing a Microsoft ad Center. U nás se těší popularitě systém Sklik, ETARGET a adfox. Emailing je činnost, kdy se informuje uživatel o nové službě, produktu nebo o stránce prostřednictvím emailu. Emailové adresy lze získat od uživatelů např. registrací, nebo přihlášením k odběru zpravodaje. Důležité by mělo být respektování platných zákonů dané země. 28
Affiliate je partnerský program, kdy my jako provozovatel e-shopu nabízíme provize za každého návštěvníka, který přišel z partnerských stránek a provedl objednávku (provedl konverzi). 2.5. Analýza návštěvnosti Informace o návštěvnících jsou důležitou součástí auditu jakéhokoliv webu. Pokud víme, jací návštěvníci přicházejí, odkud a co je nejvíce zajímá, můžeme jim web přizpůsobovat, přesněji identifikovat nejdůležitější místa, odkud přicházejí. Obecně se při analýze návštěvnosti používají dva typy nástrojů. A to nástroje webové (Google Analytics) a serverové, kde se čerpá z logovacích souborů za použití speciálního software (například jednoduchý Log Analyzer). 2.5.1. Analýza návštěvníků Při analýze samotných návštěvníků vycházíme z dat, která pro nás jsou zaznamenána nějakým programem. Obsah těchto dát bývá poměrně skromný. Nevyčteme z něj kolik let je návštěvníkům a podobné údaje, ale můžeme z něj vyčíst jiné, taktéž podstatné informace. Jako stěžejní se jeví přístupy uživatelů. Konkrétně odkud přišli, jak dlouhý čas strávili na které stránce, na co nejvíce klikali. U internetových obchodů je zajímá i statistika samotného nákupního procesu, kdy lze přesně vysledovat, ve které fázi nejvíce ztrácíme zákazníky. 2.5.2. Analýza zdrojů Hlavička referer protokolu HTTP nám umožňuje sledovat odkud k nám uživatelé přišli. Tato informace nám umožní zjistit, zda byla marketingová kampaň na daném webu efektivní, zda nám přivedla dostatek zákazníků. Další výhodou je, že je možné stanovit na který zdroj návštěvníků se zaměřit a pro něj web optimalizovat. Např. prostřednictvím reklamní kampaně nebo jiné formy spolupráce s daným webem. 2.5.3. Heat mapa webu V případě, že chceme zjistit, která část webu zákazníky nejvíce zajímá, která je hodně vytěžovaná, můžeme si statistiky vizualizovat prostřednictvím tzv. heat map. Na heat mapě je přehledně vidět, na které odkazy je nejvíce klikáno a to znamená, že se pohybují v nejširším okruhu zájmu návštěvníků). Mapa nám umožní vysledovat slabá místa webu, nebo slepé uličky navigace. Příklad heat mapy je na obrázku 5. 29
Obrázek 5 Heatmapa v praxi. Zdroj: Myx.cz 2.5.4. Míra konverze U analýzy webové návštěvnosti se poměrně často sleduje míra konverze. Ta udává, kolik procent zákazníků provedlo námi chtěnou akci. U internetového obchodu to může být, kolik procent zákazníků si skutečně objednalo nějaký produkt. Míra konverze se dá poměrně dobře vysledovat při patřičném nastavení některého z analytických nástrojů. Pokud je míra konverze malá 16, evidentně nabízíme špatné služby nebo je špatně prezentujeme, popřípadě k nám chodí uživatelé ze špatných zdrojů, kteří jsou na našem webu spíše náhodně než za konkrétním účelem. 2.5.5. Míra opuštění (Bouncerate) Míra opuštění definuje, kolik návštěvníků odejde z webu již po navštívení vstupní stránky. Vysoká míra je typická v případě, že inzerujeme na serveru irelevantní nebo klamavé informace. Taktéž může být vysoká míra opuštění spojena s nepřesvědčivým vzhledem stránek, který uživatele odradí hned na první pohled. 16 Podle zdroje [17] má většina drobných internetových obchodů v ČR konverzní poměr kolem 1%, Amazon nebo Expedia kolem 10% 30
Nástin míry opuštění u některých segmentů webů definuje Tabulka 2[10]. Segment Minimum Maximum Průměr Automobilový průmysl 19% 54% 37% B2C prodej 26% 46% 36% B2C servis 16% 60% 38% E-shopy 20% 86% 53% Firemní weby 60% 87% 74% Zdravotnictví 10% 75% 43% Farmacie 18% 73% 46% Informační weby 35% 63% 49% Zábavní weby 28% 67% 48% Zpravodajství 34% 78% 56% Celkem průměr 27% 69% 48% Tabulka 2 Míra opuštění některých segmentů webu Z tabulky je vidět, že v segmentu internetových obchodů je situace mnohdy žalostná. Pokud máme web, kde je míra opuštění např. 80%, je to jasný signál, že je zde obrovský prostor pro vylepšování. Uživatelé evidentně nechtějí mít se stránkou nic společného a je třeba věnovat větší úsilí formě, obsahu i případné reklamě. 2.5.6. Nástroje pro diagnostiku Při analýze je dobré používat špičkový software, který nám umožní bohaté nastavení a zároveň přehledné a jasné zobrazení požadovaných informací. Jako špička se u metody sběru dat pomocí Javascriptu považuje Google Analytics, který má výborné možnosti nastavení, export většiny dat a pěkné grafické zobrazení a navíc je k dispozici zdarma. Špičkový nástroj pro analýzu logovacích souborů na straně serveru je Deep Log Analyzer od firmy Deep Software. Při svých analýzách budu primárně používat Google Analytics. 2.6. Metodiky zvyšování výkonnosti webu Existuje celá škála metodik a postupů, pomocí kterých můžeme zvýšit míru konverze či obecně udělat web pro uživatele příjemnější. Obecně se dá říct, že se definují scénáře a pak se zkoumá, jak na ně uživatelé zareagovali. Z těchto výsledků lze pak určit, který scénář se jeví jako nejefektivnější. 31
2.6.1. Uživatelské testování Touto metodikou lze testovat nejen web, ale i třeba software. Proto je v praxi poměrně často k vidění. Princip je takový, že se vybere skupina lidí, může se jednat i o specifický výběr podle definované cílové skupiny. Pak se připraví testovací scénáře, kde se podrobně definuje, co budou lidé testovat, většinou se jedná o seznam postupů. Testeři zaznamenávají do protokolů, zda dosáhli požadovaného výsledku intuitivně, zda se jim zdálo všechno přehledné a jasné a jaké spatřili chyby. U této metodiky lze poměrně dobře odhalit skryté chyby, zobrazovací nepřesnosti apod. 2.6.2. Segmentace Segmentace je spíše technika pro zobrazování relevantnějších dat než samotná metodika. Pokud sledujeme data pomocí měřícího software jako je Google Analytics, často se stane, že data jsou zkreslena nežádoucím vlivem. Tímto vlivem může být příliv návštěvníků ze zahraničí, což způsobí výkyvy jak v návštěvnosti, tak ve vzorcích chování uživatelů, kteří nás zajímají. Tento problém řeší segmentace, která dokáže účinně oddělit uživatele, kteří jsou v okruhu našeho zájmu od uživatelů, o jejichž data nemáme zájem. Dobrým příkladem může být internetový obchod, který se specializuje na Středočeský kraj a Prahu. Nechá se předpokládat, že nás zajímají pro naše analýzy primárně data od uživatelů právě z tohoto kraje a ne z kraje Olomouckého. Nástroje pro měření přístupů většinou obsahují kvalitní nástroje pro účinnou segmentaci. Můžeme tedy filtrovat data podle našich preferencí a docílit tím přesnějších nebo lépe řečeno relevantnějších výsledků. Při aplikaci filtrů nemusíme vždy chtít filtrovat pouze podle oblastí, ze kterých uživatelé přichází, ale může nás zajímat chování nových/vracejících se zákazníků, dále můžeme filtrovat podle IP adres či jiných kritérií. Google Analytics nám dovoluje definovat i své vlastní segmenty, kde lze přesně vydefinovat danou skupinu a metriky. 32
2.6.3. A/B testování Při tomto druhu testování se porovnává, která z variant generuje vyšší míru konverze. Varianta může být například box s obrázkem vlevo, druhá varianta box s obrázkem vpravo. Těchto variant může být mnoho, ale je vhodné jich udělat jen několik, výsledky pak mají vyšší vypovídací hodnotu. Míra konverze se testuje tak, že mechanismus tohoto testování kontroluje, zda například uživatel klikl na odkaz, registroval se nebo se přihlásil k odběru newsletteru. Obecně se tato technika hodí na otestování reakcí uživatelů na nový vzhled dílčí nebo celkový, či na změnu rozložení webu. Pro testování je dobrým nástrojem Google Website Optimizer. Obrázek 6 Obrázek z testu na Google WebsiteOptimizer. Zdroj: Seooptimise.com 2.6.4. Testování s více proměnnými Tato technika je vhodná zejména pro weby s větší návštěvností 17 a to z důvodu velkého počtu variant. Pokud chceme dosáhnout relevantních výsledků, musí být vzorek uživatelů dostatečně obsáhlý. Oproti předchozí technice je zde hlavním rozdílem kombinování. U A/B testování se testuje reakce uživatelů na jednu variantu z několika definovaných, u testování s více proměnnými se testují různé kombinace variací. Definují se jednotlivé díly kombinace, kdy jeden díl má několik variací. Pokud máme 3 díly a u každého dílu 3 variace, znamená to, že se bude testovat reakce uživatelů na 27 17 Google WebsiteOptimizer doporučuje alespoň 1000 přístupů za týden 33
různých kombinací. Testuje se opět míra konverze. Princip je stejný jako u A/B testování. Pro tuto metodiku testování se jeví vhodný, taktéž jako u předchozí metodiky, nástroj Google Website Optimizer. 2.7. Analýza výkonnosti e-shopu Oproti běžným webovým stránkám je nutné internetové obchody analyzovat z více hledisek. A to zejména analýzou prodejů, zákazníků a analýzou nákupního procesu. Míra konverze se sleduje často i u běžných stránek, nepovažuji ji tedy za výjimku u internetového obchodu. Jako u předchozích metodik zde máme u některých k dispozici nástroje, které jsou schopny takovou analýzu provádět a to zejména často citovaný Google Analytics. 2.7.1. Analýza zákazníků a prodejů Abychom byli schopni získávat informace o zákaznících, je nutné, aby byla objednávka podmíněna vyplněním kontaktních informací. Takové uživatele lze mnohem lépe segmentovat a generalizovat pro daný segment typické vzorce chování. Z údajů o zákaznících a údajů o prodejích lze snadno vyčíst např., který výrobek je nejpopulárnější mezi mladšími uživateli. To je hodnotná informace z pohledu marketingu. Takové výrobky je pak výhodnější inzerovat na serverech pro mladší skupiny uživatelů než na webech, které sdružují maminky. Na základě těchto údaje se pak dají generovat například statické ceny dopravy, tak aby se to v průměru vyplatilo. Informací, které lze vyčíst, je opravdu velké množství. 2.7.2. Analýza nákupního procesu Nákupní proces bývá dvojího typu a to jednokrokový nebo vícekrokový. Jednokrokový řeší způsob platby a dodání, dodací a fakturační adresu, případně poznámku na jedné stránce, někdy dokonce i na stránce s košíkem. Vícekrokový je zpravidla rozdělen do několika bloků: 1) Nákupní košík 2) Objednávka osobní údaje 3) Objednávka platební podmínky a doručovací údaje 4) Objednávka právní podmínky 5) Objednávka kontrola 6) Úspěšně provedená objednávka 34