Igor Gubaidulin

2012-05-30 - No Comments!

Prisitaikantis dizainas

Jei pažiūrėtume į paskutiniųjų metų tendencijas (pvz. .net magazine, Web Design Ledger, Webdesigntuts+ ir dar daug kitų) tai pastebėtume vieną besikartojantį punktą – prisitaikantis dizainas (angl. responsive design). Įsivaizduokite mano nuostabą, kai įvedžiau į Google paiešką šios žodžius ir beveik nieko neradau. Atskiri linkėjimai Frogsign, kuris bent jau paminėjo šią dizaino sritį.

Šiek tiek istorijos

Sakoma, kad terminas prisitaikantis dizainas (angl. responsive design) atsirado 2010 metais ir sparčiai paplito. Visa ko pradžia, buvo prisitaikančios architektūros (angl. responsive archicture) įkvėptas Ethan Marcotte straipsnis tarp interneto svetainių kūrėjų populiariajame tinklaraštyje A List Apart – Responsive Web Design. Iš tikrųjų, Ethan Marcotte tik pasiūlė terminą, bet nieko naujo neišrado – technologiniai sprendimai buvo jau žinomi iš anksčiau, o pati idėja buvo pasiūlyta dar 2000 m. John Allsopp legendiniame įraše A Dao of Web Design.

Prisitaikančio dizaino apibrėžimas

Jei laukėte, kad šioje dalyje pamatysi lengvą ir suprantamą apibrėžimą, tai teks jūs nuvilti – vieno bendro, dizainerių visuomenės priimto apibrėžimo nėra. Kiekvienas autorius, rašantis apie prisitaikantį dizainą, supranta jį skirtai. Šių metų pradžioje .net magazine savo Twitter paskyroje pranešė, kad naujasis Barako Obamos puslapis yra prisitaikantis. Į ką prisitaikančiojo dizaino krikštatėvis Ethan Marcotte atsakė, kad minėtas puslapis nėra prisitaikantis. Ko tikėti ir pasitikėti leisiu nuspręsti jums patiems. Kita vieningo apibrėžimo nebuvimo priežastis – painiava tarp prisitaikančio ir adaptyvaus (angl. adaptive design) dizainų. Vieni autoriai sako, kad čia tas pats, kiti, jog prisitaikantis dizainas yra adaptyvaus dizaino poaibis, treti – kad čia skirtingi dalykai. Nežinau, kas yra teisus, bet, jei mane paprašytumėte paaiškinti skirtumą, sakyčiau, kad adaptyvus dizainas yra fiksuoto išdėstymo, tačiau dinaminio blokų pločio dizainas, o prisitaikantis dizainas yra dinaminio išdėstymo ir blokų pločio dizainas.

Bendrąją prasmę, prisitaikantis dizainas – projektavimo, dizaino ir programavimo praktikos, kurių tikslas – sukurti svetainę, prisitaikančią prie naudotojo elgesio ir naudojimosi konteksto (platforma, ekrano dydis, orientacija ir t.t.).

Nesinori gilintis į detales, bet negalima nepaminėti pagrindinių prisitaikančio dizaino elementų – prisitaikantis išdėstymas, prisitaikantis turinys (dažnai, sukonkretinama tik iki paveiksliukų) ir CSS media queries.

Iššūkiai

Kaip ir kiekvienas naujas dalykas, prisitaikantis dizainas turi savo minusų. Todėl, prieš naudodami šį metodą, pamąstykite ar šis iššūkis netaps labai sudėtingu.

Paveiksliukai– didelių paveiksliukų atvaizdavimas mažuose ekranuose yra nelogiškas, o normalaus technologinio sprendimo kaip atvaizduoti ekranui tinkamo dydžio paveiksliukus dar nėra:
- Generuoti tinkamo dydžio paveiksliukus su Javascript problematiška, nes užima laiką ir užkrauna procesorių
- SVG ar kiti vektoriniai formatai dar nepalaikomi visų naršyklių ir netinka nuotraukoms
- Saugoti serveryje keletą skirtingų dydžių mažiausiai skaudus variantas, tačiau irgi reikalauja papildomų sanaudų, nes reikia pasirūpinti didesnės talpos serveriu (nors gal debesų kompiuterijos laikais tai ne taip aktualu)
- Jūsų variantas ...
Reklama – reklamos kaina priklauso nuo pozicijos, tačiau prisitaikančio dizaino atveju pozicija yra reliatyvi
Didelės lentelės – lentelės su daug duomenų yra nepatogios mažuose ekranuose. Vieninteliai man žinomi variantai kaip išspręsti šią problemėlę - mažuose ekranuose keisti lentelę grafikai ar diagramomis arba slėpti tam tikrus stulpelius.
Navigacija – meniu kitimo logika gali būti sunkiai nuspėjama, todėl gali atsirasti naudotojo patyrimo (angl. user experience) problemos.
Procesas – kūrimo procesas tampa sudėtingesnis, reikia apgalvoti, įgyvendinti ir ištestuoti dizainą daugiau nei viename naudojimosi kontekste.
Technologijos – nėra 100 proc. poreikius tenkinančių technologijų. Jos vis dar vystamos ir tobulinamos.

Kada prisitaikantis dizainas tinka?

Kuriamas visiškai naujas produktas ir nenorima investuoti į visų platformų (personaliniai, nešiojami, planšetiniai kompiuteriai, mobilieji telefonai ir t.t.);
Norima sutaupyti – kūrimo procesas kainuoja 20-30 proc. brangiau, tačiau jei klientas prašo ko platesnio visų platformų palaikymo, prisitaikantis dizainas kainuos pigiau nei kurti atskiras versijas visoms platformoms.
Norima, kad svetainė korektiškai veiktų net dar neišleistuose įrenginiuose.

Ir kada netinka?