Prečo pekný web nestačí, ak používateľ nevie, čo má urobiť ďalej

Moderný web môže vyzerať profesionálne, používať kvalitné fotografie, animácie a prémiovú typografiu.

To však ešte neznamená, že bude fungovať.

Ak používateľ nerozumie tomu, čo firma ponúka, kde má kliknúť a aký krok má urobiť ďalej, aj vizuálne kvalitná stránka môže prinášať málo dopytov.

Dobrý web preto nie je iba o dizajne.

Musí používateľa viesť.

Každá sekcia, každé tlačidlo a každá stránka by mali mať jasný účel. Návštevník musí rýchlo pochopiť, kde sa nachádza, čo môže získať a čo má urobiť ako ďalšie.

Práve to je základ kvalitného používateľského zážitku.

Pekný dizajn a funkčný web nie sú to isté

Vizuálny dizajn ovplyvňuje prvý dojem.

Pomáha firme pôsobiť profesionálne, dôveryhodne a moderne. Môže odlíšiť značku od konkurencie a podporiť vnímanie kvality.

Dizajn však sám o sebe nevyrieši používateľskú cestu.

Web môže vyzerať výborne, ale stále môže mať:

• nejasnú hlavnú ponuku,
• komplikované menu,
• príliš veľa tlačidiel,
• slabé výzvy na akciu,
• nečitateľné texty,
• chýbajúce informácie,
• nejasný ďalší krok,
• zložitý kontaktný formulár.

Ak sa návštevník musí zamýšľať nad tým, kam kliknúť, web od neho vyžaduje zbytočné úsilie.

Čím viac úsilia musí používateľ vynaložiť, tým väčšia je pravdepodobnosť, že stránku opustí.

Používateľ neprichádza obdivovať web

Väčšina návštevníkov neprichádza na firemný web preto, aby hodnotila farby, animácie alebo kreativitu dizajnéra.

Prichádza s konkrétnym cieľom.

Môže chcieť:

• zistiť, čo firma ponúka,
• pozrieť si realizácie,
• porovnať možnosti,
• nájsť cenu,
• overiť dôveryhodnosť firmy,
• získať cenovú ponuku,
• objednať konzultáciu,
• kontaktovať obchodníka.

Úlohou webu je pomôcť mu tento cieľ dosiahnuť čo najjednoduchšie.

Vizuálna stránka by mala tento proces podporovať, nie ho komplikovať.

Najlepší dizajn často nepôsobí zložito. Používateľ prirodzene vie, kam sa má pozrieť a čo má urobiť.

Prvých pár sekúnd rozhoduje

Po otvorení webu si návštevník veľmi rýchlo vytvorí základný obraz.

Potrebuje pochopiť:

• kto ste,
• čo robíte,
• pre koho to robíte,
• prečo by ho to malo zaujímať,
• čo môže urobiť ďalej.

Ak hero sekcia obsahuje iba všeobecný slogan, používateľ nemusí pochopiť skutočnú ponuku.

Text ako:

„Tvoríme digitálne zážitky budúcnosti“

môže znieť moderne, ale nevysvetľuje, či firma vytvára weby, aplikácie, reklamy alebo softvér.

Jasnejšia formulácia môže byť:

„Tvoríme weby, aplikácie a konfigurátory, ktoré firmám prinášajú viac dopytov.“

Používateľ okamžite vie, čo firma robí a aký prínos môže očakávať.

Kreativita má zmysel až vtedy, keď nepoškodzuje zrozumiteľnosť.

Každá stránka potrebuje hlavný cieľ

Jednou z častých chýb je, že stránka sa snaží dosiahnuť príliš veľa vecí naraz.

Obsahuje tlačidlá na kontakt, portfólio, cenník, newsletter, sociálne siete, stiahnutie dokumentu a ďalšie podstránky.

Používateľ potom nevie, ktorý krok je najdôležitejší.

Každá stránka by mala mať jeden hlavný cieľ.

Napríklad:

• domovská stránka má predstaviť firmu a priviesť návštevníka ku kontaktu,
• stránka služby má vysvetliť riešenie a získať dopyt,
• realizácia má ukázať výsledok a posilniť dôveru,
• blogový článok má používateľa vzdelávať a nasmerovať na relevantnú službu,
• konfigurátor má používateľa doviesť k dokončeniu návrhu.

Vedľajšie akcie môžu existovať, ale nesmú konkurovať hlavnému cieľu.

Výzva na akciu musí byť konkrétna

Text tlačidla výrazne ovplyvňuje to, či používateľ pochopí jeho význam.

Nejasné tlačidlá ako:

• Viac
• Pokračovať
• Zistiť viac
• Kliknite sem
• Odoslať

