A carousel divatos, de akadálymentes?

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 számomra idegesítően gyors carousellel. A kis oldalon 10 dia fut körbe-körbe. Ezeken a carousel ellen szóló marketing és UX szakemberek ellenérvei szerepelnek:

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 Dame 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 konverziós 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 carousel 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 a 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!

A honlap 10. diája: Ideges lettél? Használd a caruselt é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. Mely csoportoknak okoz gondot a diavetítés?

  • a gyerekeknek
  • a legtöbb idősnek
  • a diszlexiásoknak
  • a gyengénlátóknak
  • a funkcionális analfabétáknak
  • a figyelemzavarral élőknek
    • automatikusan indul
    • hosszabb ideig tart, mint három másodperc
    • más tartalommal párhuzamosan jelenik meg

10 éves szakmai múltam alatt sok fogyatékossággal élő felhasználót láttam már böngészni. A képernyőolvasók számára a diavetítés sokszor lehetetlenné teszi a böngészést, mert minden egyes diaváltáskor megakad. Az emberek egy részének lehetetlen feladat, hogy a megadott idő alatt elolvassák és esetleg kattinthatják.

A billentyűzetet vagy kapcsolókat használók pedig garantáltan legyőzhetetlen feladat elé állítja az, hogy rákattintsanak egy linkre, amely csak néhány másodpercig látható.

Egyeseket meg valóban idegesít, hogy akaratán kívül elugrik a szemük elől a látvány. A legnagyobb probléma az, hogy annyira sokkoló tud egyeseknek lenni, hogy egyszerűen feketelistára teszik az ilyen honlapokat, többé nem mennek rá.

Az alapvető akadálymentességi elvárás, hogy egy akadálymentes (azaz fókuszálható) megállj és újraindító gombot teszünk jól látható helyre, lehetőleg egymás mellé (és nem a két szélére). Azonban rendkívül széles a paletta a carousel helyettesítésére.

Slideshow helyett

Az elmúlt évtizedben az alábbi hátrányokat fedezték fel:

  • 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, inkább egy időben mutatjuk.

Hálóra rendezés, azaz grid

Egy honlap fejléce: négyzethálós elrendezéssel

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özül.
  • A felhasználó helyadatai alapján jeleníti meg a fejlécet. Ez a legegyszerű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.