Görgetésre induló animációk – jól és rosszul

Görgetés közben a tartalom finoman beúszik, a kártyák egymás után emelkednek fel, a számok felpörögnek. Ezek a görgetésre induló animációk a modern weboldalak egyik legismertebb eszközei. Jól használva ritmust adnak az oldalnak. Rosszul használva a látogató úgy érzi, az oldal nem enged haladni.

Mitől jó?

Egy jól időzített beúszás azt jelzi: „ez egy új gondolat”. Elválasztja a szakaszokat, és a figyelmet a frissen megjelenő tartalomra irányítja. A hatás akkor a legjobb, ha:

• rövid – a mozgás gyorsan véget ér, a tartalom néhány tized másodperc alatt a helyén van;
• kicsi – csak néhány pixelnyi elmozdulás, nem az egész képernyőn át;
• egyszeri – ha a látogató visszagörget, a tartalom már ott van, nem játssza le újra;
• lépcsőzetes, de nem lassú – egymás melletti kártyák kis késéssel érkezhetnek, de a sor gyorsan teljes legyen.

Mitől rossz?

• A tartalom láthatatlan, amíg nem ér oda a görgetés. Aki gyorsan görget, üres felületeket lát, és azt hiheti, az oldal nem töltött be.
• Görgetés-eltérítés. Az oldal átveszi az irányítást, és a saját tempójában mozog – a látogató nem tudja, mennyit kell még görgetnie.
• Minden elem mozog. Ha minden bekezdés, kép és gomb külön animációval érkezik, az oldal nyugtalanná válik.
• Hiányzó tartalom JavaScript nélkül. Ha az animációs szkript nem fut le (lassú hálózat, hiba), a tartalom rejtve maradhat.

Szabályok, amelyeket mi követünk

1. Az első képernyő nem vár. Ami betöltéskor látszik, az azonnal a helyén van – beúszni csak a képernyőn kívüli tartalom szokott.
2. A tartalom alapból látható. Az animáció csak akkor rejti el előbb az elemet, ha biztosan le is fogja játszani. Így szkript nélkül, és a keresőrobotok számára is minden látszik.
3. Mozgáscsökkentésnél nincs beúszás. Aki a rendszerében kevesebb mozgást kért, annak minden elem egyszerűen ott van. Erről a mozgáscsökkentésről szóló cikkünkben írtunk.
4. A görgetés a látogatóé. Nem gyorsítjuk, nem lassítjuk, nem állítjuk meg.

Görgetéshez kötött történetmesélés

Van egy fejlettebb forma is: amikor egy animáció a görgetés ütemében halad, mint egy film, amelyet a látogató maga pörget. Termékbemutatóknál, folyamatok magyarázatánál ez nagyon hatásos lehet. Itt különösen fontos, hogy a szöveges tartalom ne csak az animációban legyen meg, és hogy mobilon is kényelmes maradjon.

A mérték

Egy oldal akkor használja jól a görgetési animációt, ha a látogató nem gondol rá. Csak annyit érez, hogy a tartalom „szépen érkezik”, és semmi nem tartja fel. Arról, mikor segít az animáció és mikor zavar, általánosabban is írtunk.

Ha ilyen mozgást szeretne a saját oldalára, az animáció és interakció oldalon leírjuk, hogyan dolgozunk.