nepovedia používateľovi, čo sa po kliknutí stane.

Lepšie sú konkrétne výzvy:

• Pozrieť realizácie
• Vytvoriť cenovú ponuku
• Navrhnúť vlastnú pergolu
• Objednať konzultáciu
• Zobraziť dostupné byty
• Napísať nám o projekte

Dobré tlačidlo odpovedá na otázku:

„Čo získam, keď naň kliknem?“

Používateľ by nemal byť výsledkom kliknutia prekvapený.

Tlačidlo musí byť aj vizuálne viditeľné

Nestačí použiť správny text.

Hlavná výzva na akciu musí byť vizuálne rozpoznateľná.

Mala by mať:

• dostatočný kontrast,
• jasný tvar,
• primeranú veľkosť,
• dostatok priestoru okolo seba,
• viditeľný stav pri prejdení myšou,
• viditeľný stav pri ovládaní klávesnicou.

Ak všetky tlačidlá vyzerajú rovnako, používateľ nevie, ktoré je hlavné.

Ak tlačidlo vyzerá ako obyčajný text, časť návštevníkov si nemusí uvedomiť, že je klikateľné.

Primárne a sekundárne akcie by mali byť vizuálne odlíšené.

Primárne tlačidlo môže používať výraznejší brandový prvok. Sekundárne môže byť jednoduchšie alebo iba textové.

Používateľ musí vždy vedieť, kde sa nachádza

Pri rozsiahlejších weboch je dôležitá orientácia.

Návštevník môže prísť priamo na podstránku z reklamy, vyhľadávača alebo sociálnej siete. Nemusí začínať na domovskej stránke.

Každá podstránka preto musí fungovať aj samostatne.

Používateľ by mal vedieť:

• čo je témou stránky,
• ku ktorej službe patrí,
• kde nájde ďalšie informácie,
• ako sa môže vrátiť,
• čo môže urobiť po dočítaní.

Pomáha jasný nadpis, logické menu, označený aktívny stav a pri hlbších štruktúrach aj navigačná cesta.

Nemalo by byť potrebné vracať sa na domovskú stránku len preto, aby návštevník pochopil kontext.

Navigácia musí používať jazyk zákazníka

Firmy často používajú interné názvy, ktorým rozumejú ich zamestnanci, ale nie zákazníci.

Menu môže obsahovať kreatívne alebo technické pomenovania, ktoré pôsobia originálne, ale nie sú zrozumiteľné.

Používateľ by nemal hádať, čo sa skrýva pod názvom sekcie.

Názvy ako:

• Služby
• Realizácie
• Konfigurátory
• O nás
• Blog
• Kontakt

sú jednoduché, ale zrozumiteľné.

Originalita sa môže prejaviť v dizajne, textoch a prezentácii značky.

Základná navigácia by mala zostať predvídateľná.

Veľa možností môže znižovať počet rozhodnutí

Môže sa zdať, že čím viac možností používateľovi ponúkneme, tým lepšie.

V praxi však veľké množstvo rovnocenných možností často spôsobí neistotu.

Ak návštevník vidí desať služieb, šesť tlačidiel a tri rôzne formuláre, môže odložiť rozhodnutie.

Web by mal informácie postupne dávkovať.

Najprv vysvetlí hlavnú ponuku.

Potom ukáže relevantné služby.

Následne poskytne dôkazy, príklady a odpovede na otázky.

Až potom používateľa vyzve ku konkrétnej akcii.

Dobrý web neukáže všetko naraz. Zobrazí správnu informáciu v správnom momente.

Obsah musí odpovedať na reálne otázky

Používateľ nemôže urobiť ďalší krok, ak mu chýbajú dôležité informácie.

Pred kontaktovaním firmy môže potrebovať vedieť:

• čo presne dostane,
• ako proces funguje,
• pre koho je služba vhodná,
• koľko približne stojí,
• ako dlho realizácia trvá,
• čo musí dodať,
• aké výsledky firma dosiahla,
• čo sa stane po odoslaní formulára.

Ak web tieto otázky ignoruje, používateľ môže odísť ku konkurencii, ktorá ich vysvetlí jasnejšie.

Stručnosť je dôležitá, ale nesmie znamenať chýbajúci obsah.

Úlohou UX nie je odstrániť všetky texty. Úlohou je usporiadať ich tak, aby sa dali jednoducho pochopiť a skenovať.

Referencie musia pomáhať pri rozhodovaní

Sekcia realizácií často obsahuje iba pekné obrázky a názvy projektov.

To je vizuálne atraktívne, ale nemusí to používateľovi stačiť.

Kvalitná referencia by mala vysvetliť:

