Ideges lettél? Használd a carouselt, és látogatóid is azok lesznek!

Ezzel a csattanóval sokkolta egy neves amerikai akadálymentes informatikával foglalkozó szakember a webdesignereket. Mi a carousel? Jelentése: körhinta, mert a honlapon ugyanazokat a képeket vetíti egymás után. Magyar szakkifejezés híján mi is slideshownak vagy slidernek nevezzük, néha pedig diavetítésnek. A WordPresshez elképesztően sok ilyen bővítmény van, ezekkel találkoztam a legtöbbször munkám során, de sohasem állították be ezeket a WCAG szabványnak megfelelően. 

A WebAim említett szakembere készített egy kis oldalt, egy roppant számomra idegesítően gyors carousellel, ami azért mégsem gyorsabb az Apple cég honlapján használt változatnál. A kis oldalon 10 dia fut körbe-körbe. Ezeken a carousel ellen szóló marketing és UX szakemberek ellenérvei szerepelnek: MIért kellene diavetítést hasznánom?

Szükséges-e a carousel?

A szakember által készített demonstráció szövege magyarul az alábbi:

• Nem! Komolyan nem.
• Miért nem? Engedd meg, hogy elmondjam.
• Az emberek 1 százaléka kattint rá. 89 százalékuk a legelső képre. (Erik Runyon a Notre Dome egyetem marketing szakának vezetője)
• 1 százalék kattint a kezdőlap leglényegesebb képére A felhasználó nem teljesítette a célt (Nielsen Norman Group)
• Sokat teszteltük a mozgó képek hatékonyságát, és megállapítottuk: igencsak rossz módszer a tartalom kiemelésére (Wider Funnel, marketing cég).
• Szinte kivétel nélkül minden tesztünk azt bizonyítja, hogy nem éri el a célt. Nagyon kevesen kattintanak rá. (Adam Fellowes, Experience Architect)
• A carussel abban hatékony, hogy az emberek megtudják, mi a főnök elképzelése a weboldalról. Tedd ki a kezdőlapra, és a felhasználók nem fogják használni. Vagy ha úgy gondolod, soha ne használd. (Lee Dudde, What Users Do).
• A carousel olyan akadálymentességi problémákat okoz, amelyet nem lehet megoldani. carousel korunk értéktelen csillogása. (Jared Smith, a honlap készítője, WebAim vezetője),
• Ideges lettél? Használd a carouselt és a látogatóid is azok lesznek!

Szakmai értékelés

Ez utóbbi csattanó nagyon hatásos, és abban az esetben igaz, ha valaki éppen betűzi a dián lévő szöveget vagy tanulmányozza a képet. Ne felejtsük el, hogy nem egyenlő a felhasználók olvasási sebessége. Melyik felhasználói csoportoknak okoz gondot a caroussel?

• gyerekeknek
• legtöbb idősnek
• a diszlexiásoknak
• A gyengénlátóknak
• A funkcionális analfabétáknak
• A figyelemzavarosoknak
A weboldal tulajdonosok erre szinte mindig azt felelik, hogy ők nem tartoznak a honlap célcsoportba. A képen látható carousselt pedig a Magyar Posta honlapjáról másoltam ki. Remélem, hamarosan belátják ennek az érvelésnek a visszásságát.
Semmilyen kutatás nem igazolja, hogy a carousel beváltaná a hozzá fűzött reményeket. Néhány sokak által majmolt honlap használja, ezért divatos lett. Ha nem akadálymentesen valósítják meg, akkor sok ember számára diszkriminációt jelent.

A problémát azok a carouselek jelentik, amelyek nem szabványos HTML elemeket használnak vagy pedig a JavaScript oly módon ír a HTML kódba, hogy a képernyőolvasókat megzavarja. Azonban az esetek többségében ilyennel találkozunk. Ahogy a Kiemelt képen is láthatjuk a Posta honlapján.

Engem személy szerint nagyon zavar, ha a kép és a szöveg automatikusan továbbmegy, miközben olvasom. Valóban, ahogy állítják a marketing cégek, én soha nem kattintottam mozgó képre. Egyet kell értenem az amerikai szakemberrel, hogy vannak más webdesign technikák, amelyek ennél sokkal hatásosabbak és könnyebb a felhasználóknak használni. Nem véletlen, hogy nagyon sok vérprofi cég honlapján egyáltalán nincs carousel.

Mégsem értek egyet azzal, hogy a diavetítésnek nincs jogosultsága. A weboldal tulajdonosoknak ne kelljen lemondani az általuk kedvelt diavetítésről. Ha azonban nem akarják, hogy a weboldaluk diszkriminatív legyen, akkor helyezzenek el rajta megállj, újraindít gombokat. Az akadálymentes diavetítés egyik megoldása megtalálható a W3C oldalán: Carousel (diavetítés)

Diavítetés helyett

Az elmúlt évtizedben a diavetítésnek az alábbi hátrányait támasztották alá:

• Nagy sávszélességet használ, lassú a honlap betöltése
• Nem kattintanak rá, nem éri el a kívánt hatást
• A felhasználók nehezen találják meg bennük az őket érdeklő tartalmakat
• Rosszabb a konverziós aránya
• Egyeseket kizár, diszkriminatív
• Keresőoptimalizálás szempontjából nem mindig megfelelő

A sliderek egyik nagy hátránya, hogy az emberek nem tudják áttekinteni. Ha valaki az utolsó slider-re lenne kíváncsi már nincs türelme kivárni. Ha a képeket a fejlécbe helyezzük el, egy pillantással fel lehet mérni a főbb tartalmi elemeket. A korszerű megoldások lényege tehát az, hogy azokat a képeket és címsorokat, melyeket a sliderek időzítve mutattak egyszerre mutatjuk.

Hálóra rendezés, azaz grid

Intelligens webdesign

Különböző felhasználóknak különböző fejléc. A rendelkezésekre álló adatok alapján más és más fejlécet jelenítünk meg. Ennek több megoldását is ismerjük:

• Az oldal megnyitásakor véletlenszerűen mutat egy fejlécképet és hívószöveget több lehetőség körül.
• A felhasználó helyadatai alapján jeleníti meg a fejlécet. Ez a leggegyszerűbb megoldás.
• Az oldal megnyitásakor mindig új diát mutat, de a sorrendjét előre meghatározzuk.
• A felhasználó analitikus adatai alapján dönt a fejlécképről. A megjelenítés logikája webáruházak esetén általában az upselling és cross-selling. Így mindenki azt látja a fejlécben, ami számára a fontosabb lehet.

2015-ben megjelent cikk felújított változata.