Mobile-first-myynti: miksi 70 % liikenteestäsi ratkaisee ja miten voitat sen

Avaa tuotesivusi puhelimellasi juuri nyt. Ei läppärillä. Oikealla puhelimella, kädessäsi, peukalolla scrollaten.

Mitä näet?

Jos teksti on pientä, nappia on vaikea painaa tai sivun lataus kestää yli kolme sekuntia, menetät merkittävän osan mahdollisista ostajista jo ennen kuin he ehtivät lukea tuotekuvaustasi.

Noin 70 % verkkokauppaliikenteestä tulee nykyään mobiililaitteista. Mobiilin konversioaste on useimmilla pienmyyjien sivuilla suunnilleen puolet desktopin tasosta. Ero ei johdu siitä, että mobiiliostajat haluaisivat vähemmän. Se johtuu siitä, että useimmat tuotesivut suunnitellaan desktopilla eikä niitä koskaan kunnolla testata puhelimella.

Miksi mobiiliostajat käyttäytyvät eri tavalla

Desktopilla selailu on kärsivällisempää. Tietokoneella, pöydän ääressä istuva ihminen on eri mielentilassa kuin puhelimella liikkuva ihminen, joka on matkalla, jonossa tai tekee jotain muuta samalla.

Mobiiliostajat päättävät nopeammin. He scrollaavat nopeammin. He poistuvat nopeammin. Jos jokin tuntuu väärältä ensimmäisten sekuntien aikana, he sulkevat välilehden. He eivät zoomaa lukeakseen pientä tekstiä. He eivät scrollaa sivusuunnassa nähdäkseen napin, joka leikkautui. He vain lähtevät.

Tässä käyttäytymiseroja käytännössä:

Käytännön tulkinta on tämä: mobiilisivusi tarvitsee nopeamman koukun, suuremmat painallusalueet ja alle kolmen sekunnin latausajan. Nämä eivät ole nice-to-have-asioita.

3 sekunnin sääntö

53 % mobiilikävijöistä poistuu sivulta, jos lataus kestää yli 3 sekuntia. Luku tulee Googlen omasta tutkimuksesta, ja se on pysynyt relevanttina vuosia.

Kolme sekuntia tuntuu oikeassa elämässä nopealta. Mobiilissa se on ikuisuus.

Sivua hidastavat yleensä:

• Suuret pakkaamattomat kuvat, yleisin syy
• Liian monet seurantaskriptit, jotka latautuvat ennen sisältöä
• Ulkoisista lähteistä ladattavat fontit ilman fallbackia
• Autoplay-videot

Kuvat ovat tavallisesti suurin syyllinen. Kamerasta täydessä resoluutiossa viety tuotekuva on usein 4-8 MB. Verkkoon oikein pakattu versio on 150-300 KB. Sama visuaalinen laatu puhelimen näytöllä. Täysin eri latausaika.

Viktor pyöritti sivua, jolla hän myi custom-tarroja. Mobiililiikenne oli 74 % kaikista kävijöistä. Konversio mobiilissa: 1.1 %. Desktopilla: 3.8 %. Hän ajoi sivunsa Google PageSpeed Insightsin läpi ja huomasi kolme yli 3 MB kuvaa. Hän pakkasi ne uudelleen. Mobiilin latausaika putosi 6.2 sekunnista 2.4 sekuntiin. Mobiilin konversio nousi seuraavien kolmen viikon aikana 3.1 prosenttiin.

Matematiikka tästä: jos Viktorilla oli 500 mobiilikävijää kuussa ja hän konvertoi nyt 3.1 % eikä 1.1 %, se tarkoittaa 10 lisämyyntiä kuukaudessa yhdestä tunnin mittaisesta korjauksesta.

Mikä oikeasti hajoaa mobiilissa

Nopeuden lisäksi on tiettyjä layout-ongelmia, jotka näkyvät lähes vain mobiilissa ja joita useimmat myyjät eivät koskaan huomaa, koska he testaavat kannettavalla.

Teksti on liian pientä luettavaksi ilman zoomia

