Desatero webdesignu v podání Jiřího Lahvičky

11. srpna 2000

•

„Cože, už zase další článek přeplněný radami, jak udělat kvalitní web? Copak jich už nebylo dost?“ Vzhledem k tomu, že jsem poslední dobou v rámci své pracovní náplně shlédl množství stránek, jejichž autoři zřejmě o zásadách uvedených v tomto článku v životě neslyšeli, a vzhledem k tomu, že některé zásady porušují i „profesionální“ prezentace, myslím, že články tohoto typu smysl mají.

A pokud náhodou patříte mezi ten zlomek webdesignerů, pro které je obsah tohoto článku samozřejmostí, alespoň ho můžete doporučit všem těm, jimž byste jinak museli zdlouhavě vysvětlovat, že internetová stránka opravdu nemá připomínat rotující a blikající pouťovou atrakci

Design webu musí být podřízen jeho účelu

Účelem virtuálního obchodu je prodat zboží. Účelem firemní prezentace je zprostředkovat návštěvníkům co nejrychlejší přístup k podstatným informacím o firmě. Účelem zpravodajského serveru je nabídnout rychlý a snadný přístup k článkům, které návštěvníka zajímají. Na první stránce, kterou návštěvník vidí, by proto měly být všechny nejnovější a nejdůležitější informace, vše ostatní by mělo být z této strany snadno dostupné. V žádném případě by neměla vstupní strana obsahovat pouze logo či jiný obrázek větších rozměrů a nápis vstupte.

Web musí mít jasnou strukturu

Už na první straně by mělo být každému jasné, jak je celý web uspořádán a jak se dostat ke kterékoliv konkrétní informaci. Tomuto požadavku by měla být podřízena navigace (typicky by měly být v menu uvedeny odkazy na všechny hlavní sekce), pomůže i prohledávání nebo mapa www (obraz úplné struktury webu). Dobré je držet se struktury obvykle používané u jiných webů obdobného typu, návštěvník ocení, že si nemusí zvykat na něco nového.

Navigace musí být jednotná

V ideálním případě by mělo být součástí každé stránky jednotné menu, které návštěvníkovi umožní snadný přechod do jakékoliv jiné části webu. V každém případě by však součástí každé stránky měl být alespoň odkaz na homepage, na stránku ve struktuře nadřazenou, případně i na stránku logicky předcházející a následující. Příliš doporučeno není používání framů (nelze odkazovat na jinou stranu než úvodní, obtížné záložkování, nekvalitní podpora ze strany Netscapu, příliš malá plocha pro skutečný obsah), většinou jde vše lépe vyřešit několikasloupcovou tabulkou.

Text na stránce musí být snadno čitelný

Nejlepší barevná kombinace je černé písmo na bílém pozadí. Pokud chcete být extravagantní, použijte místo bílého pozadí např. světle modré, případně zvolte inverzní kombinaci – bílé písmo na černém (nebo velmi tmavém) pozadí (tato kombinace však už může být při dlouhodobějším sledování nepříjemná pro oči). Jakékoliv jiné kombinace, zejména ty s malým kontrastem, jsou zapovězeny. Vzor na pozadí používejte jen tehdy, pokud ho považujete za důležitější část obsahu svých stránek než je text, jehož čitelnost takto „vylepšeným pozadím“ výrazně zhoršíte. Jedinými fonty, které by se bez problémů měly zobrazit ve všech prohlížečích a operačních systémech, jsou Times New Roman (úplná definice: Times New Roman CE, Times CE, Times New Roman, Times, serif), Arial (úplná definice: Arial CE, Helvetica CE, Arial, Helvetica, sans-serif) a Courier (úplná definice: Courier New CE, Courier CE, Courier New, Courier, monospaced). Patkové písmo (Times) je doporučeno pro běžný text, bezpatkové (Arial) pro nadpisy, položky menu apod.

Méně grafiky je více

V žádném případě nerozptylujte návštěvníka zbytečnou grafikou, zvláště animovanou, pouze odpoutáváte jeho pozornost od toho, kvůli čemu na stránky přišel. Nepoužívejte již zmíněné obrázky na pozadí či blikající, poskakující a jezdící texty. Nezaplňujte svůj web ikonami vyhledávačů, kde je registrován – vaše návštěvníky to otráví a rozptýlí. Vyhýbejte se zejména grafickým prvkům volně k použití – za prvé jsou většinou nevkusné, za druhé navzájem neladí k sobě a za třetí je vaši návštěvníci už dávno viděli někde jinde (o hudbě a zvukových efektech se ani nezmiňuji – jejich použití je až na výjimečné případy téměř hrdelní zločin :-).