• aký problém klient riešil,
• čo Lucero vytvorilo,
• prečo bol zvolený konkrétny prístup,
• aké funkcie riešenie obsahuje,
• aký bol výsledok,
• pre aký typ firmy je podobné riešenie vhodné.

Návštevník si tak môže spojiť realizáciu so svojou vlastnou situáciou.

Referencie nemajú iba dokazovať, že firma vie tvoriť pekné výstupy.

Majú ukázať, že rozumie obchodným problémom klienta.

Formulár nesmie byť poslednou prekážkou

Používateľ môže prejsť celým webom, rozhodnúť sa kontaktovať firmu a následne odísť pri komplikovanom formulári.

Častým problémom je príliš veľa povinných polí.

Firma môže chcieť získať všetky možné informácie, ale používateľ ešte nemusí mať presnú predstavu.

Pri prvom kontakte často stačí:

• meno,
• e-mail alebo telefón,
• stručný opis projektu.

Ďalšie informácie sa môžu zisťovať neskôr alebo prostredníctvom jednoduchého krokového formulára.

Formulár by mal zároveň vysvetliť:

• čo sa stane po odoslaní,
• kedy môže používateľ očakávať odpoveď,
• kto ho kontaktuje,
• či ide o nezáväzný dopyt.

Neistota nekončí kliknutím na tlačidlo.

Používateľ potrebuje poznať aj ďalší priebeh.

Mobilná verzia potrebuje vlastnú používateľskú cestu

Web navrhnutý pre desktop nemusí automaticky fungovať na mobile.

Na menšej obrazovke sa mení:

• množstvo viditeľného obsahu,
• spôsob ovládania,
• veľkosť tlačidiel,
• poradie sekcií,
• dĺžka textov,
• správanie menu,
• pozornosť používateľa.

Mobilný návštevník môže prísť z reklamy a rozhodovať sa rýchlejšie.

Dôležitá akcia preto nesmie byť ukrytá na konci dlhej stránky alebo v komplikovanom menu.

Tlačidlá musia byť dostatočne veľké a medzi jednotlivými prvkami musí byť dostatok priestoru.

Používateľ by nemal omylom kliknúť na nesprávnu možnosť.

Mobilná verzia nie je zmenšený desktop. Je to samostatne premyslený spôsob používania webu.

Rýchlosť je súčasť používateľského zážitku

Aj najlepšie navrhnutá cesta zlyhá, ak sa web načítava príliš dlho.

Veľké videá, neoptimalizované obrázky, 3D prvky a nadmerné animácie môžu spomaliť stránku.

Používateľ potom čaká namiesto toho, aby pokračoval.

Vizuálne efekty by preto mali mať jasný účel.

Animácia môže:

• usmerniť pozornosť,
• vysvetliť zmenu,
• ukázať postup,
• zlepšiť plynulosť rozhrania.

Nemala by existovať iba preto, aby web pôsobil drahšie.

Ak efekt spomaľuje obsah, zakrýva tlačidlo alebo zhoršuje čitateľnosť, poškodzuje výsledok.

Prístupnosť zlepšuje web pre všetkých

Prístupnosť nie je dôležitá iba pre malú skupinu používateľov.

Mnohé pravidlá prístupnosti zároveň zlepšujú všeobecnú použiteľnosť.

Patrí sem:

• dostatočný kontrast textu,
• čitateľná veľkosť písma,
• jasné názvy tlačidiel,
• viditeľné stavy zamerania,
• ovládanie klávesnicou,
• alternatívne texty obrázkov,
• zrozumiteľné chybové hlášky,
• dostatočne veľké dotykové prvky.

Svetlosivý text na čiernom pozadí môže vyzerať elegantne, ale ak je kontrast príliš nízky, používatelia ho budú čítať s problémami.

Rovnako nestačí odlíšiť stav iba farbou.

Ak formulár označí chybu iba červeným rámikom, časť používateľov nemusí pochopiť, čo sa stalo. Potrebuje aj jasnú textovú informáciu.

Používateľská cesta musí pokračovať medzi stránkami

Každá stránka by mala prirodzene viesť k ďalšej.

Používateľ si napríklad otvorí realizáciu webu pre realitný projekt.

Po jej prezretí môže chcieť:

• vidieť ďalšie realitné projekty,
• prečítať si o tvorbe realitných webov,
• pozrieť si interaktívny výber bytov,
• zistiť viac o 3D vizualizáciách,
• kontaktovať Lucero.

Tieto možnosti by mali byť priamo dostupné.

Ak stránka skončí bez ďalšieho kroku, používateľ musí sám premýšľať, kam pokračovať.

Každý koniec sekcie je príležitosť nasmerovať ho ďalej.

Ako vyzerá jasná cesta na firemnom webe

Jednoduchá používateľská cesta môže vyzerať takto:

