Moderní trendy webových designů u nás i ve světě, které vyčnívají zejména díky své živosti a dynamičnosti jsou efekty Parallax, Peeler nebo ScrollJack. Přestože trendy ve webdesignu nerozhodují o obchodním výkonu webové stránky, jako každé jiné odvětví i webdesign podléhá módním trendům.
Možnosti dnešních technologií umožňují vývojářům vytvářet hezké a moderní webové stránky, plné efektů, což bohužel ne vždy jde ruku v ruce s tím, že takové stránky budou dobře přístupné a zejména zpětně kompatibilní s prohlížeči, které reální návštěvníci, stále používají. I přesto může být zvolní zajímavého efektu vhodným oživením webových stránek.
Prallax
Prvním ze zmíněných efektů je Parallax. Tento efekt funguje na principu posouvání obsahu (obrázku, textu apod.) na popředí, rozdílnou rychlostí, než posouvání podkladové vrstvy, která zůstává na svém místě ve vztahu ke stránce. Efekt se projevuje při scrolování webové stránky (posouvání nahoru nebo dolu). Díky tomuto efektu můžete simulovat hloubku obrazu (3D) ve dvojrozměrném zobrazení. Efekt se nejčastěji používá pro vertikální scrolování, nicméně zajímavé je i použití horizontální.
První použil Paralax efekt ve webdesignu Ian Coyle pro stránku Nike “Nike Better World” už v roce 2011.
Paralax můžete použít tam, kde chcete návštěvníkovi předat příběh a zápůsobit.
Pěkné příklady Paralax efektu můžete prohlédnout zde:
Peeler
Tento efekt není tak rozšířený. Spočívá v užití vrstev, které jsou na sobě a překrývají se. Při scrolování se pak horní vrstva odsouvá a tedy zobrazuje se vrstva pod ní. Jednoduše si Peeler můžete představit jako několik listů papíru, které položíte na sebe a odsouváte horní list, tedy zobrazuje se list pod ním.
Jak použit Peeler můžete vidět například zde:
ScrollJack
Tento efekt mění způsob procházení webových stránek, což je zajímavá myšlenka, ale těžko říci jak moc je správná. Stránky se procházejí po úsecích, které se střídají posunutím kolečka, nebo šipkami na klávesnici. Jedno posunutí kolečkem myši odsune celý úsek a zobrazí následující. Stejný efekt se spustí stisknutím šipky na klávesnici. Vzhledem k tomu, že toto chování je nestandardní, je otázka jak moc je vhodné jej používat.
Prohlídněte si zajímavé použití
- Parallax + Peeler + ScrollJack (spaceneedle.com)
- Parallax + Peeler (netlash-bseen.be)
Na co si dát pozor?
Prezentace s těmito efekty jsou obvykle realizované jako jedno-stránkový web s dlouhým obsahem a z toho důvodu nebývají dobře indexované vyhledávači. Rozhodně se tedy nehodí pro obsahové weby. Použití je vhodné tam, kde potřebujete působivým způsobem představit produkt, službu, vizualizovat příběh apod. Jedná se spíše o jedno-účelové mikrostránky, které mají potenciál být virálními.
