Webmorzsa

Középiskolában volt egy tanárom, aki instant egyessel jutalmazta azt, aki a házidolgozatában bármilyen internetes forrásra hivatkozott. Az ő elve az volt, hogy a kutatómunkát a könyvtárban kell elvégezni, mert az "internet nem hiteles". Mivel ez 1997 körül volt, a világháló még nekünk is újdonságnak számított, ezért nem is nagyon álltunk le vitatkozni vele. Szorgalmasan járogattunk a könyvtárba, és valahogy offline forrásokból is leérettségiztünk.

Aztán szép csendben eltelt bő tíz év, és most már nem tudom elképzelni, hogy van tanár az országban, aki az internet használata ellen emelné fel a szavát. Az információfogyasztási szokások alapjaiban változtak meg, és egy rakás, egykor papíralapú információ került át az internetre.

Vajon mit szólt volna az említett tanár, ha valaki azt jósolja neki, hogy pár év múlva nem vásárolunk lexikonokat, hisz ott lesz a Wikipedia? Vagy hogy térképek szerepét a Google Maps és GPS szoftverek veszik át? Hogy sokak nem a napilapokból tájékozódnak, hanem az Indexről? Hogy a telefonkönyv már csak porfogónak lesz jó, hisz ott lesz az online tudakozó?

Évek óta használom, de csak most gondolkodtam el rajta, hogy Gmail vajon miért Discardnak nevezi a levélírás visszavonás funkciót? (Arról van szó, amikor elkezdünk írni egy levelet, majd rájövünk, hogy mégsem akarjuk sem elküldeni, sem elmenteni.)

Nyilván mindenki rájött már, hogy mit takar ez a gomb, de szerintem sokkal könnyebben meg lehetne találni, ha a széles körben használt Cancel lenne a megnevezése. Talán az sem lenne baj, ha ez nem gomb lenne, hanem inkább szöveges link, hiszen másodrendű funckóról van szó, bár nem hiszem, hogy a Google-nak használhatósági tanácsra lenne szüksége :)

Ugyanezt a gombot sikerült a magyar verzióban Elvet névre keresztelni, ez viszont tényleg kritikán aluli.

Lehet, hogy kicsit félrevezető a cím: ez a post nem a nagy keresőoldalakat boncolgatja (azt már megtették mások), hanem a portálokba épített keresők használhatóságával foglalkozik. A következő lista, amely a Userfocus által publikált 20 Search Usability Guidelines c. írásra épül, megpróbálja összeszedni, hogy felhasználói szempontból milyen az ideális kereső.

A kereső megjelenése

• A kereső ott van, ahol a felhasználók megszokták (jobb felső sarok és környéke)

• A kereső elemei egyértelműen vannak szövegezve, a kereső felismerhető
• A kereső használatát tippek és súgó is segítik
• A szövegbeviteli mező elég hosszú a tipikus keresési kifejezésekhez

Rövid időn belül ismét ráncfelvarráson esett át az Alexandra.hu. Úgy tűnik, az arculathoz némi színezésen túl nem nyúltak nagyon hozzá, inkább a használhatóságot helyezték előtérbe. Alapvetően jót tettek az oldalnak a módosítások, de még mindig maradt jó pár apróság, amin javítani lehetne.

A fejléc a korábbi változathoz képest sokkal áttekinthetőbb lett, a legfelső sor kis zavarosságától eltekintve. (Vajon miért félnek a designerek a háttértől eltérő színű input mezők használatától?) Az is rejtély, hogy miért kell kitenni 2009-ben egy webáruház fejlécébe az aktuális dátumot és névnapot.

A tabokra rendezett főkategóriák viszont prominensen jelennek meg, az eltérő színű fülek jól hangsúlyozzák, hogy a vállalat nem csak könyvekkel foglalkozik. A főmenük alatti navigációs sor azonban minden koncepciót nélkülöz. Látszólag a maradék linkek kerültek oda, hogy kitöltsék a sort:

Ez már megint OTP lesz, pedig tényleg semmi közöm a bankhoz. Kijöttek ezzel a Nemduma koncepcióval, ami bár nekem személy szerint nem tetszik, de mivel a standupnak manapság kultusza van, jó alapötletre épül. A problémám igazából a hozzá kapcsolódó online hirdetésekkel van, amit elég sokszor látni például az Index cikkoldalain.

A banner tervezésekor figyelembe vették azt, hogy a hangos flash hirdetések sokakat idegesítenek, és egy kreatív megoldással igyekeztek ennek ellenére figyelemfelkeltő bannert készíteni. Nevezetesen a videóbannerben lévő szereplő gesztikulál hevesen felénk, hogy hangosítsuk fel a hirdetést.

A megoldás jól sikerült, csak sajnos túl jól. Az integető alak ugyanis olyan intenzíven vonzza a szemet, hogy az oldal lényegi tartalma (a cikk, amelyért az oldalra látogattam!) egyszerűen olvashatatlanná válik. Innentől kezdve pedig pont ellenkező hatást ér el, hiszen már nem a figyelmet kelti fel, hanem frusztációt okoz a felhasználóban. Ezáltal pedig nem különbözik a rettegett kattancstól.

Nemrég bukkantam a következő usability szempontlistára, amin szerintem minden weboldal tulajdonosnak kötelezően végig kellene mennie. Az írás kompakt formában összefoglalja, hogy mikre kell odafigyelni, ha jól használható, ergonomikus weboldalt szeretnénk.
(Megjegyzés: ez a post a fenti lista hevenyészett szabadfordítása, az eredeti megtekinthető itt.)

