Prisitaikančio dizaino svarba kuriant svetainę
2010 metais įvyko esminis pokytis – daugiau žmonių pradėjo naršyti internete naudodamiesi mobiliaisiais įrenginiais nei stacionariais kompiuteriais. Tai pakeitė ir svetainių kūrimo praktiką. Kūrėjai turėjo rinktis: kurti kelias skirtingas svetainės versijas skirtingiems ekranų dydžiams arba investuoti į vieną universalų sprendimą – prisitaikantį dizainą (angl. responsive design), kuris automatiškai prisitaiko prie įrenginio ekrano.
Vietoje to, kad kiekvienam ekranui būtų kuriamas atskiras išdėstymas pikselių tikslumu, prisitaikantis dizainas leidžia turiniui elgtis tarsi „skysčiui“ – užpildyti visą prieinamą erdvę ir patogiai persidėlioti pagal ekrano dydį.
Kodėl prisitaikantis dizainas būtinas?
Kurdami internetinį puslapį, norime pasiekti kuo platesnę auditoriją, todėl svetainė turi atrodyti patraukliai ir veikti patogiai bet kuriame įrenginyje. Net jei puslapis vizualiai gražus, bet telefone ar planšetėje tampa sunkiai naudojamas (pvz., reikia slinkti horizontaliai, elementai persidengia), lankytojas greitai išeis ir gali nebegrįžti.
Be to, prisitaikantis dizainas turi būti pritaikytas ne tik išmaniesiems telefonams ir planšetėms, bet ir žaidimų konsolėms, skirtingų dydžių nešiojamiesiems kompiuteriams bei monitoriams. Pavyzdžiui:
- telefone turinys gali būti pateiktas viename stulpelyje,
- planšetėje – dviejuose,
- kompiuteryje – keliuose stulpeliuose.
Svarbu užtikrinti patogų naudojimą tiek su pele, tiek su lietimui jautriu ekranu.
Trys pagrindiniai prisitaikančio dizaino principai
- Fluid Grid System – elementai puslapyje užima tą patį procentą ekrano pločio, nepriklausomai nuo jo dydžio.
- Fluid Image Use – paveikslėliai turi proporcingai prisitaikyti prie ekrano pločio naudojant CSS (pvz.: img {max-width: 100%;}).
- Media Queries – specialūs nustatymai, leidžiantys dizainą pritaikyti pagal aptiktus įrenginio matmenis.
Patarimai kuriant prisitaikantį dizainą
- Pradėkite nuo mobiliosios versijos kūrimo („mobile first“ metodas).
- Testuokite dizainą bent trijuose skirtinguose įrenginiuose.
- Minimalizmas – jūsų draugas. Kuo paprastesnė struktūra, tuo geresnė patirtis.
- Pirmiausia iškelkite svarbiausią turinį ir veiksmų mygtukus.
- Naudokite kontrastus – aiškus šriftas, dydžių skirtumai ir spalvų ryškumas padeda atkreipti dėmesį.
Išvada
Prisitaikantis dizainas nėra papildoma opcija – tai būtinybė, jei norite, kad jūsų svetainė būtų patogi ir efektyvi visiems lankytojams. Tokia svetainė ne tik pagerina vartotojo patirtį, bet ir prisideda prie geresnių „Google“ reitingų, nes paieškos sistemos prioritetą teikia mobiliesiems pritaikytiems puslapiams.
Dalintis:
