Jste tu poprvé? - Skrýt (musíte být přihlášeni)

0

Použitelnost v praxi 4. - Vztahy mezi klíčovými prvky designu a tím ostatním

Když všechno v designu vypadá stejně, máte problém - návštěvník se nemůže orientovat podle důležitosti obsahu a může úplně minout poselství webu. Pojďme se tedy podívat, jaké možnosti ve zvýrazňování se nám nabízí.

Upozornění: Pro nově příchozí - tato série článků na blogu reprezentuje moje osobní názory, které se vždy snažím podepřít rozumnými argumenty. Mým úmyslem je jednak informovat ostatní, jednak rozpoutat diskuzi o dané problematice - protože ne vždy musím mít pravdu a zvlášť u nejistých témat (kdy se "domnívám" a spíš tak trochu hádám) ocením názor ostatních.

Každý web chce nějakým způsobem zaujmout návštěvníka/zákazníka, ale podaří se vám to, když ani nebude vědět na co kliknout, nebo co si přečíst? Je super, když má design vyrovnaná tlačítka v jednom stylu, ale potom mají všechna tlačítka i stejnou váhu.

Neberte mě špatně - design má být v jednotném stylu a ideálně vyrovnaný (protože experimenty vycházejí spíš skutečným odborníkům, a pro ty článek určitě není), ale pro zachycení pozornosti musí něco tu jednotvárnost narušit. Jsou 2 základní metody jak toho docílit. Buď barevným odlišením, nebo rozdílnými velikostmi. Je ještě třetí možnost, odlišení pozicováním, kdy nějaký prvek zvýrazníte tím, že ho vložíte nějakým způsobem odlišně do designu - to je ale komplikovanější případ a raději si ho nechám na jindy. Při podobném rozlišování je třeba si správně určit, co je důležitější a podstatnější - a u toho si už musíte poradit sami, protože není v mých silách vypsat řadu možností, které mohou nastat. Ale pár příkladů za všechny - obecně bývají důležitější unikátnější části obsahu, ovládací prvky, jako například obsah hlavičky - vyhledávání, panel uživatele, tlačítka obecně. Tedy se obvykle zvládají zvýraznit nadpisem, který je uvádí. Tohle všechno je o znalostech a umění rozeznávat důležité od méně důležitého.

Barevné odlišení

Rozdíl barev by měl být úměrný důležitosti tlačítka. Pokud jde o něco zásadního, kde musíte zajistit, že opravdu nepůjde přehlédnout (vyhledávání u e-shopu, tlačítko prohlédnout nabídku u prezentace, apod.), klidně volte barvu blízko inverzní barvě, nebo co nejvýraznější v rámci vaší barevné palety. Pokud to není nutné, raději neexperimentujte s vícebarevnými tlačítky a pro ta skutečně důležitá si rezervujte jednu výraznou barvu. Pokud dodržíte určitý opakující se vzorek, návštěvník bude vědět co má očekávat. Pokud použijete u každého tlačítka jinou barvu, všechno je naprosto náhodné a návštěvníka tak akorát můžete zmást.

Rozdílné velikosti

Nejde o tak populární řešení jako změny barevnosti, alespoň u tlačítek rozhodně ne. V textu jde o naprostou samozřejmost, nadpis má upoutat vaší pozornost jako první a slouží i jako identifikační prvek, takže je vždy větší než obsahový text, který obvykle následuje - takže pokud vedle sebe postavíte 2 tlačítka, vůbec není problém jedno zvětšit a díky tomu na něj zaměřit pozornost návštěvníků. Větší věci jsou logicky lépe viditelné a proto výraznější, takže by se měly využívat u důležitějších věcí. Nemá smysl plýtvat velikostí na něco, co není důležité, protože pak nejen plýtváte místem, ale i pozorností uživatelů, což může být často i bolestivější. Proto třeba nejsem příznivcem zbytečných obrázků za každou cenu - obrázek přitáhne pozornost, ale pokud nemá žádný význam, je to jen ztráta času - vašeho i návštěvníka.

Klasickým příkladem může být stránka košíku u e-shopu - větší tlačítko pro pokračování jasně přitáhne pozornost. Lidé se mohou bát tuhle metodu uplatňovat jinde než u textu, protože jim může připadat, že pokud tlačítka nejsou stejně velká, už to nebude vypadat tak dobře, ale pak je to jen střet vkusu a něčí nechuť experimentovat. Když se to udělá pořádně, vypadá to dobře, má to účel a jde o fungující řešení. Proto se nebojte to někdy zkusit.

Co dělá výrazné věci výraznými?

Pojďme si ještě něco málo říct o výrazných prvcích obecně - zdá se to tak jednoduché, ale spousta lidí zřejmě vytváří designy bez jakéhokoliv pomyšlení na nějaký řád a harmonii, kde se důležité a výrazné prvky kombinují s těmi "normálními". Člověk by se měl snažit o to, aby na webu nebyly žádné zbytečnosti - ale i v případě, že se opravdu snažíte, si vaši návštěvníci většinou nepřečtou vše, co pro ně máte připravené, oni běžně nepřečtou skoro nic, pokud je to nezajímá. Proto je třeba brát klasický obsah jako neutrální půdu. Uživatel ví co může očekávat, ale není to "tahoun pozornosti".

Spousta vtipů o "klientech z pekla" se zakládá na tom, že zákazník chce vše zvýraznit. V tom případě nechápe situaci, kdy dochází k zvýraznění - můžeme se zasmát nad smýšlením takového člověka, tedy dokud se nám nestane to samé (a buďme upřímní, stalo se to nám všem). Výrazné prvky - jejich výraznost je dána tím, že se odlišují od svého okolí. Třeba taková červená je agresivní barva, ale pokud ji umístíte na oranžové pozadí, bílá bude daleko výraznější. Rozdíl vám určuje výraznost. Ve stejném duchu přemýšlejte nad řádem, který dáte vašemu webu nebo čemukoliv jinému - musíte dobře odhadnout, kolik věcí může být na určitém prostoru zvýrazněno, abyste to nepřehnali a nedosáhli pak toho, že vše bude stejně "výrazné". To znamená jediné - nic potom není výrazné, protože všechno vypadá podobně, design akorát pravděpodobně bude velmi agresivní a nepříjemný, protože jste využili silné barvy. Pokud se někdy dostanete do situace, kdy po vás klient bude požadovat něco podobného, zkuste mu vlastními slovy vyložit tento odstavec. Pokud je rozumný, měl by od svých požadavků ustoupit, protože si uvědomí, že to co požaduje, je nemožné. Zvýraznit vše je utopický požadavek.

Kromě zvýrazňování všeho bývá také oblíbeným požadavkem zvýrazňování nedůležitých částí. Například loga - někteří lidé mají pocit, že pokud nebude jejich logo na stránce tou největší věcí, tak... vlastně nevím. Tohle mi nikdy nikdo nebyl schopen vysvětlit, jak to zákazníkovi pomůže. Lidé jsou zvyklí loga hledat vlevo nahoře (nebo vpravo, ale nahoře) a mají je zafixované jako identitu webu (o tom budu mluvit v dalším díle, který se bude týkat zavedených standardů, na které se můžete u uživatelů spolehnout), a rozhodně nejdou na něčí web právě kvůli logu. Tohle je opět spíš případ zmýleného klienta, ale je to nejjednodušší příklad, který mohu dát. Designérovi se může spíš stát, že zvýrazňuje věci, které zase tak moc výrazné být nemusí - třeba menu. Menu je určitě důležitá část stránek, ale pokud je agresivně zabarvené, že se řadí mezi nejvýraznější prvky stránek, nemusí to být nutné - navigaci nebývá první věc, o kterou se návštěvník zajímá, a tak se domnívám, že můžete silné barvy využít jinde.

Tenhle díl byl velmi obecný a i ukázkové příklady spíš naprosto očividné konstatování. Můžete to brát i jako takové popíchnutí, abyste nad vztahy mezi důležitými a nedůležitými prvky víc přemýšleli. Věřím že pokud se začnete víc zajímat o to, jak držet důležité a ostatní prvky v harmonii, naučíte se posuzovat vaše konkrétní situace dost rychle. Protože opravdu nejde o nic jiného, než zhodnotit situaci a rozhodnout, co zvýraznit na úkor něčeho jiného, co prostě zůstane jen "normálně" viditelné.

Máte nějaký dotaz? Rádi byste něco dodali? Přidejte komentář, nebo mi pošlete e-mail, či co já vím. Další díl čekejte opět za týden ve středu.

Petr Široký Profil na fóru / Osobní stránky / Twitter Webdesignér povoláním, kritik přesvědčením, šašek duší, to vše zde najdete. Tutoriarts jsou poslední 3 roky můj největší osobní projekt. Kromě toho se zkouším věnovat jiným menším webovým projektům, živím se jako nezávislý webový designér a snažím se více hledět do budoucnosti, aby tyto stránky vzkvétaly.

Komentáře k článku

Nejste přihlášeni - před odesláním příspěvku vyplňte protispamovou kontrolu níže - váš komentář bude viditelný až po schválení správcem. Pro okamžité schválení se přihlašte, nebo registrujte. Registrace nezabere déle než minutu.

  • :-D
  • 8-|
  • :-/
  • 8-)
  • :-(
  • :-O
  • =(
  • =D
  • :-)
  • <3
  • ;-)

* Povinné položky

Nahoru

Autoři: Jakub Houdek, Jakub Šimůnek, Petr Široký a příležitostní sebevrazi