Flash… háá ááá…
Emlékszik valaki még a flash-intrós weboldalakra? Csilli-villi animációk, hipnotikusan kavargó színek, formák, miközben a számítógép ventillátorai felpörögtek. Egyszer talán végig néztük, aztán többet nem. Bosszantóan lelassították a weboldal betöltődését. A 2000-es évektől alaposan megváltoztak a dolgok. Most éppen a minimalizmus korát éljük.
Egy szörnyű flash-es oldal.
De nem holmi kortárs l’art pour l’art vizuális késztetés miatt, hanem mert az okostelefonok lettek a dominánsak. A webdizájn egészen a közelmúltig úgy zajlott, hogy vették az asztali számítógépek jellemző monitorméreteit, és a dizájnerek elkészítették azokra szélesvásznú kényelmes látványterveiket. Majd, ha az ügyfél is úgy akarta, akkor esetleg készült egy lebutított mobilos változat is. Ha nem, hát istenem. Nem dőlt össze a világ. Akkoriban sokan csak nevettek olyan hóbortos elképzeléseken, hogy rövidesen telefonunkon fogunk netezni, és a kommunikáció jó része átkerülhet egy zsebkütyübe. Ha mégis készült tabletes és mobilos verzió a monitorokra megálmodott terveink többnyire zsúfoltak, kaotikusak lettek, kompromisszumok nélkül sehogyan sem férhettek el egy telefon kijelzőjén.
1. Mobile first
2017-re ez végleg megfordult: először a mobilos-tabletes megjelenésnek kell elkészülnie, hiszen ma már többen nézik ekkora méretekben, mint desktopon. Végleg nyugdíjba vonult a flash. A Google korábban sem indexelte az ilyen oldalakat, az IOS is diszkvalifikálta ezt a rendkívül erőforrásigényes, az öncélú látványon túl nem sok mindenre alkalmas formátumot (na jó, animációkhoz jó lehet, és sok flash-alapú játékot is kedvelünk). A Google pedig átállt a mobilbarát algoritmusra. Így SEO szempontból is gyakorlatilag kötelező a mobil webdizájn, de csak akkor, ha valaki jó helyezést szeretne a keresőben.
Modern flat design.
2. Flash, RIP!
A trendváltáshoz persze megfelelő technológia is kellett. 2004-ben mutatták be az első weboldalt, amely automatikusan alkalmazkodott a kijelző méretéhez. Olyan kifejezések születtek, mint “rugalmas”, “flexibilis”, “elasztikus” webdizájn. És még 10 éve sincs, hogy bemutatkoztak az ezt könnyedén, bárki számára lehetővé tevő CSS3 media queryk. Új szabályok léptek életbe, amelyek mindenféle kijelző mérethez optimalizálják a tartalmat. A honlap elemeinek mérete, helyzete már nem fixen, hanem százalékosan, relatíve vannak meghatározva. A flexibilis képeket ugyanilyen elv mentén, a befoglaló elemekhez képest, százalékosan határozhatjuk meg.
3. Ismételgessük: reszponzív webdizájn, reszponzív webdizájn…
A szó 2010-ben született, és röviden annyit jelent, hogy egy reszponzív elv alapján tervezett oldal felépítése és tartalma (képekkel együtt) tökéletesen és rugalmasan igazodik a megjelenítő eszközhöz. A cél, hogy a legkülönfélébb eszközökön, az asztali számítógép monitorjától a tableteken át egészen a mobiltelefonokig az optimális legyen a megjelenés, könnyű az olvashatóság, egyszerű a navigáció. Mindez a lehető legkevesebb átméretezéssel és görgetéssel. Ahhoz képest, mennyire kézenfekvő ez az elvárás, a neten ma még csak körülbelül minden nyolcadik oldal alkalmaz reszponzív dizájnt. De a trend megállíthatatlan.
Az új irány jelentősen leegyszerűsítette a látványterveket. Reneszánszát éli a flat-dizájn, vagy más néven minimalista dizájn, ami kevés, ám hangsúlyos, homogén felületeket jelent, lehetőleg mindenféle felesleges ciráda nélkül. Ennek modern, kicsit tovább fejlesztett változatát a Google prezentálta elsőként. Material-dizájnak is nevezett látvány némileg feldobja az egyszínű felületeket, és színátmenetekkel, fedésekkel, hangsúlyos árnyékokkal oldja minimál-milliőt. Ilyet először 2013-ban láttam, a Google referencia telefonon (Nexus5) bemutatkozó aktuális Androidon. A nyitóképernyő akkor még szokatlannak és újnak tűnt. Ma már egyértelműen a mainstream részévé vált. A faék egyszerűségű minimalista felhasználói felületek feltűnő színt kaptak, a betűtípusok kifinomultak, a képek pedig nagy felbontásúak.
4. Türelem: az nincs
A cél mindenek felett egy gyorsan betöltődő és működő, és mobilon is kényelmesen használható weboldal. Azt azért még ma sem lehet feledni, hogy hiába parádés a hardverek fejlődése, egy új telefon erőforrása azért még mindig nem éri el egy új asztali számítógépét. Na és a mobilinternet sem versenyezhet a 100 megabites vezetékes internet eléréssel. A mobileszközöket használók mindegyike türelmetlen. Gondoljunk bele, mit teszünk, ha nem jön be egy tartalom három pillanat alatt. Ha csak nem életbevágó, már ott sem vagyunk. Hozzászoktunk, hogy mindent azonnal és fogyasztható formában megkapunk. Felmérések szerint a júzerek háromnegyede nem vár öt másodpercnél tovább egy weboldalra.
5. Minden a tartalom
A gyorsaság kedvéért azonban nem érdemes leszedegetni nagyobb méretű tartalmakat, csak azért, hogy gyorsabb legyen a mobil megjelenítés. Inkább adjunk lejjebb a dizájnból, dobjuk el a felesleges díszeket és látvány elemeket, és használjunk tartalom alapú navigációt és hosszú görgetést. Nem véletlenül terjedt el a flat/material-dizájn, egymásra rakott spártai felületekkel (kártya alapú dizájn) rengeteg tartalmat lehet barátságosan megmutatni kis kijelzőn is. A navigációs elemeket nyugodtan hozzáköthetjük a tartalomhoz, nem feltétlenül kell külön helyet szorítani nekik. Ezzel sok zavaró tényezőt eltávolíthatunk és a figyelmet a lényegre irányíthatjuk. Mert nem lehet elégszer hangsúlyozni: a lényeg a tartalommal megfogni a látogatót, ami jó esetben konverzióhoz vezet, és még jobb esetben későbbi visszatéréshez is.
6. Ezért még görgetni is hajlandóak lettünk
Mára megváltozott a görgetéshez való viszony is. Monitor előtt ülve valamiért nem szeretünk hosszan görgetni, ellenben mobil eszközökön nagyobb erre a hajlandóságunk. Talán elfogadjuk, hogy féltenyérnyi helyen nem kaphatjuk meg az információt, amit szeretnénk, ezért beletörődtünk a hosszas görgetésbe. És szeretjük azt is, hogy nem kell annyit kattintanunk, és várnunk. A vízszintes görgetés természetesen továbbra is tabu, persze csak akkor, ha sok látogatót szeretnénk.
7. Az egyedi mindig trend marad
Mindebből az következhetne, hogy unalmas, egysíkú és uniformizáltabb lett a net, de látjuk, hogy ez nem igaz. Az eredetiség mindig is trend lesz. A mai webdizájn rugalmasabb, mint eddig bármikor. A fantáziának semmi sem szab határt. A képek attól függően látványosan lehetnek, hogy minden kijelző méretre optimálisan jelennek meg. Ehhez azonban lassan elhagyhatjuk a sablonos stock fotókat. Mindenki azonnal felismeri a túlságosan szép, idealizált, semlegesen tökéletes képeket. Használjunk akár esetlenebb, de élettelibb, eredetibb fotókat. Vagy akár rajzoljunk grafikát, illusztrációt. Biztosan lehetünk abban, hogy megragadjuk a figyelmet. Az egyedi látásmódra sokan felkapják a fejüket. Ráadásul jól oldják a homogén digitális látványvilágot. A lényeg, hogy a kép nagyfelbontású legyen, mert lehet hogy monitoron is sokan megnézik. Egy jól elkészített reszponzív oldal esetében nyugodtak lehetünk, hogy tableten és mobilon is optimálisan jelenik meg.
Tetszett a cikk? Kövess minket!