Istuntotallenteet mobiilikokemuksen ja responsiivisen suunnittelun parantamiseen

Opi parantamaan mobiilikäytettävyyttä istuntotallenteilla. Löydä mobiilille ominaiset ongelmat napautuskohteissa, asettelussa ja navigoinnissa.

Luonnos

Mobiilikäyttäjät ovat erilaisia. He käyttävät pienempiä näyttöjä. He käyttävät sormia hiiren sijaan. Heillä on vähemmän kärsivällisyyttä kitkaan. Istuntotallenteet paljastavat mobiilille ominaiset ongelmat, jotka pöytäkonetestaus ohittaa. Lomakekenttä, joka toimii pöytäkoneella hyvin, voi olla mobiilissa mahdoton. Painike, jota on helppo napsauttaa pöytäkoneella, voi olla mobiilissa liian pieni. Asettelu, joka on selkeä pöytäkoneella, voi olla mobiilissa sekava. Pöytäkonetestaajat eivät näe näitä ongelmia. Mobiili-istuntotallenteet näkevät. Mobiilikävijä saapuu sivustollesi. Hän yrittää liikkua sivulla. Valikko on liian pieni. Hän napauttaa väärää kohtaa. Hän hämmentyy. Tallenne näyttää hänen kamppailunsa. Hän yrittää täyttää lomakkeen. Kentät ovat ahtaita. Näppäimistö peittää sivun. Hän luovuttaa. Tallenne näyttää turhautumisen. Mobiilioptimointi vaatii mobiilinäkökulmaa. Pöytäkonekehittäjät optimoivat pöytäkoneelle. Mobiilikäyttäjät tarvitsevat mobiilioptimointia. Istuntotallenteet kurovat kuilun umpeen. Ne näyttävät mobiilikäyttäjät sellaisina kuin he sivustosi todellisuudessa kokevat.

Tässä artikkelissa kerrotaan, miten istuntotallenteilla parannetaan mobiilikokemusta ja responsiivista suunnittelua.

Tunnista napautuskohteiden koko ja tarkkuusongelmat

Mobiili käyttää kosketusta. Pöytäkone käyttää hiirtä. Kosketus on epätarkempi. Painike, joka on riittävän suuri hiiren osoittimelle, on liian pieni sormelle. Istuntotallenteet paljastavat napautustarkkuuden ongelmat visuaalisesti. Mobiilikävijä yrittää napauttaa painiketta. Hän ohittaa sen. Hän yrittää uudelleen. Hän osuu väärään painikkeeseen. Tämä kamppailu ei näy mittareissa. Tallenteissa se on selvä.

Katso mobiilitallenteita. Napauttavatko kävijät tarkasti. Vai huteroivatko he usein. Napauttavatko he tarkoitettua painiketta. Vai viereistä. Napautustarkkuuden ongelmat kertovat käyttöliittymän liiallisesta tiheydestä.

Pienet painikkeet aiheuttavat napautusvirheitä. Liian monta painiketta liian lähellä toisiaan aiheuttaa sekaannusta. Kosketuskohteet tarvitsevat tilaa. Tallenne näyttää, mitkä elementit aiheuttavat napautusvaikeuksia. Tee niistä suurempia. Aseta ne kauemmas toisistaan. Mobiilikäytettävyys paranee.

Seuraa mobiiliasettelun rikkoutumista ja tekstin luettavuusongelmia

Mobiilinäytöt ovat pienempiä. Sisältö, joka mahtuu pöytäkoneelle, ei mahdu mobiiliin. Teksti pienenee. Kuvat vääristyvät. Asettelut rikkoutuvat. Istuntotallenteet näyttävät mobiiliasettelun ongelmat.

Katso mobiilitallenteita. Voiko kävijä lukea tekstin. Zoomaako hän lukeakseen. Luovuttaako hän lukemisen. Teksti, joka vaatii zoomausta, on liian pientä. Kuvat, jotka eivät skaalaudu, ovat ongelmallisia. Asettelut, jotka eivät mukaudu, ovat rikki.

