Konkrétně vás chci zatáhnout na pivo. Nepůjdeme ale do některého z mých oblíbených pražských podniků, nýbrž do virtuálního pivního království, kterým je web Sdružení přátel piva.

A proč vás na něj tak bezostyšně lákám? Protože jsem jej celý přepracoval. Jak si asi pozorná menšina povšimne, design zůstal stejný. Správně! Zato střeva jsou nová, technologickým klistýrem důkladně pročištěná.

Web zacílený na pivo a jeho příznivce pohání kompletně zbrusu nová česká verze redakčního systému Textpattern, pouze o bezproblémové zobrazování fotografií ve fotogalerii se nadále stará sada PHP skriptů napsaná šikovnými českými ručičkami Tomáše Párala.

Přesuňme se však k meritu věci. Potřebuji web důkladně otestovat a pozabíjet všechny mouchy. Pomůžete mi a proklikáte se alespoň částí pivního labyrintu?

Kontaktní formulář naleznete na webu Sdružení přátel piva téměř na každé stránce, slova chvály a obdivu proto můžete posílat v hojném množství.

Děkuji vám a nebojte se, příště už budu zase poučovat.

Focus (pozice textového kurzoru) by měl být od začátku na vyhledávacím poli.

Dobrý příklad:

• Google

Špatný příklad:

• Pravidla českého pravopisu

Zajímavost z 28. 11. 2005: I zdi mají uši, a tak už mohu (a vy se mnou) na webu Pravidel českého pravopisu hledat zase o něco pohodlněji.

Kategorie nástrojů

• Kvalita kódu a funkčnost webu
• Přístupnost
• Optimalizace pro vyhledávače (SEO) a SEM
• Další nástroje

Kvalita kódu a funkčnost webu

Validátory

W3C Markup Validation Service

Ověřuje správnost kódu proti vámi zvolenému standardu.

Walidator.com

Několik validátorů na jednom místě (XHTML, CSS, RSS) a k tomu další užitečné nástroje (zpětné odkazy v Googlu a další).

Offline validátory:

• CSE HTML Validator
• HTML Tidy

Funkčnost webu

Xenu’s Link Sleuth

Freewarový prográmek pro kontrolu funkčnosti všech odkazů na stránkách. Funguje online i offline. Dobře poslouží i W3C: Link Checker, ten však kontroluje vždy pouze jednu stránku.

Web Page Speed Analyzer

Změření přibližné rychlosti načítání stránek s různými typy připojení. Měří také datovou velikost načítaných objektů.

Pixy: Let’s Favelets

Pixyho seznam užitečných faveletů. Mezi nejzajímavější patří například odstranění stylů nebo změna velikosti okna prohlížeče na předdefinovanou velikost.

Cacheability Engine Query

Co všechno se ze stránek ukládá do cashe prohlížeče. O těchto objektech nabízí i bližší informace – např. dobu vypršení (expire), poslední změnu, datovou velikost a další.

Get Content Size

Procentuální podíl textu ve zdrojovém kódu stránky.

Web-Sniffer

Hlavičky všech příchozích i odchozích HTTP požadavků.

» nahoru

Přístupnost

Barvy

Yuhůův přehled bezpečných barev

Přehled bezpečných barev pro web. Viděl jsem jich různě po síti mnoho, ale ten Yuhůův mi připadá nejpřehlednější.

Kontrast barev

Porovnání kontrastu dvou barev – dostatečný rodíl je podmínkou přístupného webu.

Další měřiče kontrastu barev:

• Colour Contrast Check
• Colour Contrast Analyser

Colorblind Web Page Filter

Testování barev na webu z pohledu barvoslepého člověka. Podobnými nástrojem je Vischeck, který si můžete stáhnout také jako plug-in do Photoshopu.

Prohlížeče

IeCapture

Test zobrazení stránek ve čtyřech verzích prohlížeče Internet Explorer (4.01, 5.01, 5.5, 6.0), Firefoxu a také Opeře 7.23.

iCapture

Test zobrazení stránek v prohlížeči Safari.

Lynx Viewer

Test zobrazení stránek v textovém prohlížeči Lynx, který nevyužívá stylový předpis.

» nahoru

Optimalizace pro vyhledávače

SE-TOOLS

Hezky pohromadě spousta nástrojů užitečných při optimalizaci webu pro vyhledávače.

Widexl Internet Solutions

Na tomto webu se v sekci Free Online Tools nalézá skript na zjištění počtu odkazů z nejpoužívanějších vyhledávačů (Google, Yahoo!,..), šikovný Meta Tag Analyzer, který provede globální analýzu vašich meta-tagů z pohledu vyhledávacího robota, a další užitečné nástroje.

Poodle Predictor

Zkoumá stránku z pohledu vyhledávacího robota.

Search Engine Simulator

Zobrazení stránek z pohledu fulltextového vyhledávače.

Keywords Density & Prominence

Hustota a prominence klíčových slov na webu.

