Animace na webu

Tentokrát něco málo o animacích na webových stránkách, které čím dál častěji vládnou světu a možná si zde odpovíte, zda je také chcete na svém webu.

Animace na webu

Při mé práci často narážím na požadavek „musí se to hýbat“ jinak to nechci. Na úvod bych měl i říct, že s tím souhlasím ale sám animace moc nemusím. Dost to zdržuje a pokud je to nevhodně zvolné, tak je to k ničemu. Návštěvníka to jen otráví. Třeba když je zpravodajský web plný animace, tak většinou lidi odchází. Tedy pokud je nezvládne dřív odradit reklama.

Osobně mám rád, když je animace využita jen v některých místech webu a třeba by i pobavila. Myslím animované grafy v internetovém bankovnictví, nebo když jsem hledat nějaké inspirace na UI Movement pro nahrávání souborů. U toho animovaného nahrávání se mi líbí i fakt, že snad úplně každý pochopí, co se právě děje. Ale to platí i třeba pro odhlášení, potvrzení formuláře, odeslání kontaktu aj.

Scroll animate

Často používané jsou animace při srolování po webu. Většinou se na při srolování dolů po obrazovce postupně objevují texty, jednotlivé sekce, obrázky apod. Případně se používají knihovny pro rychle posouvání po stránce. Takže máte button, který po kliknutí přesune úplně dolů nebo nahoru, na stránce. Pár knihoven jsem již prošel, takže zde je krátký seznam těch povedenějších.

Slider/carousel

Slider nebo kolotoč. Asi jak kdo chce. Řada lidí na ně nadává nebo je kritizuje. Odborníci se shodují, že se neshodují. Někdo na nich trvá a někdo je zásadně odmítá. A já je mám celkem rád. Když jsou pěkný fotky i nápad, jako třeba na puravidashop.cz, tak je fajn, že má text nějakou animaci a lidi se pokochají super fotkou.

Osobně tvrdím, že by neměli být animované ovládací prvky stránky. U tlačítek jen decentní animace třeba změny barvy pozadí, což se dělá v SASS celkem jednoduše a nijak to návštěvníka nezdrží. Decentní animace vytváří příjemný pocit a uživatel s webem rád pracuje. Tedy za předpokladu, že vše funguje a stránky se rychle načítají. Což u některých knihoven nebo při použití mnoha knihoven může být problém.

Samozřejmě to, co je dobré na desktop nemusí být dobré na mobilu. Pokud máte, nebo tvoříte responzivní webové stránky, je potřeba zvolit vhodné řešení. Osobně hledám řešení, které nabízí třeba právě SASS pro styly. Jelikož to mohu zakomponovat do redakčního systému, mohu to libovolně stylovat a výsledkem je jeden CSS soubor. Tak hodně štěstí při rozhýbávání webu!

https://uimovement.com/design/dashboard-navigation/

Komentáře

*
Odesláním komentáře souhlasíte s tím, že zadáváte údaje dobrovolně. Vaše jméno a e-mail souží pouze pro tyto komentáře. Nebudou nadále využity v marketingu apod. Jméno je použito pro zobrazení informace, kdo příspěvek okomentoval. E-mail pouze pro zaslání potvrzení o vložení komentáře. Nevhodné, hanlivé či až sprosté komentáře nebudou zveřejněny. A to i když budou věcné. Agresivita ve společnosti už tak neúměrně roste. Děkuji za pochopení.