"The Fold" - záhada o zlome stránky



Verím, že web dizajnérom, grafikom a podobným profesiám je pojem "The Fold" dobre známy. Pre tých západnejších, prípadne zaoceánskych je to tiež známy pojem a nemusia byť ani grafici. "The Fold" je pomenovanie zohnutia novín vo svete webu. My Slováci a náš Nový Čas v A4 formáte zrovna nemusí byť ten zohýbaný (ani kupovaný, popravde), ale v zahraničí sú noviny menej kompaktného formátu a tam je už trochu problém. Tento priestor je, rovnako ako v novinách, aj na webe veľmi prominentný. Ja preskúmam, či je tomu tak a ako na weby s dlhýýýým obsahom.

Jakob Nielsen, UX "provocateur", guru a neviem čo ešte tvrdí, že len 20% ľudí sa venuje obsahu pod fold-om. Ogilvy, "original mad man", reklamný guru, už v šestdesiatych rokoch tvrdil, že len 20% ľudí sa dostane cez nadpis. Jules, UX "amateur" tvrdí, že tomu tak nie je, lebo čas plynie. No dobre... nie som prvý, čo sa touto témou zaoberá.

Pozriem sa trochu na čísla a čo za nimi stojí. Ogilvy prieskumom zistil, že čítanosť titulku klesá pokiaľ má nad 50 slov, potom je to už jedno, či 50 alebo 500 slov, rozdiely sú minimálne. Keď si  prerátame 500 slov na výšku, je to viacej, ako má najpopulárnejšie rozlíšenie (1366 x 768, podľa analytiky statcounter.com). Súdim teda, že keď je niekto zaujatý textom, dočíta odsek a teda aj prejde mystickým fold-om.



Ak má nejaký obsah prežiť pod úrovňou 600px, je vhodné držať sa jednoduchej marketingovej rady, ktorá koluje internetmi približne rovnako dlho, ako strašiak fold a je známa už skoro 90 rokov mimo internetov. Volajú ju AIDA a je to anglický akronym pre upútanie (attention), záujem (interest), túžbu (desire) a pre akciu (action). Premenené na drobné:

Upútanie: Upútanie vyvolávajú určité slová, ktoré na ľudí fungujú skvelo. Umiestnenie magických slov na začiatok stránky vyvolá snahu dopátrať sa k výsledku. Ak magické slová nie sú zrovna správnou šálkou kávy pre môj biznis (nie každému vyhovuje mať v titulku slová ako "nový", "sex", "zadarmo", "ty/vy", "garantuje"), jednoducho ich nahradím niečím, čo ukáže malý náhľad na výsledok mojej práce, výsledný produkt, alebo pocit, ktorý moja služba vytvára. Všimnite si, ako Apple uvádza iPad, nekomunikujú produkt ako "iPad 4 je tu", ale skôr "nový iPad je tu".



Záujem: v každom bode obsahu by mal figurovať nejaký "oživovač". To je pán, alebo grafický prvok, alebo nejaký iný element, ktorý nejakým spôsobom udrží zákazníka na špičkách. Dobre fungujú pohybujúce sa elementy. Hýbajúcich sa stránok počas scroll-ovania ("kolieskovania") je na internete ako húb po daždi. Nie je to jediný spôsob: gamifikácia, prípadne interakcie vyvolané po ceste naprieč stránkou, rôzne pozitívne prekvapenia a čokoľvek, čo udrží záujem... Internet si niekedy zamieňa záujem so slovom engagement (o ktorom som písal pri gamifikácií).

Túžba: kým budovanie záujmu je naozaj dôležité, ide o neuchopiteľný artikel. Túžba je reálny benefit produktu alebo služby, reálny dopad na život človeka. Pre zjednodušenie: je to odpoveď na otázku: "a čo?". Použitie: "iPad: Rovnako úžasný a dvakrát rýchlejší.", "a čo?", "Hry sú plynulé. Aplikácie sa púšťajú rýchlejšie. A ostatní Vám budú závidieť." Ako dostať túžbu do návrhu UX? Samozrejme, že kvalitný text od copywriter-a a obrázok sú silné zbrane, ale sústo musí byť podané v správnom momente, na správnom mieste a s presvedčivým argumentom, aby zafungovalo.

Pre dlhé stránky je dobré prerozprávať si obsah formou dialógu. Rád používam tento spôsob overenia si toho, ako som navrhol postupnosť dávkovania obsahu návštevníkom stránky. Vymyslím si imaginárny rozhovor, najlepšie s dobre navrhnutou UX persónou a snažím sa stránkou promovaný produkt "predať" tejto persóne. Ak mi tento rozhovor znie ako reálny rozhovor a nie vykonštruovaný, viem, že som zrobil dobre.