1. Návštevník pochopí hlavnú ponuku.
2. Vyberie si relevantnú službu.
3. Zistí, ako služba funguje.
4. Pozrie si konkrétne realizácie.
5. Prečíta si odpovede na časté otázky.
6. Uvidí jasnú výzvu na kontakt.
7. Odošle jednoduchý dopyt.
8. Dostane potvrdenie a informáciu o ďalšom postupe.

Každý krok odpovedá na jednu otázku a pripravuje používateľa na ďalšie rozhodnutie.

Web nemusí tlačiť návštevníka do kontaktu okamžite.

Mal by mu však vždy ukazovať, kam môže pokračovať.

Ako odhaliť nejasné miesta na webe

Firma môže svoj web považovať za zrozumiteľný, pretože jeho obsah dobre pozná.

Nový používateľ však nemá rovnaký kontext.

Užitočné je sledovať web očami človeka, ktorý firmu nikdy predtým nevidel.

Pri každej stránke sa treba pýtať:

• Je okamžite jasné, čo táto stránka ponúka?
• Vie používateľ, pre koho je služba určená?
• Má dostatok informácií na rozhodnutie?
• Je hlavná akcia viditeľná?
• Rozumie tomu, čo sa stane po kliknutí?
• Vie, kam pokračovať, ak ešte nechce kontaktovať firmu?
• Funguje rovnaká cesta aj na mobile?

Pomôcť môžu aj analytické dáta.

Firma môže sledovať:

• kde používatelia odchádzajú,
• na ktoré tlačidlá klikajú,
• ako ďaleko scrollujú,
• ktoré stránky navštevujú pred odoslaním dopytu,
• pri ktorom poli opúšťajú formulár.

Dizajn by sa nemal optimalizovať iba podľa pocitu.

Reálne správanie používateľov môže ukázať problémy, ktoré nie sú na prvý pohľad viditeľné.

Najčastejšie UX chyby na firemných weboch

Medzi časté problémy patria:

• nejasný hlavný nadpis,
• príliš abstraktný text,
• veľké množstvo rovnocenných tlačidiel,
• skryté kontaktné možnosti,
• neprehľadné menu,
• dlhé texty bez členenia,
• slabý kontrast,
• malé tlačidlá na mobile,
• automatické animácie, ktoré rušia čítanie,
• referencia bez vysvetlenia výsledku,
• formulár s príliš veľkým počtom polí,
• chýbajúce potvrdenie po odoslaní,
• stránka bez jasného pokračovania.

Každá z týchto chýb môže pôsobiť ako malá.

Spolu však vytvárajú pocit neistoty a znižujú pravdepodobnosť, že používateľ dokončí požadovanú akciu.

Pekný web má podporovať obchodný cieľ

Dizajn a obchodný výkon nemusia byť v konflikte.

Prémiový web môže byť zároveň jasný, jednoduchý a funkčný.

Vizuálna kvalita môže:

• zvýrazniť najdôležitejší obsah,
• vybudovať dôveru,
• vysvetliť komplexnú službu,
• vytvoriť zapamätateľný zážitok,
• usmerniť pohyb používateľa,
• posilniť výzvu na akciu.

Rozdiel je v tom, či bol dizajn vytvorený iba pre efekt alebo ako súčasť premyslenej používateľskej cesty.

Web nie je hotový vtedy, keď dobre vyzerá.

Je hotový vtedy, keď používateľ vie, čo má urobiť, dokáže to urobiť bez problémov a firma získava výsledok, pre ktorý bol web vytvorený.

Záver

Pekný web môže zaujať, ale samotný vizuálny dojem nestačí.

Ak používateľ nerozumie ponuke, nevie nájsť informácie alebo nevidí jasný ďalší krok, stránka nebude naplno plniť svoj účel.

Kvalitný web spája dizajn, obsah, navigáciu, rýchlosť a používateľskú cestu do jedného systému.

Každá sekcia by mala návštevníkovi pomôcť odpovedať na otázku a pripraviť ho na ďalšie rozhodnutie.

Najlepší web nie je ten, na ktorom používateľ obdivuje množstvo efektov.

Je to web, na ktorom prirodzene a bez neistoty urobí to, čo potrebuje.

Neviete, kde sa používatelia na vašom webe strácajú?

V Lucero navrhujeme weby podľa reálnych používateľských ciest, nie iba podľa toho, čo dobre vyzerá.

Analyzujeme, čo návštevník potrebuje vidieť, kde má kliknúť a aké informácie potrebuje pred odoslaním dopytu.

Výsledkom je digitálny zážitok, ktorý podporuje značku a zároveň vedie používateľa ku konkrétnej akcii.

Napíšte nám a pozrieme sa na používateľskú cestu vášho webu.