Reklama je pouze nutné zlo

Nějaké reklamě (výměnné nebo v lepším případě placené) se na svých stránkách pravděpodobně nevyhnete, ovšem pamatujte si, že reklama je pro návštěvníka jen otravná přítěž, která se ho navíc snaží přinutit k tomu, aby odešel z vašeho webu. Měli byste ji proto používat opravdu střídmě. Započítejte si 1 bod za každý banner 468×60, 0,5 bodu za každý čtverec 125×125, 0,2 bodu za každý obdélník 120×60 a 0,1 bodu za každou ikonu 88×31 – pokud některá strana vašeho webu přesáhne 1 až 2 body (v závislosti na své délce), velmi vážně uvažujte o reklamní redukční dietě.

Rychlost nahrávání je klíčová

Před několika lety byla doporučená velikost úvodní stránky webu 20-40 kB (samozřejmě včetně veškeré grafiky apod.). Dnes jsou sice technické možnosti poněkud lepší, přesto řada webů evidentně pohrdá všemi, kdo nejsou připojeni pořádně propustnou pevnou linkou, a klidně nutí ubohé návštěvníky stahovat často i více než 100 kB. Pokud stojíte o to, aby vás opakovaně navštěvovali i lidé připojení z domova, neměla by velikost žádné z vašich stránek překročit cca 60 kB. Ušetřit můžete jak redukcí grafiky a počtu reklamních ploch, tak úsporným HTML kódem (samozřejmě nikoliv na úkor korektnosti!) a používáním CSS.

Web by měl být kompatibilní s naprostou většinou prohlížečů

Vzhledem k rozdílné interpretaci HTML různými browsery a jejich verzemi je identický vzhled stránek ve všech prohlížečích utopie. Lze však bez problémů dosáhnout toho, aby stránky dobře a velmi podobně vypadaly v Exploreru 4.0 a vyšším a Netscapu 4.0 a vyšším. Vyhýbejte se všem HTML tagům, které podporuje pouze jeden z hlavních prohlížečů, omezte na minimum všechny další zdroje nekompatibility (DHTML, komplikovanější CSS a JavaScript apod.).

Naopak používejte základní CSS – můžete tak ušetřit velké množství zdrojového kódu a jeho podpora je téměř stoprocentní (a při inteligentním použití vypadají stránky dobře i v prohlížečích bez jeho podpory). K ladění stránek (nikoliv ovšem už ke skutečnému prohlížení) doporučuji prohlížeč Opera – pokud se stránky zobrazí správně v něm (a pokud používáte korektní HTML, tak by měly), pak už všude.

Stránka se musí na šířku vejít na monitor

Není nic otravnějšího než neustále scrollovat zleva doprava a zprava doleva. Rozlišení 640×480 už používá pouze minimum lidí, ovšem 800×600 je stále nejrozšířenější, pokud tedy pevně stanovujete šířku své stránky např. v tabulce, neměla by překročit 760 pixelů (770, pokud používáte nulové okraje).

Web musí mít korektně stanoveno kódování češtiny

Absolutní minimum, které musíte udělat pro to, aby návštěvníci neviděli místo českých znaků jen prázdné čtverečky a jiné záhadné znaky, je určit použité kódování (většinou windows-1250) buď pomocí meta tagu, nebo hlavičkou, kterou server odesílá. To zaručí korektní zobrazení českých znaků pod Windows, ovšem na jiných operačních systémech bude podpora češtiny problémová. Používat místo windows-1250 tzv. standardní iso-8859-2 nemá moc smysl, protože vám to většinou pouze přidělá práci a podpora češtiny stejně nebude všude úplně stoprocentní. Jediné opravdu stoprocentní řešení, které by mělo být vaším cílem, je buď automatické překódování češtiny na serveru nebo možnost, aby si kódování explicitně určil přímo návštěvník.

Pro ty, kterým připadá toto desatero zbytečně dlouhé, ho shrnu do čtyř slov: přehlednost, účelnost, rychlost, korektnost. Pokud si myslíte, že některá z výše uvedených zásad je nesmyslná, klidně ji porušte – koneckonců to, že nejnavštěvovanější český neerotický server Seznam.cz je dodržuje, nemusí každému připadat jako přesvědčivý argument.