Alle 16 px fonttikoko mobiilissa vaatii zoomaamista. Useimmat käyttäjät eivät zoomaa. He poistuvat. Leipätekstin pitäisi olla vähintään 16 px. Väliotsikoiden selvästi suurempia. Jos et ole varma, pidä puhelinta normaalilla etäisyydellä ja lue kappale. Jos siristelet, se on liian pieni.

Napit ovat liian pieniä peukalolle

Applen Human Interface Guidelines suosittelee vähintään 44×44 pisteen painallusaluetta. Google suosittelee 48×48dp. Käytännössä: "Osta nyt" -napin pitäisi olla tarpeeksi suuri, jotta sitä voi painaa peukalolla katsomatta tarkasti. Jos se on lähellä muita linkkejä tai tekstiä, myös sen ympärillä oleva tila merkitsee. Väärään elementtiin osuvat tapit turhauttavat. Ostajat eivät anna toista mahdollisuutta.

Vaakasuuntainen scrollaus

Jos mikä tahansa sivun elementti on näyttöä leveämpi, mobiiliselain luo vaakasuuntaisen scrollin. Ostajat eivät käytännössä koskaan scrollaa sivusuunnassa tuotesivulla. Se mikä leikkautuu, ei heille ole olemassa. Taulukot, leveät kuvat ja koodiblokit ovat tavallisimmat syyt.

Checkout-kitka mobiilissa

Kirjoittaminen puhelimen näppäimistöllä on hitaampaa ja virhealttiimpaa kuin desktopilla. Jokainen ylimääräinen kenttä checkoutissa on kohta, jossa mobiiliostaja voi luovuttaa. Mitä vähemmän pyydät, sitä parempi. Jos checkout pakottaa kirjoittamaan koko osoitteen digituotteesta, menetät ostajia.

Miten testaat mobiilisivusi, vie 10 minuuttia

Et tarvitse työkaluja tai kehittäjää tehdäksesi perustason mobiiliauditin. Tässä käytännöllinen prosessi:

1. Avaa sivu oikealla puhelimellasi, ei selaimen resize-tilassa
2. Ota aikaa. Kuinka kauan täysin latautuminen kestää?
3. Lue ensimmäinen kappale normaalilta katseluetäisyydeltä. Onko se mukava lukea?
4. Yritä painaa ostonappia peukalolla. Osuuko se oikein ensimmäisellä kerralla?
5. Scrollaa koko sivu läpi. Leikkautuuko jokin tai vaatiiko jokin vaakascrollia?
6. Mene osoitteeseen pagespeed.web.dev ja liitä URL. Katso mobiilipisteet.
7. Katso PageSpeed-raportin "Opportunities"-osio. Kuvien pakkaus on lähes aina kärjessä.

Siinä kaikki. Jos kaikki näyttää hyvältä tämän läpikäynnin jälkeen, mobiilikokemus on luultavasti kunnossa. Jos löydät ongelmia, pelkkä kuvien pakkaus kannattaa tehdä heti.

Mitä mobiiliaudit paljasti kolmella myyjällä

NanoCart-sivut ja mobiili

Jos käytät alustaa, jota ei ole rakennettu mobiili etusijalla, nämä ongelmat ovat rakenteellisia ja vaikeampia korjata ilman kehittäjän apua.

NanoCart-tuotesivut ovat oletuksena mobiiliresponsiivisia. Layout, fonttikoot, nappien koot ja checkout-flow on rakennettu peukalonavigaatiolle. Jos haluat nähdä, miten fokusoitu yhden tuotteen sivu toimii paremmin kuin täysi kauppa, mobiili on iso osa syytä: vähemmän elementtejä, nopeampi lataus, puhtaammat painallusalueet.

Yksi asia jää hallintaasi riippumatta alustasta: kuvien koko. Pakkaa tuotekuvasi ennen lataamista. Squooshin kaltaiset työkalut, ilmainen selainpohjainen palvelu, vievät 4 MB kuvan 200 KB:iin noin 30 sekunnissa. Tuo yksi tapa on arvokkaampi kuin useimmat muut optimoinnit yhteensä.

Mobiili ei ole sivukanava. Useimmille pienmyyjille se on tällä hetkellä pääkanava. Ostajasi ovat puhelimella. Rakenna heitä varten.