inovatyvūs internetiniai sprendimai

Blogas

Svetainių pritaikymas mobiliesiems įrenginiams


Responsive dizainas

Svetainės pritaikymas mobiliesiems įrenginiams nėra savybė, turinti tik dvi reikšmes - pritaikyta arba ne. Yra daug techninių sprendimų ir priemonių, kurios palengvina naudojimąsi svetaine mobiliaisiais įrenginiais. Kuo daugiau iš jų bus įgyvendinta, tuo svetainė bus patogesnė ir mobiliųjų lankytojų statistika - geresnė.

Responsive dizainas

Responsive dizainas (prisitaikantis prie ekrano dydžio) jau tapo standartu šiuolaikinėse svetainėse, ši sąvoka netgi vartojama kaip pritaikymo mobiliesiems įrenginiams sinonimas. Tačiau tai tik pirmas iš daugelio žingsnių, kad svetainė būtų tikrai patogi mobiliesiems lankytojams.

Pasitikrinti, ar jūsų svetainė turi prisitaikantį prie ekrano dydžio dizainą, galima naudojantis Google Mobile Friendly testu. Tačiau jis patikrina tik pačius pagrindinius dalykus - ar svetainės turinys sutelpa į ekraną, ar įskaitomi šriftai, ar mygtukai pakankamo dydžio. Daugelio niuansų, nulemiančių svetainės patogumą lankytojui, automatizuoti testai patikrinti negali.

Kuriant responsive dizainą, yra piešiami keli dizaino variantai - desktopiniam kompiuteriui, planšetei, mobiliajam telefonui. O svetainė, priklausomai nuo ekrano dydžio, persijungia į vieną iš jų. Tačiau tiek kompiuteriai, tiek mobilieji telefonai pasižymi labai didele ekranų dydžių ir rezoliucijų įvairove. Didžioji dalis mobiliųjų telefonų turi 360px ar 375px rezoliucijos naršykles, tačiau nemažą dalį srauto sudaro ir senesni įrenginiai su 320px rezoliucija, o naujausi telefonai, kurių vis daugėja, jau turi 414px rezoliuciją. Desktopinių lankytojų ekranų dydžių amplitudė - nuo 1024px rezoliucijos nešiojamų kompiuterių iki 1920px FullHD monitorių. Norint pritaikyti svetainę visiems šiems ekranų dydžiams, reikia daryti nebe tris, o keturis, penkis ar dar daugiau dizainų variantų.

Nemažai svetainių stengiasi sutaupyti ir išsivesti su kuo mažiau dizaino variantų, netgi nedaro atskiro dizaino planšetėms, o iš desktopinės iš karto persijungia į mobiliems telefonams skirtą versiją. Tačiau tokiu atveju tekstų bei grafinių elementų dydžiai ir išsidėstymas nebūna optimalūs kiekvienai rezoliucijai ir svetainės naudojimosi patogumas kenčia. Dėl to, nors svetainė formaliai atitinka mobile friendly reikalavimus, statistiniai mobilių lankytojų rodikliai būna prastesni.

Svetainės greitaveika

Greitaveika yra vienas svarbiausių veiksnių, nulemiančių svetainės naudojimosi patogumą, o mobiliesiems įrenginiams jis dar aktualesnis. Su mobiliaisiais įrenginiais svetainės visada veikia lėčiau, todėl prastai optimizuota svetainė gali pasidaryti tokia lėta, kad ja bus praktiškai neįmanoma naudotis, nepaisant to, kad ji turės responsive dizainą.

Google jau senai tai akcentuoja ir PageSpeed Insights įrankyje rodo du atskirus greitaveikos reitingus - kompiuteriams ir mobiliesiems įrenginiams. Ir dauguma svetainių gauna labai prastus mobiliųjų įrenginių greitaveikos įvertinimus.

Šiuolaikinės svetainės dažnai visą dėmesį skiria vizualinei pusei ir naudoja daug grafinės medžiagos - didelės raiškos nuotraukų, video filmų. O tai reiškia didelius parsisiunčiamų duomenų kiekius. Tai nėra problema kompiuteriams, naudojantiems šviesolaidinį internetą ar wi-fi ryšį, tačiau mobilieji telefonai, kurie naudoja 4G ar 3G internetą, atsiduria sudėtingoje situacijoje. Tipinis 4G ryšio greitis yra kelis kartus mažesnis, nei šviesolaidinio interneto. O 3G ryšys gali būti net šimtą kartų lėtesnis. Todėl svetainė, kuri stacionariuose kompiuteriuose užsikrauna akimirksniu, mobiliuose įrenginiuose gali krautis taip lėtai, kad lankytojas uždarys naršyklės langą net nesulaukęs, kol pasirodys vaizdas.

Be to, daugelis svetainių yra perkrautos vizualiniais efektais ir animacijomis. O tai reikalauja didelių procesoriaus pajėgumų. Naujausi įrenginiai su tuo nesunkiai susitvarko, tačiau senesni telefonai nebesugeba pakankamai greitai sugeneruoti ir parodyti svetainės vaizdo. Dėl to darbas su svetaine smarkiai sulėtėja, ir svetainė stringa kiekvieną kartą, kai ekrane pasirodo koks nors interaktyvus elementas.