Akcia: je väčšinou tlačidlo alebo nejaký logický popud na záver. Kúpte teraz a ušetríte!



Jakob Nielsen vo svojom staršom článku (2010) tvrdil, že používatelia prezerajú dlhé stránky niekoľkými vzorovými spôsobmi. Typické je preskočiť stred a skontrolovať poslednú položku nejakého zoznamu. Niektorí si prezrú len úvodných pár produktov e-shopu a vedia, že to nie je nič pre nich. Posledná skupina skenuje obsah krok po kroku, ale zameriava sa na čiastočné informácie ako nadpisy, prípadne len obrázky.
Prejdem teraz niekoľko vecí, na ktoré som si dával pozor pri riešení stránky, ktorá má výzvu do akcie na neočakávanom mieste - dole.



DOs & DON'Ts: (čo robiť a čoho sa vyvarovať)
  1. Menej obsahu nad fold-om zabezpečí hľadanie tohto obsahu na zbytku stránky.
  2. Na to, aby ľudia scroll-ovali, je potrebné ilustrovať, že to, čo vidia nie je všetko. Zabezpečte, že nejaký prvok UI je useknutý alebo vyslovene jednoducho naznačte, že svet sa skrýva za kolieskom myši. Vo Windowse 8 na mobiloch vidno vždy nejakú plôšku useknutú a to indikuje, že obsah ešte pokračuje v niektorom smere.
  3. Kontrola stránky pomocou dialógu s fiktívnym návštevníkom, persónou odchytí komunikačné a interpretačné chyby, ktoré môžu nastať napríklad stratou kontextu, alebo orientácie na dlhej stránke.
  4. Združovanie informácií je dôležité pri dlhých stránkach. Pomáha prekonať problémy a vnesie do stránky možnosť klasifikovať odkazy a obsah do logických skupín. Používateľ sa vie ľahšie zorientovať a nájsť zmysel v zobrazených informáciách.
  5. Pozor na silné vizuálne bariéry, ktoré môžu byť interpretované ako predčasný koniec obsahu.
  6. Neodporúčam používať vložený obsah s vlastnými scrollbar-mi ani podobné praktiky na dlhých stránkach. USAtoday.com - pravý panel môže neskúsenému človeku trochu prekážať pri pohybe.
  7. Premyslite si, kam chcete používateľa dostať. Nesnažte sa dostať ho všade. Viacej výziev do akcie na malom mieste stránky môže viesť ku zmätku a napokon aj k tomu, že stránka bude mať viacej  výziev do akcie ako obsahu. Namiesto toho je vhodné ukončiť stránku jednou "poriadnou" výzvou do akcie.
  8. Pravidlo tretiniek a pravidlo zlatého rezu platí aj pre vertikálny priestor stránky. Separačným prvkom  môže byť práve The Fold.
AIDA:
  1. Upútajte titulkom alebo obrázkom nad fold-om. Z tohto textu by malo byť jasné, či je na správnej stránke a čo sa skrýva ďalej. Funguje to rovnako ako nadpisy vo veľko-formátových novinách. Titulok by mal byť kvôli vyhľadávačom podobný s popisom stránky. Napríklad: ak sa stránka zaoberá okuliarmi v titulku by mali byť spomenuté okuliare.
  2. Zaujmite oživeniami - najlepšie takými, ktoré vyvolajú vysokú mieru engagement-u. Budujte úroveň záujmu od fold-u až po pätu stránky tak, aby na záver neboli žiadne pochybnosti o kvalite služby. Treba mať na mysli aj to, aký obsah je naozaj dôležitý, aby sa budovanie záujmu napokon neznamenalo zabitie túžby (ďalší bod).
  3. Vyvolajte túžbu, emóciu zameranú na to, ako služba zľahčuje život, aké sú jej reálne benefity. Sociálny tlak je v tomto prípade efektívnym katalyzátorom túžby.
Takýto zoznam mi zvyčajne poslúži na to, aby som na nič nezabudol pri návrhu. Je len pomôckou, nemá mi diktovať presný postup pri riešení. Trochu zasahuje do stratégie obsahu, trochu do copywriting-u, trochu do web dizajnu, trochu do SEO a trochu do marketingu. UX je veľká paráda. Som rád, že rozumiem dôvodom, prečo vzniká také veľké množstvo pútavých dlhých stránok.


0 komentárov :

Zverejnenie komentára