Responsiivisen suunnittelun pitäisi mukauttaa asettelut näytön kokoon. Jos tallenteissa näkyy asetteluongelmia, responsiivinen suunnittelu on epäonnistunut. Korjaa asettelut mobiilille. Tee tekstistä luettavaa ilman zoomausta. Skaalaa kuvat sopivasti.

Tunnista mobiilinavigoinnin ongelmat

Mobiilinavigointi eroaa pöytäkoneen navigoinnista. Pöytäkone käyttää hover-tiloja. Mobiilissa ei voi viedä osoitinta elementin päälle. Pöytäkoneella on tilaa valikoille. Mobiilissa ei ole. Mobiilinavigoinnin on oltava erilainen. Istuntotallenteet paljastavat mobiilinavigoinnin epäonnistumiset.

Katso mobiilitallenteita. Pääseekö kävijä navigaatioon. Ymmärtääkö hän, miten liikkua. Eksyykö hän. Napsauttaako hän navigointikohteita vahingossa. Navigointiongelmat estävät sivuston tutkimisen.

Mobiilivalikot käyttävät usein hampurilaiskuvaketta. Jos kävijät eivät näe sitä tai eivät ymmärrä sitä, navigointi epäonnistuu. Mobiilivalikot peittävät usein sisältöä. Jos ne peittävät tärkeää sisältöä, kävijät turhautuvat. Tallenne näyttää mobiilinavigoinnin ongelmat. Korjaa ne mobiili edellä -suunnittelulla.

Seuraa näppäimistön ja lomakesyötön ongelmia mobiilissa

Lomakkeet ovat mobiilissa vaikeita. Näppäimistö peittää puolet näytöstä. Tekstikentät ovat pieniä. Automaattinen täyttö toimii epäjohdonmukaisesti. Istuntotallenteet näyttävät mobiililomakkeiden kitkan.

Katso mobiilitallenteita lomakkeen käytöstä. Tuleeko näppäimistö esiin ja peittääkö se lomakkeen. Näkeekö kävijä, mitä hän kirjoittaa. Kamppaileeko hän näppäimistön kanssa. Auttaako automaattinen täyttö vai hämmentääkö se. Tallenne näyttää lomakkeen käytettävyyden mobiilissa.

Mobiililomakkeet tarvitsevat erilaista suunnittelua. Vähennä lomakekenttiä. Käytä mobiiliin optimoituja syöttötyyppejä. Testaa näppäimistön käyttäytyminen. Tallenne näyttää, mikä toimii ja mikä ei.

Vertaa mobiili- ja pöytäkoneistuntoja laitekohtaisen kitkan löytämiseksi

Mobiili- ja pöytäkonekokemukset eroavat. Kitka voi näkyä mobiilissa mutta ei pöytäkoneella. Kitka voi näkyä pöytäkoneella mutta ei mobiilissa. Istuntotallenteiden vertailu näyttää laitekohtaiset ongelmat.

Katso mobiililuovutuksen tallenne. Katso sitten vastaava pöytäkonetallenne. Näkyvätkö samat ongelmat. Vai ovatko ne erilaisia. Laitekohtainen kitka vaatii laitekohtaisia korjauksia.

Jotkin ongelmat ovat yleisiä. Epäselvät arvolupaukset. Sekava navigointi. Nämä näkyvät molemmilla laitteilla. Jotkin ongelmat ovat laitekohtaisia. Kosketuskohteen koko. Näppäimistön peittävyys. Nämä näkyvät vain mobiilissa. Selvitä, mikä ongelma on mitäkin. Korjaa molemmat tyypit asianmukaisesti.

Usein kysytyt kysymykset

Mikä on mobiili-istuntotallenteiden perusteella suositeltu vähimmäiskoko kosketuskohteelle?