Google PageRank Calculator

Počítá Google Toolbar PageRank pro libovolné množství stránek.

Robots.txt Validator

Validátor souboru Robots.txt, který slouží k zakázání přístupu robotů do vybraných složek.

Kontrola pozic ve vyhledávačích

Pozice ve vyhledávačích

Vyhledávače: Google EN, Google EN – české stránky, Google CS, Yahoo!, MSN, AltaVista, Jyxo, Morfeo, Seznam ČR, Seznam svět.

Search Engine Position

Vyhledávače: Google, Google (lang:cs), Google (cs), Jyxo, Morfeo.

THComputers

Vyhledávače: Google.com, Jyxo, Morfeo, Seznam.

Google Position Checker

Pozice stránek na různých datacentrech Googlu.

Jyxo Position

Pozice ve vyhledávači Jyxo.

Kontextová reklama ve vyhledávačích

Nástroj na klíčová slova

Pomáhá při vymýšlení vhodných klíčových slov pro reklamní kampaň ve vyhledávačích.

Overture – Keyword Selector Tool

Podle počtu hledání pomáhá s návrhem vhodných klíčových slov pro reklamní kampaň ve vyhledávačích.

Split Tester

Z počtu prokliků a průměrné míry prokliku dvou inzerátů pomáhá ověřit jejich dlouhodobou úspěšnost.

» nahoru

Další nástroje

Webmaster Toolkit

Velké množství nástrojů pro ladění vašich stránek.

AnyBrowser.com

Mnoho užitečných pomůcek při tvorbě stránek. Asi nejvyužívanější je simulace různých výstupních zařízení (např. Web TV). Hodit se může také kontrola platnosti odkazů na vašich stránkách.

Online Color Scheme Generator

Generátor barevných schémat na základě zadané základní barvy.

Další barevná míchátka:

• ColorMatch Remix
• Color Picker
• Color Calculator (ve Flashi)
• Pixyho míchátko a Pixyho míchátko 2
• 4096 Color Wheel

» nahoru

Je jistě ještě mnoho stránek poskytujících další užitečné služby, a tak vás prosím, pokud o nějakých víte, dejte mi určitě vědět a já je do seznamu doplním.

Použitelnost webových stránek se obvykle testuje na lidech, kteří testovaný web neznají. Existují samozřejmě výjimky, ale ty teď nechme stranou. Vtip spočívá v tom, že právě při pozorování těchto s webem neobeznámených lidí odhalíte jeho největší slabiny.

Nejlepší je testování použitelnosti

Testování použitelnosti je dost drahé. Je to pochopitelné. Musíte zaplatit uživatele, dát jim najíst a napít, zaplatit místnost, ve které se testuje, konzultanta, který pokládá všetečné otázky, kameru, veverku, která ji pohání, a nespočet dalších věcí.

Testování použitelnosti je dost drahé, a proto si ho nemůže dovolit každý. Jak potom ale zjistit, zda je váš web dostatečně použitelný? Těžko, pomyslí si BČW. Ale nějaká možnost tu přeci jen je. Dokonce dvě.

První možností je tzv. heuristická analýza použitelnosti. Ta spočívá v prohlížení webu a hodnocení jeho použitelnosti na základě známých pouček, pravidel a výsledků výzkumů. Heuristickou analýzu použitelnosti většinou nabízejí poradenské firmy (jako třeba ta naše) jako alternativu k tradičnímu testování použitelnosti.

Chybami se člověk učí, a to nejen vlastními

Druhou možností je vůbec netestovat svůj web, ale jít se podívat ke konkurenci. „Co zrovna tam zjistím o svém webu?“ napadne mnohé z vás. Víc, než byste asi čekali! Není tajemstvím, že například e-shopy se často vzájemně podobají jako vejce vejci a díky (nebo spíše kvůli) tomu trpí podobnými, či dokonce naprosto stejnými chybami.

Místo věčného přemítání nad vlastním webem tak radši vyrazte do internetových ulic a uliček. Tu narazíte na naprosto nepoužitelný formulář, tam zase na ukrytou důležitou funkci a hle, najednou si uvědomíte, že ani u vás tahle funkce není právě na očích.

Díky nacházení chyb na cizích webových stránkách máte možnost uvědomit si také chyby vlastní, které pod vlivem dobré znalosti svého webu běžně přehlížíte. Kromě chyb narazíte samozřejmě i na dobře vyřešené prvky a to se taky počítá!

Tak na co ještě čekáte? Utíkejte ke konkurenci a udělejte si na jejím webu malou analýzu použitelnosti. Alespoň část jejích výsledků pak s velkou pravděpodobností budete moci uplatnit na svém vlastním webu.

A pokud vám ta použitelnost není úplně jasná, nechte se důkladně proškolit, ještě zbývá několik míst. Já na školení přijdu a možná přijde i kouzelník ;-).

Souvislosti na Václaváku

• Oční kamera a testování použitelnosti