1. Elfogadható betöltődési idő

Logikus: ha túl sokáig töltődik az oldal, a látogató nem várja meg, és továbbmegy. Attól, hogy már szinte mindenkinek szélessávú hozzáférése van, csak még türelmetlenebbek lettek a felhasználók.

2. Megfelelő kontraszt

Bár a designerek imádják a halványszürke háttéren sötétszürke betűket, a látogatóink ezt nem díjazzák. Ők olvasni akarnak, erre pedig a fehér alapon fekete betű a legjobb.

3. Olvasható betűméretek és közök

Magától értetődő: a betű legyen akkora, hogy könnyen el lehessen olvasni, a szövegblokkok pedig legyenek elég szellősek.

A héten megújult az OTP oldala. Első ránézésre jól sikerült a redesign, kellemes, esztétikus arculatot sikerült kialakítani, és látszik, hogy a funkcionalitást tekintették a legfontosabbnak. A korábbi zsúfolt szerkezet után végre szellősek, áttekinthetőek a felületek.

Az oldalt alaposabban végignézve azért már akadnak problémák, sok helyen gondban vagyok, hogy merre induljak el, ha meg akarok találni egy konkrét tartalmat, de friss még a design, nyilván egymillió dolog van, amin finomítani fognak a következő hetekben.

Ami viszont egyértelműen szemet szúr, az a fejléc teljesen zavaros kialakítása. Egy termékkategóriáig lenavigálva ugyanis a következőt látjuk:

Mintha kicsit sok lenne a réteg:

1. Kiegészítő navigáció
2. Célcsoport menü (főmenü)
3. Szekció menü (bár a főoldal link miért került vajon oda?)
4. Szekció címe
5. Szekción belüli navigáció (tabok)
6. Oldal címe

Az első három még oké, és nyilván címe is kell legyen az oldalnak, de ez az egymásra pakolgatott navigáció így botrányos. Ráadásul az 1024-es felbontásban netezőknek (tudom, egyre kevesebben vannak....) kb. a képernyő felét foglalja el ez a monstrum.

A weben a legtöbb gyakori funkcióra megvannak a jól bevált sablonmegoldások, amelyeket már csak azért is érdemes átvenni, hogy felhasználóinknak ne kelljen gondolkodnia, amikor az oldalunkat használja. Ilyen például, hogy amikor a látogató a fejlécben lát egy világító fehér input mezőt, akkor azonnal tudja (vagy legalábbis sejti), hogy az a keresés funkció. Mert megszokták: a legtöbb oldalon ott van, a mienken is ott várják el.

A másik leggyakoribb funkció a belépés. A fenti analógia szerint, ha az oldalra pillantva valahol látunk két egymás alatt lévő szövegbeviteli mezőt, jó esélyünk van, hogy az a belépés doboz lesz. Vannak azonban mindig olyan designerek, akik elég bátrak ahhoz, hogy felrúgják ezen konvenciókat, és valami újszerűt próbáljanak meg. Ez nem feltétlenül rossz, van, amikor kimondottan használható jön ki belőle, mint pl. a Bookser esetében.

A sokadik online közösségi zenelejátszó oldal, a Moof tervezője is valami hasonlóban gondolkodott. Alapvetően elég kreatív megoldást sikerült találnia, de ha kicsit is az átlagfelhasználó szemével nézzük az alábbi megoldást, a használhatósága kérdésessé válik:

Valószínűleg ez már annyira újszerű, hogy komolyan hátráltatja a funkcionalitást. Persze az is lehet, hogy aki erre az - egyébként szórakoztató célú - oldalra eljön, az külön értékeli ezt a kis jópofaságot. De azért szívesen megnéznék egy felhasználói tesztelést :)

Egy komoly probléma azonban biztosan van a belépéssel, mégpedig a hibaüzenetek megjelenítése. Ha elrontjuk a logint, arról csak egy nehezen észrevehető kis üzenetet kapunk:

Különösebb kommentár nélkül íme az űrlap, ami a Fővárosi Szabó Ervin Könyvtár honlapján jelenik meg, ha a katalógusban szeretnénk megtalálni valamit. Jó keresést! :)

A keresőmező - mint az egyik legfontosabb navigációt támogató eszköz - a legtöbb portálon hangsúlyos megjelenést kap. Általában a fejléc jobb oldalán jelenik meg, jól felismerhető módon. A felhasználók ezt megszokták, és egy új oldalon is automatikusan ott keresik ezt a funkciót.

A minap a HVG.hu-n jártam, és egy cikket kerestem volna, ha egyáltalán megtaláltam volna a keresőmezőt. Ilyenkor az a bevett szokás nálam, hogy CTRL+F, és a böngészőben rákeresek a Keresés szóra (groteszk, ugye?). Kiderült, hogy ott van az a funkció a fejlécben, csak épp nem a megszokott input mező + gomb formában. Mindössze egy link mutat rá, íme:

Rákattintottam, mire a lehető legkevésbé szerencsés módon egyszer csak megjelent az áhított keresőmező.

Most már csak azt nem értem, hogy ha ott van a helye, akkor miért nem lehet default nyitva a keresőmező? Miért várnak el egy plusz kattintást a felhasználótól (már azoktól, akik egyáltalán megtalálják a linket)? De persze erre is megvan a magyarázat: ha a Bejelentkezés linkre kattintunk, akkor a belépés doboz jelenik meg a kereső panel helyén.