Katso mobiilitallenteita. Jos kävijät napauttavat tarkasti, kohteen koko on kunnossa. Jos kävijät huteroivat usein, kohteet ovat liian pieniä. Alan vakio on vähintään 48 x 48 pikseliä. Istuntotallenteet kuitenkin näyttävät, mikä toimii juuri sinun käyttäjillesi. Joillakin käyttäjillä on isommat sormet. Joillakin vakaammat kädet. Tallennettu käyttäytyminen näyttää, minkä kokoinen kohde sopii yleisöllesi. WEMASY-sivustonrakentajalla voit ottaa tämän käyttöön suoraan verkkosivustollasi.

Pitäisikö mobiilia testata oikeilla laitteilla vai riittääkö mobiili-istuntotallenteiden data?

Käytä molempia. Istuntotallenteet näyttävät todellisten käyttäjien käyttäytymisen todellisilla laitteilla. Se on korvaamatonta. Kaikkia laitteita ei kuitenkaan voi testata. Käytä tallenteita ongelmien löytämiseen. Käytä laitetestausta tiettyjen laitteiden käyttäytymisen ymmärtämiseen. Tallenteet vastaavat kysymykseen, mikä on rikki. Laitetestaus vastaa kysymykseen, miksi se on rikki juuri kyseisellä laitteella.

Mistä tiedän, johtuvatko mobiilin suorituskykyongelmat suunnittelusta vai verkon nopeudesta?

Katso tallenteita. Jos elementit latautuvat hitaasti, syy voi olla verkossa. Jos elementit ovat näkyvissä mutta aiheuttavat silti ongelmia, syy on suunnittelussa. Tallenna sekä nopeita että hitaita mobiiliyhteyksiä. Katso, säilyvätkö suunnitteluongelmat. Verkko-ongelmat näkyvät vain hitailla yhteyksillä. Suunnitteluongelmat näkyvät kaikkialla.

Mitä mobiililaitteita kannattaa priorisoida tallenteita katsoessa?

Tarkista analytiikka. Mitkä laitteet tuovat eniten liikennettä. Katso ensin näiden laitteiden tallenteet. Katso sitten harvinaisemmat laitteet. Älä kuitenkaan laiminlyö niitä. Laitteella, jolla on vähän liikennettä, voi olla korkea luovutusprosentti. Priorisoi vaikutuksen mukaan. Paljon liikennettä ja korkea luovutusprosentti on kriittinen yhdistelmä. Vähän liikennettä ja mikä tahansa luovutus voi silti vaatia korjausta.

Voivatko istuntotallenteet auttaa valitsemaan responsiivisen suunnittelun ja mobiilisovelluksen välillä?

Osittain. Tallenteet näyttävät, toimiiko mobiiliverkkokokemuksesi. Jos mobiilitallenteissa näkyy paljon kitkaa ja heikko konversio, mobiilisovellus voi auttaa. Sovelluksillakin on oma kitkansa. Tallenne ei voi ennustaa sovelluksen menestystä. Käytä tallenteita mobiiliverkon ongelmien ymmärtämiseen. Tee mobiiliverkosta niin hyvä kuin mahdollista. Harkitse sovellusta, jos mobiiliverkko silti alisuoriutuu.

Miten optimoin eri näyttökokoisille mobiililaitteille, kun minulla on tallenteita vain suosituilta laitteilta?

Responsiivisen suunnittelun pitäisi toimia kaikilla kooilla. Testaa useilla näyttökooilla kehityksen aikana. Käytä tallenteita kitkan löytämiseen. Optimoi tallenteiden perusteella. Testaa sitten korjauksesi muilla kooilla. Responsiivinen suunnittelu tarkoittaa yhtä sivustoa, joka toimii kaikilla koilla. Tallenteet näyttävät, mitä pitää korjata. Testikattavuus varmistaa, että korjaus toimii myös kooilla, joita et ole tallentanut.

Ota se heti käyttöön
omalla verkkosivullasi.

Aloita ilmaiseksi WEMASYlla ja rakenna sivusi muutamassa minuutissa.