Šie trūkumai dažnai lieka nepastebėti svetainės kūrimo metu, mat svetainės testuojamos su naujausiais telefonais, sėdint ofise ir jungiantis prie interneto per wi-fi ryšį, todėl viskas veikia puikiai. Ir tik realiai paleidus svetainę, išlenda greitaveikos problemos. O tada ištaisyti situaciją yra sunku, nes jos priežastys dažnai būna kompleksinės, reikalaujančios esminio visos svetainės perdarymo. Todėl dar svetainės projektavimo metu, planuojant funkcijas ir dizaino sprendimus, reikia atsižvelgti į greitaveiką, taip pat testuoti svetainę su PageSpeed Insights įrankiu, nes jis imituoja realias sąlygas tiek sulėtindamas ryšio greitį, tiek apribodamas procesoriaus pajėgumus ir parodo kokio greičio gali tikėtis tipinis lankytojas.

Navigacijos patogumas

Padaryti, kad navigacija svetainėje būtų patogi tiek naudojantis kompiuteriu, tiek mobiliuoju telefonu - gali būti nemenkas iššūkis. Ypatingai jei tai didelė ir sudėtinga svetainė. Kompiuterio ekrane labai lengva sutalpinti didelį meniu, galima naudoti submeniu, kurie išsiskleidžia užvedus pelę, galima pridėti papildomus šoninius meniu. Telefone visų šitų galimybių nebelieka. Paprastai būna tik vienas meniu, kuris išsiskleidžia paspaudus mygtuką - taip vadinamas hamburger meniu. O jis apsunkina navigacijos patogumą tiek dėl to, kad jame sutelpa gana ribotas informacijos kiekis, taip pat dėl to, kad jam esant uždarytam, lankytojas nemato aktyvaus meniu punkto.

Daugelis svetainių navigacijos patogumui skiria labai mažai dėmesio ir tiesiog mechaniškai atkartoja visą svetainės medį hamburger meniu. Tačiau tokiu atveju lankytojai ne visada suranda norimus puslapius. Paanalizavus lankytojų statistiką, matosi, kad keliai, kurie atveda prie konversijų kompiuteriuose, dažnai neveikia mobiliuosiuose įrenginiuose. Todėl norint, kad navigacija mobiliuosiuose įrenginiuose būtų efektyvi - reikia ieškoti kitų priemonių. Naudoti visada matomus tabus ar ikonėles, netgi supaprastinti visą svetainės struktūrą. Pridėti nuorodų ir mygtukų pačiame tekste, kurie lankytoją nukreiptų į norimą puslapį.

Navigacijos srityje kartais pasitaiko net labai didelių klaidų - blogai sukonstravus meniu, kai kurie puslapiai mobiliuosiuose įrenginiuose gali pasidaryti iš viso nepasiekiami. Todėl esant labai prastiems mobiliųjų lankytojų rodikliams, pirmiausia vertėtų paanalizuoti ar gerai veikia navigacija.

Svetainės turinys

Pats svetainės turinys kartais reikalauja specifinių sprendimų, kad jis būtų teisingai rodomas mobiliajame įrenginyje. Paprastas tekstas ir nuotraukos - labai lengvai sumažėja ir prisitaiko prie ekrano dydžio. Tačiau yra keletas problematiškų elementų, kuriuos sunku sutalpinti telefonų ekranuose. Vienas dažniausiai pasitaikančių pavyzdžių - lentelės. Susiaurėjus ekranui, jose tiesiog nebesutelpa norimas stulpelių skaičius, todėl tenka individualiai programuoti lenteles, kurių struktūra keičiasi priklausomai nuo ekrano pločio arba ieškoti visiškai kitokio duomenų pateikimo būdo, leidžiančio išvengti lentelių. Audio ir video medžiaga irgi gali nepasileisti mobiliajame įrenginyje. Šią problemą galima išspręsti talpinant filmukus Youtube ar kitose išorinėse platformose, bet norint viską rodyti iš savo serverio, gali prireikti sudėtingų techninių sprendimų.

Turinio problemos dažniausiai išryškėja tik paleidus projektą. Testuojant tuščią svetainę su pavyzdiniais "Lorem ipsum" tekstais, vaizdas būna nepriekaištingas, tačiau realūs duomenys, ypatingai jei juos susiveda pats užsakovas, kartais sudarko svetainės vaizdą.

Ar svetainė pritaikyta mobiliesiems įrenginiams

Geriausia indikacija, parodanti ar svetainė yra tikrai pritaikyta mobiliems įrenginiams, yra statistiniai svetainės lankytojų rodikliai - bounce rate, aplankytų puslapių skaičius, konversijos. Jei jie panašūs tiek pas desktopinius, tiek pas mobiliuosius lankytojus, tai reiškia, kad svetainė optimizuota puikiai. Tačiau jei mobiliųjų lankytojų statistiniai rodikliai žymiai prastesni - greičiausiai svetainė susiduria su aukščiau minėtomis problemomis.