Chování lidí na webu se postupně mění s tím, jak se rozvíjí jejich
uživatelská zkušenost. Příčinou je technický pokrok a s ním
přicházející nová zařízení, lepší prohlížeče a tím pádem
i širší možnosti v oblasti webdesignu. Ze stejného důvodu se mění
i část doporučení v oblasti použitelnosti webů. V dnešním článku se
podíváme na přehyb stránky. Přečtěte si, co se postupem času
s přehybem stalo a jak se k němu při navrhování webů dnes nejlépe
postavit.
Co je to přehyb?
Velmi zjednodušeně se jedná o imaginární linii na
webu, která dělí část stránky viditelnou už při načtení stránky, a
oblast, která bez posouvání po stránce není viditelná. Poměrně
rozšířená je metafora přehybu s novinami, které leží na pultu
v trafice. Výtisk leží většinou přeložený. Abyste viděli oblast pod
přehybem, tedy spodní polovinu titulní stránky, musíte noviny vzít a
otočit. A to vyžaduje vaši aktivitu – ale je to pořád méně námahy
než pokud byste museli noviny vzít a otočit celou stránku. A proto
se také v horní polovině titulní stránky uvádějí nejdůležitější
informace – a to nejen v novinách, ale i na webu.
Umístění přehybu na webu H1.cz.
(Téměř) neměnná pravidla použitelnosti
Obecně platí, že ačkoliv se technologie velmi rychle mění, chování
uživatelů, a tedy i doporučení týkající se použitelnosti, se mění jen
relativně pomalu. Je tomu tak proto, že použitelnost je z velké části
závislá na tom, jakým způsobem náš mozek zpracovává informace. Ale aby
to nebylo tak jednoduché, máme také zkušenosti, které naše
zpracování informací ovlivňují. A ty se mohou měnit. Oborový
guru Jakob Nielsen v roce
2005 provedl revizi 944 pravidel použitelnosti, která sepsalo
americké letectvo pro své návrháře uživatelských rozhraní v polovině
80. let minulého století. Z 60 pravidel
vybraných napříč všemi kapitolami původní zprávy jich i po
20 letech platilo 54, tedy 90 %. Přesto je právě přehyb jednou
z oblastí, kde ke změnám doporučení v průběhu času došlo. Zatímco na
počátku webu znělo jasně: Dělejte stránky krátké a nenuťte uživatele
scrollovat dolů. Vše důležité umístěte nad přehyb a ideálně na webu
nenechávejte nic dalšího. Už v roce 1997 Jakob Nielsen
zajásal – dělat stránky delší, než byl přehyb, bylo nyní
dovoleno. Tento proces později podpořilo i rozšíření myší se
scrollovacím kolečkem. Uživatelé sice tvrdili, že takové stránky nemají
rádi, statistiky a výzkumy ale ukazovaly opak. A tak po období debat o tom,
zda to uživatelé rádi dlouhé, nebo krátké, se změnila i doporučení
týkající se přehybu. Nyní musely být všechny klíčové informace
nad přehybem a v místě přehybu bylo doporučováno umisťovat text
nebo obrázek tak, aby vypadal „useknutý,“ a tedy nutil uživatele
intuitivně scrollovat stránku dolů. Ovšem k tomu, abyste mohli navrhnout
stránku tak, aby vypadala „useknutá,“ potřebujete vědět, kde se
nachází přehyb.
Kde ho tedy najdete?
Přehyb je dnes všude a nikde. Na cestě do práce na mobilním zařízení
ho budete mít jinde než v práci, v práci jinde než doma – a to jsme
stále u jediného uživatele. Tři nejčastější umístění přehybu, jak
můžete vidět na grafu od ClickTale níže, se v roce 2006 týkala
pouhých 10 % uživatelů. Nejde totiž jen o rozlišení
obrazovky, ale také typ prohlížeče, nainstalované doplňky v prohlížeči
a také třeba velikost okna.
V roce
2006 se nejčastější umístění přehybu týkalo necelých 10 %
uživatelů. Dnes je to ještě méně. (Zdroj: ClickTale Blog). Abychom si to ještě více
zkomplikovali, do hry vstupuje čím dál tím vyšší počet mobilních
zařízení se zcela netypickým rozlišením a přibývájí nové možnosti,
jak si personalizovat prohlížeč. 30 % uživatelů ve Spojených státech se
pravidelně připojuje na internet z mobilních zařízení a odhady říkají,
že v roce 2013 překročí počet přístupů k internetu z mobilních
zařízení počty přístupů z pevného připojení.
Obrázek ilustruje srovnání rozlišení
monitorů návštěvníků webu H1.cz v letech 2006 a 2010. V roce
2006 mělo téměř 70 % návštěvníků jedno z dvou nejběžnějších
rozlišení. Dnes to není ani 40 %.Čeho byste se tedy měli držet při
návrhu webu, aby vyhovoval takto variabilnímu využití?
7 zásad pro přehyb stránky v roce 2010
1. Vyhněte se vodorovným liniím - pokud se stane, že
některý uživatel uvidí linku na konci stránky, může si ji splést
s koncem stránky nebo patičkou. Navíc je pravděpodobné, že toto pravidlo
bude platit dlouhodobě. V případě vodorovné linky se totiž jedná
o optické vodítko působící převážně podvědomě. 2. Není
třeba se snažit všechno umístit nad přehyb. Pokud se budete
snažit nahustit maximum obsahu nad přehyb, dopadne to tak, že z této
části stránky vznikne nepřehledná změť odkazů, textu a grafických
prvků. Nebojte se kolem důležitých prvků nechat více volného prostoru.
Místo toho se neustále ptejte, jaké prvky jsou důležité a klíčové
z hlediska obchodních cílů webu. 3. Navigaci raději umístěte do
spodní části hlavičky. Uživatelé totiž často odscrollují
horní část hlavičky, kde se nachází logo, vyhledávání, přepínač
jazykových mutací a případné další konvenční navigační prvky.
4. Pokud to s webem myslíte vážně i do budoucna,
zajistěte také mobilní verzi webu. Mobilní zařízení by
mělo být automaticky detekováno a přesměrovat uživatele na mobilní verzi,
která bude odpovídat pravidlům použitelnosti pro mobilní zařízení.
Zároveň by měl mít uživatel možnost vrátit se na původní verzi webu. Použitelnost
webu na mobilních zařízeních doporučujeme také otestovat.
5. Stále platí, že nejdůležitější je obsah. Pokud je
stránka opravdu dlouhá, nabídněte na konci stránky odkazy na
související informace – veďte uživatele dál bez toho, aby se
museli vracet k navigaci. 6. Dlouhá stránka může být někdy
příjemnější a vést k lepším výsledkům, než krátké
stránky, kterých musíte projít mnoho. Například v případě, že máte
v kategorii e-shopu hodně produktů, zvolte přiměřenou délku stránky do
2 000 px. Na začátku i na konci výpisu produktů uživatelům nabídněte
možnost přizpůsobit si počet zobrazených produktů na stránce.
7. Texty ilustrujte obrázky. Uživatelé stránky spíše
skenují, při scrollování pod přehybem to však platí dvojnásob.
Jak se k problematice přehybu stavíte vy? Počítáte se zobrazováním webu
na mobilních zařízeních s menším rozlišením? Těšíme se na vaše
komentáře a zkušenosti.
Najdou se i (extrémně dlouhé) výjimky :-))
https://www.conversion-rate-experts.com/…-case-study/
Hledám nějaké další stopy humoru, který naznačuje ta hravá práce s letopočty, ale jiné už najít namůžu. To je nějaký interní vtípek hájedničky, nebo vám utekl předčasně/opožděně aprílový článek?
Souhlasím s doporučeními, radím klientům umístit hlavní informace a výzvy k akci výš a pokud je nutné jít pod ohyb, tak to udělat tak, aby bylo vidět, že tam něco je, doporučuji často i článek rozdělit a nechat uživatele kliknout na „Čti více“ pro více informací.
Každopádně, v téhle době samozřejmě nešlo o pravidla webové použitelnosti, ale o použitelnost uživatelských rozhraní elektronickcýh systémů obecně. Faktem je, že z těchto pravidel se následně první pravidla použitelnosti webů odvíjela a v mnohém se velmi podobala. Pokud některá formulace v článku svádí k jiné interpretaci, rádi ji opravíme.
Tak jestli chcete chyby na opravy, tak třeba namátkou to tvrzení o deseti procentech v roce 2006: "V roce 2006 se nejčastější umístění přehybu týkalo necelých 10 % uživatelů. Dnes je to ještě méně. " Přitom tyhle procentní body lze zvýšit nebo srazit pouhým zjemněním nebo naředěním kroku histogramu. Teď je tam krok po deseti pixelech, stačí dát krok 40 pixelů a hned bude uživatelů s nejčastější výškou 30 %.
Mám-li k tomu přidat pozitivní postřeh, tak: kdykoli jsem se na webu setkal s někým, kdo mluvil o přehybu, šlo o reklamu. Při prodeji horké vody je každá nálepka dobrá, takže pro kůloučké marketéry je přehyb pořád in.
Díky za postřeh. Máte pravdu, bylo to ovšem myšleno při zachování intervalu dané statistiky (srovnávat dvě odlišné statistiky bez výslovného upozornění v článku by mě nenapadlo :). A co se týče reklamy – ve spodní části stránky by mohla mít dokonce lepší výsledky – většinou se zde návštěvníci zdrží o něco déle (během scrollování uživatelé spíš skenují, dole bývá na očních kamerách více fixací). A na webu, kde lidé píší komentáře (jako například na tomhle blogu), bych jako zadavatel neváhala zvolit reklamní prostor právě v dolní části – u pole k vložení komentáře, ankety, stránkování atd. Záleží tedy spíš na obsahu konkrétní stránky.
[4] OK, když si o to otevřeně koledujete, tak prosím. Jen mě překvapuje, že jste ochotni si takhle veřejně kazit odbornou pověst. Nesmíte se zlobit, ale vždyť jste v pozici řekněme Ústavu dějin AV, který vydá článek o tom, jaké byly sociální nepokoje za první republiky premiéra Masaryka koncem 19. století… Jistěže infomační hodnota o podstatě těch sociálních bouří může zůstat stále vysoká, ale hodnověrnost a autorita je s tak frapantně chybnými historickými údaji ta tam. A upřímně, kdo má o historii webu v téhle zemi vědět víc než odborníci z expertní firmy, za jakou se stavíte?
Ale OK, kdo chce kam…
Upřímně: pro mě není vůbec ostudou, že jste článek plný takovýchto chybných reálií publikovali, to se stane. Ale to, jak se k tomu stavíte. Nejen že sami ty historické nesouvislosti nevidíte, ale že je i odmítáte přiznat jakožto nepodstatné. Co na tom, že Masaryk ve skutečnosti nedělal předsedu vlády Franzi Josefovi, když Musolini válčil s Napoleonem – hlavní jsou ty sociální bouře, ty jsme myslím popsali celkem pěkně, že.
Dekujeme ti, Pixy, zes to nam i nasim ctenarum tak pekne didakticky vysvetlil. Je pekne, ze jsou mezi nami jeste lide s takovym smyslem pro detail.
@Yuhů – já nevím, my jsme v o2 marketéry o neplatnosti argumentu přehybem poměrně jednoduše přesvědčili už před dvěma lety, přestože je před třemi lety naši bývalí kolegové v oblasti veledůležitého přehybu náležitě edukovali… z mojí zkušenosti je to jenom jedna z dalších přifouknutých bublin – stačí brát věci s nadhledem a dogmata neexistují
[7] Palec nahoru.
[8] Dobrý den, Davide.
Z Vaší reakce na Pixyho komentář cítím notnou dávku ironie. Pokud se pletu a komentář Vás opravdu oslovil, nebylo by lepší ty bláboly v článku smazat a Pixymu poděkovat lepším způsobem?
Přijde mi, že H1.cz nosí den ode dne nos více nahoru, avšak kvalita klesá dolů.
[7] Díky za doplnění, Petře. Článek na základě Tvých (správných) korekcí po víkendu opravíme, aby odpovídala nejen na konci uvedená doporučení, ale i historické reálie.
Za předpokladu (možná zcela mylného), že autorkou je sl./pí Mikulášková se při „hodnocení kvality“ příspěvku dá dost možná vycházet z autorčina „profilu“ (https://www.h1.cz/tym#…), který není zrovna těmto věcem nakloněn… Pak asi není moc co řešit. A nebo to napsal někdo jiný a pak…
Článek jsme upravili a věřím, že ho lze nyní považovat za korektní i z pohledu historických souvislostí. Ještě jednou díky Petru Staníčkovi za připomínky.