Pyrkimys mobiiliverkkokauppasivustojen suunnittelun optimointiin? Älä huoli, tässä on mitä sinun on tehtävä
Vuonna 2021 verkkokaupan kasvu on ollut suurelta osin mobiilin vauhdittamaa. Itse asiassa, Sisäpiirin älykkyys ennustaa m-kaupan volyymin kasvavan 488 miljardiin dollariin eli 44 prosenttiin maailmanlaajuisen sähköisen kaupankäynnin markkinoiden myynnistä vuoteen 2024 mennessä. Noin 9.2 prosenttia näistä markkinoista tulee olemaan USA:n hallussa.
Halusimme tai et, mobiiliystävällinen verkkokauppasivusto on nyt pikemminkin välttämättömyys kuin valinta. muuten vähittäiskauppiaat vain menehtyvät kuluttajien vuoksi. Monet Elogic-projektimme ovat listanneet mobiiliverkkokauppasivustojen suunnittelun yhdeksi tärkeimmistä Verkkokauppasivustojen vaatimukset, tärkeimmät syyt ovat verkkosivustojen korkeammat tulosprosentit ja lisääntynyt näkyvyys hakukoneissa.
Jos haluat hyödyntää verkkokauppasivustojen mobiilikäyttöä, mutta et ole varma mistä aloittaa, tämä artikkeli on sinua varten. Lue lisää mobiiliystävällisen, mobiilioptimoidun ja responsiivisen suunnittelun eroista, tutustu kuuteen mobiilioptimointivinkkiin ja opi testaamaan verkkokauppasivustoasi mobiililaitteille.
Miksi mobiiliystävällinen verkkokauppasivusto ei ole vain trendi?
Mobiiliystävällinen verkkokauppasivusto tarkoittaa, että käyttäjät voivat käyttää sitä vapaasti mobiililaitteella: verkkosivustosi "kutistuu" mahtumaan puhelimen pienelle näytölle, siinä ei ole käyttökelvottomia ominaisuuksia tai flash-animaatioita, kuvat ovat pienempiä ja navigointi on paljon yksinkertaisempi.
Vaikka konversioprosentti mobiililaitteilla on hieman pienempi kuin pöytäkoneella (1.81% vs. 1.98%), se ei tarkoita, että sinun pitäisi poistaa se. Verkkokauppasivuston mobiiliversio voi olla syy siihen, miksi käyttäjät siirtyvät tietokoneeseen ja konvertoivat, koska he tekivät tuotetutkimuksensa puhelimillaan. Jopa yksi kyselyistä paljasti sen 67% asiakkaista he tekevät vähemmän todennäköisesti ostoksia kyseiseltä tuotemerkiltä, jos heillä ei ole mobiililaitteille optimoitua verkkosivustoa.
Mobiiliystävällisen verkkokauppasivuston edut eivät rajoitu vain korkeampiin tulosprosentteihin:
- Se tarjoaa paremman käyttökokemuksen (UX) ja ohjaa siten enemmän liikennettä kaikenmuotoisista ja -kokoisista laitteista.
- Käyttäjät eivät todennäköisesti poistu verkkosivustoltasi turhautuneina ja yhdistävät brändisi negatiivisiin tunteisiin.
- Hakukoneet nostavat optimoidun verkkosivuston kärkeen, koska UX on yksi sijoitustekijöistä.
- Se lisää asiakkaiden uskollisuutta, koska ei-mobiiliystävälliset verkkosivustot näyttävät luonnosllisilta ja heikkolaatuisilta.
Vaikka mobiilioptimointi saattaa tuntua pieneltä yksityiskohdalta, sillä voi olla syvällinen vaikutus verkkokauppaliiketoimintaasi lisäämällä myyntiä ja liikennettä pääsivustollesi.
Mobiiliystävällinen vs. mobiilioptimoitu vs. reagoiva: mitä eroa on?
Mobiiliystävälliset, mobiilioptimoidut ja responsiiviset suunnittelut ovat kolme erilaista lähestymistapaa verkkokaupan mobiilisivustoversion luomiseen.
Mobiiliystävällinen verkkokauppasivusto
Mobiiliystävällinen suunnittelu tarkoittaa olemassa olevan web-UX:n räätälöimistä mobiililaitteisiin. Se on työpöydällä näkyvän verkkosivuston kutistettu versio, joka on helpoin toteuttaa.
Mobiiliystävällinen verkkokauppasivusto riittää sijoittumaan korkeammalle Google-haussa (voit jopa suorita mobiiliystävällisyystesti tarkistaaksesi sen), mutta se ei maksimoi käyttökokemusta. Pienet verkkokaupat, jotka sisältävät enimmäkseen tekstiä ja kuvia, saattavat hyötyä siitä, mutta kassasivusi käyttökokemus säilyy ennallaan.
Mobiilioptimoitu muotoilu
Mobiilioptimoitu suunnittelu noudattaa mobiililähtöistä lähestymistapaa. Toisin sanoen suunnittelet ensin erillisen verkkosivuston mobiililaitteille (lähinnä siksi, että sillä on enemmän rajoituksia) ja skaalaat sen myöhemmin työpöytäversioon. Tarkista joitain parhaita esimerkkejä PWA:sta vähittäiskaupassa, kuten Alibaba tai Flipkart – ne on rakennettu mobiililähtöistä lähestymistapaa ajatellen.
Mobiiliresponsiivinen muotoilu
Responsiivinen verkkokaupan mobiilisivuston suunnittelu tarkoittaa, että sivuston sisältö muuttuu automaattisesti käyttäjän näytölle sopivaksi. Se luottaa mobiilikäyttöjärjestelmään ja reagoi pienimpiinkin näytön koon muutoksiin, mikä on yleistä eri iPhone-versioille ja Android-laitteille. Sisältö on dynaamista: kuvien koko ja fontit muuttuvat, asettelut mukautuvat. Se vaatii huomattavan budjetin ja verkkokaupan kehittäminen, mutta se on käyttäjäystävällisin kolmiosta.
Mitä eroa verkko- ja mobiiliverkkokaupan suunnittelulla on?
Web-suunnittelu ja verkkokaupan suunnittelu mobiili eivät ole koskaan samanarvoisia. Ero näiden kahden välillä on valtava useista syistä:
- Sinulla on paljon enemmän vapautta työpöytäsivuston suunnittelussa. Ei vain käyttöjärjestelmän käyttöliittymäelementit sanelevat mobiiliverkkokauppasivuston suunnittelua, vaan myös pienempi näyttö tarkoittaa, että vierailija näkee verkkosivustolla paljon vähemmän tietoa. Näiden rajoitusten kompensoimiseksi mcommerce-jälleenmyyjät antavat käyttäjille mahdollisuuden lähentää ja loitontaa verkkosivuja sekä säätää kirjasinkokoja, jotta tekstistä tulee helppolukuinen.
- Mobiilisivustolla on kosketuspohjainen syöttö. Hiiren tai näppäimistön sijaan useimmat mobiilikäyttäjät käyttävät laitteitaan kosketusnäytön ja mobiilikohtaisten toimintojen, kuten soita napsauttamalla tai sijaintipohjaisen kartoituksen, avulla.
- Verkkosivuston käyttö pöytäkoneella ja mobiililaitteella on erilainen. Kun asiakas tulee tekemään ostoksia verkkokauppasivustollasi, hän tekee ostoksen todennäköisimmin loppuun. Samaan aikaan mobiilikäyttäjät ovat nopeita ostajia. He käyttävät verkkokauppasivustosi mobiililaitetta tuotteiden tutkimiseen, paikkojen etsimiseen, uutisten lukemiseen jne., mutta eivät välttämättä siirry kassalle. Siten verkkosuunnittelu lisää myyntiä, mutta mobiiliverkkokaupan suunnittelu optimoi konversiot ja lisää asiakkaiden uskollisuutta.
Visuaalisesta ulkonäöstä puhuttaessa verkko- ja mobiiliverkkokaupan suunnittelussa on myös silmiinpistäviä eroja. Tässä on esimerkki kulutuselektroniikkasivustosta TurcomUSA suunnitellut Elogic. Turcom myy laitteita ja elektronisia laitteita. Kun avaat sen työpöydällä, näet seuraavan version:
Katso nyt samaa verkkosivustoa matkapuhelimellasi. Sivuston kaikki tärkeät elementit säilytetään: paikan päällä oleva haku, ostoskori, henkilökohtainen kaappi. Silti sisältö ja visuaaliset elementit on järjestetty uudelleen paremman käyttökokemuksen saamiseksi.
Kuinka optimoida verkkokauppasivusto mobiililaitteille?
Jos yrityksesi ei ole valmis mobiililaitteille ensisijaiselle tai mobiiliresponsiiviselle verkkosivustolle (olipa kyseessä budjetti tai tekninen asiantuntemus), älä huoli. Sinun ei tarvitse kehittää mobiilisovellusta sijoittuaksesi korkeammalle alusta alkaen. Sen sijaan voit optimoida verkkokauppasivustosi mobiililaitteille.
Tässä on kuusi tapaa optimoida verkkosuunnittelu mobiiliverkkokauppaa varten kustannustehokkaalla tavalla.
#1 Tee verkkosivustostasi salamannopea
Noin 47 % asiakkaista odottaa verkkosivustojen latautuvan alle 2 sekuntia; muuten ne vain putoavat. Google ottaa huomioon latausnopeudet myös sijoittaessaan sivustosi hakukoneeseen.
Orgaaninen liikenne ja asiakastyytyväisyys riippuvat myös verkkosivuston nopeudesta. Walmart huomasin että jokainen sekunti parannetusta verkkosivuston nopeudesta merkitsee 2 % enemmän tuloksia ja jokainen 100 ms lisää tuloja 1 %.
Nopeuden parantamiseksi voit:
- Optimoi kuvat
- Käytä sisällönjakeluverkkoja (CDN)
- Pienennä ja yhdistä CSS, JavaScript ja HTML
- Käytä asynkronista latausta
- Päivitä hosting
- Ota pakkaus käyttöön
- Käytä selaimen välimuistia
#2 Varmista kätevä kassakokemus
Kassakokemus merkitsee paljon: sinulla voi olla hyvin harkittu markkinointisuppilo, mutta summittainen kassa, joten käyttäjät hylkäävät ostoskorinsa joka tapauksessa. Voit optimoida kassan mobiililaitteille käyttämällä seuraavia vinkkejä:
- Luo verkkokauppasivuston mobiiliversio, joka sopii käyttäjän näytölle
- Yksinkertaista lomake
- Poista kaikenlaiset häiriötekijät, kuten mainokset ja sähköpostitilauslomakkeet
- Käytä turvatiivisteitä
- Tee suuria painikkeita helposti luettavalla tekstillä
- Luo palkki käyttäjän edistymisestä
- Salli automaattinen täyttö
- Älä linkitä kassaprosessin ulkopuolelle
- Käytä eri näppäimistöjä eri kentille (esimerkiksi vedä numeronäppäimistö ylös puhelinnumeroa varten sen sijaan, että asiakas vaihtaisi siihen itse)
Mobiilioptimoitu kassa näyttää tältä Rullakani's verkkosivuilla, muotiverkkokaupassa, jonka Elogic on kehittänyt. Jälleenmyyjä optimoi käyttökokemuksen ja huomasi ostoskorin hylkäämisasteen laskun.
#3 Työskentele intuitiivisen paikan päällä tehtävän haun parissa
Navigointi on olennainen osa verkkosuunnittelua mobiiliverkkokaupan alustoille. Kun selattavana on tuhansia kohteita, käyttäjien on rajattava valintaansa mahdollisimman paljon päästäkseen haluamiinsa tuotteisiin nopeammin.
Optimoi paikan päällä tekemäsi haku mobiililaitteille tekemällä siitä lyhyt, listaamalla tärkeimmät sivut ensin ja lisäämällä valikkoon isompia painikkeita, koska käyttäjien sormet ovat suuremmat kuin näytöllä oleva nuoli. Vältä valikoiden leijuttamista ja laajentamista minimoidaksesi alinavigoinnin äkillisen katoamisen ja uudelleen ilmestymisen kitkan.
#4 Kiillota tuotesivusi
Tuotekuvauksia ei välttämättä kannata jättää sopimaan tuotesivulle mobiilin näytön kokoon. Mutta on suositeltavaa tehdä niistä lyhyitä (enintään 200 merkkiä) ja sijoittaa ne sivun yläpuolelle korkealaatuisen valokuvan viereen. Vältä lukuisia vierityksiä, kokoontaitettavia sisältölohkoja ja napautettua sisältöä. Suosittelemme myös "takaisin alkuun" -painikkeen käyttöä, mutta varmista, etteivät asiakkaat vahingossa paina sitä yrittäessään yksinkertaisesti vierittää alaspäin.
#5 Optimoi käyttökokemus
UX for Mobile eCommerce -verkkosivustojen suunnittelu näyttää erilaiselta kuin mitä näit pöytäkoneilla. Yksi tärkeimmistä säännöistä on pitää painikkeet suurina ja minimoida teksti, koska sinulla ei ole paljon tilaa työskennellä. Mobiilikäyttäjien huomio häiriintyy helpommin kuin pöytätietokoneiden käyttäjät, joten varmista, että toimitat lyhennetyt versiot myyntikopioistasi.
Muista myös peukalon asento. Pöytätietokoneen asiakkaat voivat käyttää kirjaimellisesti kaikkia näytön osia, mutta mobiilikäyttäjät tavoittavat peukalollansa. Oikea alakulma on yksi mobiilikäyttäjien aktiivisimmista paikoista, joten muista sijoittaa tärkeät painikkeet (kuten lisää ostoskoriin) sinne.
Lopuksi, älä unohda ylläpitää brändi-identiteettiäsi: käytä yrityksen fontteja ja värejä mahdollisimman paljon, jotta mobiiliversiosi ei muutu yksinkertaisiksi teksteiksi ja kuviksi.
#6 Hyödynnä sosiaalista mediaa verkkokauppasivustollesi
Käyttäjät käyvät sosiaalisessa mediassa enimmäkseen mobiilissa ja voit käyttää sitä hyödyksesi. Tee brändisi sivujen seuraamisesta helppoa lisäämällä sosiaalisen seurannan ja jakamisen kuvakkeita, upottamalla pinnallisia kuvia saadaksesi enemmän huomiota Pinterestissä ja käyttämällä sosiaalisia kirjautumisia tehdäksesi rekisteröitymisestä mahdollisimman helppoa.
Voit myös upottaa sosiaalisia syötteitä kannustaaksesi käyttäjiä jakamaan valokuvansa tuotteen kanssa ja tarjoamaan heille alennusmyyntiä, jotta he palaavat myöhemmin. Asiakkaamme Hiili38 kokeilin ja sain mahtavia tuloksia!
Älä unohda testata verkkokauppasivustoasi mobiililaitteille
Yksi tapa testata verkkokaupan mobiilisivustosi suunnittelua on tarkistaa sen reagointikyky eri näyttökokoisilla laitteilla. Kiinnitä huomiota latausaikaan, intuitiiviseen navigointiin, tiedon luettavuuteen sekä tiedon sijoitteluun tuotesivuilla.
Jotta testausprosessi olisi vähemmän aikaa vievä ja kustannustehokkaampi, voit harkita seuraavia työkaluja:
- W3C mobileOK Checker. The W3C mobileOK -tarkistaja on yksi parhaista työkaluista, joilla voit testata sivustosi yhteensopivuutta mobiililaitteilla. Työkalu suorittaa useita testejä, jotka tunnistavat mobiilisivuston käyttäjäystävällisyyden.
- Google Mobilizer. Google Mobilizer saa kiitosta intuitiivisesta käyttöliittymästään ja helppokäyttöisyydestään. Sinun tarvitsee vain kirjoittaa verkkosivusi osoite hakukenttään, niin työkalu löytää suorituskyvyn pullonkaulat ja antaa optimointiehdotuksia verkkokauppasi mobiilisivustollesi.
- Gomez. Gomez mobiilivalmiustyökalu testaa verkkosivustosi yli 30 vakiintuneen tekniikan perusteella. Se antaa sinulle arvosanan 1–5. Tulokset näkyvät asiakirjassa, joka ehdottaa verkkosivustosi parantamista. Ole valmis täyttämään henkilökohtaisia tietoja, kuten sähköpostiosoitteesi ja puhelinnumerosi.
Yhteenveto
M-kaupankäynnin kasvaessa voit silti hypätä trendiin ja optimoida verkkokauppasivustosi mobiililaitteille. Muista seuraavat ohjeet riippumatta siitä, valitsetko mobiiliystävällisen verkkokauppasivuston tai kehität mobiilisovelluksen tyhjästä:
- Mobiilioptimointi on ehdoton edellytys korkealle sijoitukselle hakukoneissa. Vaikka sinulla ei olisi teknistä tiimiä tai budjettia mobiilisovelluksen rakentamiseen, tee mobiilioptimoinnista yksi verkkokaupan kehittämisen painopisteistäsi.
- Nopeudella on väliä. Verkkosivustosi mobiiliversion tulee olla yhtä nopea (ellei nopeampi) kuin verkkokauppasivusto. Optimoi tuotekuvasi mobiililaitteille, lisää lyhyitä kuvauksia ja työskentele yhden sivun kassalla.
- Mobiililaitteiden intuitiivinen käyttökokemus on avain tulosprosentteihin. Tee käyttäjien helpoksi löytää etsimänsä tuote, muodostaa yhteys sosiaaliseen mediaan ja hyödyntää mobiilipohjaisia toimintoja verkkosivustosi kanssa.
Älä koskaan aliarvioi verkkokauppasivustojen mobiilivoimaa. Se saattaa olla avain yrityksesi kasvuun.
- "
- &
- 2021
- 9
- hylkääminen
- Tili
- aktiivinen
- mainokset
- Etu
- Alibaba
- Kaikki
- android
- animaatio
- sovelluksen
- artikkeli
- Miljardi
- Laatikko
- selain
- rakentaa
- liiketoiminta
- muuttaa
- tarkkailun
- Kassa
- kahvi
- Yhteinen
- kuluttaja
- Viihde-elektroniikka
- Kuluttajat
- pitoisuus
- Muuntaminen
- Laajuus
- Asiakasuskollisuus
- Asiakastyytyväisyys
- Asiakkaat
- tiedot
- toimitus
- Malli
- yksityiskohta
- kehittää
- Kehitys
- Laitteet
- ajanut
- Pudota
- verkkokaupan
- verkkokaupan
- Elektroniikka
- tunteet
- kannustaa
- jne.
- esimerkki
- experience
- Muoti
- FAST
- Ominaisuudet
- Fields
- Etunimi
- sovittaa
- salama
- FLIPKART
- seurata
- Vapaus
- Gadgets
- Global
- Google Search
- suuri
- Kasvaa
- Kasvu
- Korkea
- Miten
- Miten
- HTTPS
- tunnistaa
- Identiteetti
- kuva
- Vaikutus
- tärkeä
- Mukaan lukien
- Kasvaa
- tiedot
- tiedot
- iPhone
- kysymykset
- IT
- JavaScript
- avain
- suuri
- OPPIA
- Vaikutusvalta
- rajallinen
- LINK
- listaus
- kuormitus
- Uskollisuus
- Tekeminen
- markkinat
- Marketing
- Matters
- mitata
- Media
- Puhelinnumero
- Mobiilisovellus
- mobiililaitteen
- mobiililaitteet
- kännykkä
- suunnistus
- verkot
- uutiset
- verkossa
- avata
- toiminta
- käyttöjärjestelmän
- tilata
- orgaanista liikennettä
- Muut
- Maksaa
- suorituskyky
- puhelimet
- Platforms
- Kiillottaa
- teho
- esittää
- Tuotteet
- Tuotteemme
- hankkeet
- osto
- Hinnat
- valmius
- syistä
- Rekisteröinti
- tutkimus
- tulokset
- jälleenmyyjä
- jälleenmyyjät
- Revealed
- tulot
- säännöt
- myynti
- myynti
- Asteikko
- Näytön
- Haku
- hakukone
- Hakukoneet
- turvallisuus
- Jaa:
- ostajat
- Ostokset
- ostoskori
- Lyhyt
- Yksinkertainen
- SIX
- Koko
- pieni
- So
- sosiaalinen
- sosiaalinen media
- Tila
- nopeus
- Alkaa
- pysyä
- verkkokaupasta
- varastot
- tilaus
- SWIFT
- Vaihtaa
- järjestelmä
- Napauttaa
- teknologia
- tekniikat
- testi
- Testaus
- testit
- aika
- vinkit
- työkalu
- työkalut
- ylin
- Kosketusnäyttö
- liikenne
- us
- Käyttäjät
- ux
- näkyvyys
- tilavuus
- Walmart
- verkko
- Verkkosivu
- sivustot
- sanoja
- Referenssit
- zoomaus