Eletään älypuhelinten aikakautta, ja älypuhelimilla, kosketuslevyillä Internetiä käyttävien ihmisten määrä kasvaa valtavasti. Kaikille yrityksille, olipa se online- tai offline-tilassa, mobiiliystävällistä verkkosivustoa tarvitaan eniten.

Mobiiliystävällinen verkkosivusto tarkoittaa vahvan verkkonäkyvyyden perustan luomista. Mobiiliystävällisen verkkosivuston puuttuminen puolestaan merkitsee tinkimistä odotetusta liiketoiminnan kasvusta ja voitosta.

Mikä on sinun valintasi? Uusien ja aktiivisten asiakkaiden voittaminen ja liiketoiminnan kasvu? Jos kyllä, ajattele fiksua tapaa ja tee verkkosivustostasi helposti pöytätietokoneiden tai kannettavien tietokoneiden, mutta myös älypuhelimen ja kosketuslevyn käyttäjien ulottuvilla.

Jos olet päättänyt älypuhelimen kanssa yhteensopivan verkkosivuston tai sinulla on jo mobiiliverkkonäkyvyys, sinun tulee tietää mobiilisivuston osa-alueet, jotka vaativat huomiota. Navigointi on listan kärjessä. Älypuhelimet eivät ole enää pieniä näyttöjä, vaan näytön koot kasvavat ajan myötä. Älypuhelimien kosketusjärjestelmä tarvitsee ystävällisen sivustonavigoinnin parempaan selaamiseen. Yksi väärä kosketus voi ärsyttää käyttäjää ja johtaa siten verkkosivuston vaihtamiseen. Haluatko että? "EI"! Lue alta, kuinka voit tehdä mobiilisivuston navigoinnista käyttäjäystävällistä. Ennen kuin siirryt pääaiheeseen, tutustu mielenkiintoisiin mobiilitietoihin luotettavista lähteistä!

58 % kaikista yhdysvaltalaisista kuluttajista omistaa älypuhelimen.
Yli 1,2 miljardia ihmistä käyttää verkkoa mobiililaitteillaan.
Globaali mobiililiikenne muodostaa nyt 15 % kaikesta Internet-liikenteestä.
Millään näyttökoolla ei ole enempää kuin 20 % markkinaosuudesta.
61 prosentilla ihmisistä on parempi mielipide brändeistä, kun ne tarjoavat hyvän mobiilikokemuksen.
60 % mobiiliasiakkaista käyttää älypuhelintaan kaupassa ollessaan ja 50 % matkalla kauppaan.
Tablettien käyttäjät kuluttavat 50 % enemmän kuin PC-käyttäjät.
Mobiilipohjaiset haut muodostavat neljänneksen kaikista hauista.

Yllä mainitut tilastot paljastavat selvästi, mihin verkko on menossa. Älypuhelinten vallankumous vie kaiken osiin. Siirtyminen pöytäkoneista ja kannettavista tietokoneista mobiililaitteisiin pakottaa verkkosivustojen omistajat ja web-suunnittelijat olemaan asiakasystävällisiä, erityisesti yrityskuvan esittämisen yhteydessä. Muuttuva ei ole vain verkkokäyttötapa, vaan myös sivuston käyttäjien tarpeet muuttuvat. Ihmiset keskittyvät yhä enemmän käyttäessään Internetiä mobiililaitteilla. Mobiililaitteilla suoritettavat erityistehtävät voivat olla sijainnin etsiminen, pankkitilikysely, sosiaalisen median päivitykset ja joukkoliikenteen aikataulu. Älypuhelimen käyttö internetiin pääsyyn ei ole yleistä vain pitkissä jonoissa, vaan myös kodin mukavuuksissa asuessa.

Älypuhelimet, joiden näyttötila on rajallinen, asettavat haasteen käyttäjille ja verkkosivujen omistajille navigointialueella. Tehokasta ja sujuvaa navigointia tarvitaan haluttujen tietojen hakemiseen sormella tai peukalolla. Verkkosivustojen omistajien ja web-suunnittelijoiden on pohdittava:

Vierailijoiden tarpeet
Mahdollisia kysymyksiä tulee heidän mieleensä
Laitteen rajoitukset
Turhauttavia asioita verkkosivuilla

Kaikki nämä näkökohdat on tärkeää ottaa huomioon suunniteltaessa mobiilisivustoa, erityisesti navigointia. Alla olevilla riveillä opit tuntemaan sujuvan navigoinnin tärkeyden mobiilisivustoilla ja parhaita käytäntöjä, joita noudatetaan asiakasystävällisen mobiilisivustonavigoinnin luomiseksi. Lue ja ota käyttöön, jos haluat saada hyvää palautetta sivustosi käyttäjiltä.

Aseta itsesi sivuston käyttäjien kenkiin

95 % käyttäjistä etsii paikallista tietoa tehdessään hakuja mobiililaitteilla. Siksi mobiilisivustoilla tulisi olla sivustolla näkyvä sijainti, yhteystiedot ja aukioloajat. Tarkkaile mobiililiikenteen analytiikkaa ja löydä luokat, joita mobiilisivuston käyttäjät hakevat eniten. Mainitse linkki, jolla pääset verkkosivustolle, jotta vakavat ostajat voivat saada yksityiskohtaisen kuvan yrityksestä kannettavalla tietokoneella tai pöytätietokoneella.

Responsiivinen web-suunnittelu

Mobiililaitteille suunniteltaessa verkkosuunnittelijat eivät tiedä, mitä laitetta loppukäyttäjä käyttää. Se asettaa haasteen luoda käyttäjäystävällisiä mobiilisivustoja. Responsiivisen web-suunnittelun konsepti tarjoaa ratkaisun tällaisen ongelman ratkaisemiseen. Responsiiviset web-suunnittelutyökalut, kuten CSS-mediakyselyt, auttavat ratkaisemaan ongelmia, kuten sijaintia, kokoa ja sisältöä. Responsiivisen verkkosivuston suunnittelu tai olemassa olevan verkkosivuston päivittäminen mobiililaitteille edellyttää parhaiden käytäntöjen noudattamista sujuvan navigoinnin varmistamiseksi. Alla olevilla riveillä mainitaan muutamia parhaita käytäntöjä, erityisesti valikoiden suunnittelussa pienille näytöille!

1 Pidä valikkovälilehdet minimissä

Valikkopainikkeiden enimmäismäärä saa olla 5. Jos se toimii, sisäkkäisiä painikkeita voidaan lisätä. Siitä voi kuitenkin tulla hankalampaa, jos päivität olemassa olevan työpöytäsivuston, jossa on pitkät navigointivalikot, mobiilisivustoksi. Verkkokauppasivustoille vaaditaan monitasoinen navigointi, mutta älä koskaan siirry kahdelle tasolle.

2 Minimoi hanat

Anna mobiilikäyttäjien saavuttaa haluttu verkkosivustoalue mahdollisimman pienellä määrällä napsautuksia. Tämän lisäksi aseta Takaisin-painike näkyvästi, mikä voi turhauttaa sivuston kävijöitä. Vähemmän klikkauksia päästään halutulle verkkosivustoalueelle, sitä enemmän verkkosivuston käyttäjien todennäköisyyttä saada tulos.

3 Tarjoa vieritysnavigointia

Sijoita luokat navigointivalikoihin huolellisesti ja harkitse kunkin luokan tärkeyttä. Tärkeimmät elementit tulee sijoittaa navigoinnin yläosaan ja listata muut alas. Yksityiskohtaisten valikoiden saamiseksi voidaan tarvita vieritystä älypuhelimien pienillä näytöillä.

4 Rajoita otsikon korkeutta

Käytä tylsiä otsikoita ja rajoita niiden korkeutta. Loppujen lopuksi otsikon alla oleva sisältö on tärkein ja osuu kohdeyleisöihin. Sivuston käyttäjillä tulee olla selkeä käsitys sivustossa liikkumisesta ilman häiriötekijöitä.

5 Harkitse verkkosivuston muotokuvaa

Mobiilikäyttäjät saavat verkkosivuston pystynäkymän vaakanäkymän sijaan. Navigointia tulee mukauttaa vastaavasti. Tarjoa alas luettavaa tyyliä sivun poikki. Se vaatii vähimmäismäärän navigointiluokkia.

6 Kokoontaitettava navigointi

Sisäkkäiset tai kokoontaitettavat valikot ovat hyviä verkkosivustoille, jotka tarvitsevat sisältöä valikkoon. Se sopii myös verkkosivustoille, joille odotetaan lisäävän lisää luokkia tulevaisuudessa.

7 Päätä tärkeimmistä asioista

Kun päätät valikoista, mieti:

Verkkosivustosi tärkeimmät sivut
Verkkosivustosi huippuluokan sivut
Mobiilikäyttäjien mahdolliset yhteiset toimet
Sivut, jotka vastaavat käyttäjien tarpeita
Mitä nopeammin sivuston kävijä saavuttaa halutun sijainnin, sitä parempi se on. Ohjaa heidät suoralle polulle selkeän toimintakehotuksen avulla.

8 Tee navigoinnista selkeästi ymmärrettävä

Valikko tulee kirjoittaa selkeästi, jotta se ymmärtää kielen. Vierailijan tulee ymmärtää, mihin suuntaan hänen tulee mennä. Jos käytät symboleja, tee niistä intuitiivisia, jotta vierailijat ymmärtävät paremmin. Perinteisiä symboleja, kuten + tai >, voidaan käyttää kertomaan vierailijoille, että valikkovaihtoehtoja on enemmän.

9 Paranna käyttökokemusta fonttien ja kontrastin avulla

Vältä pientä tekstiä, jota käyttäjien on zoomattava nähdäkseen. Hakukoneet, kuten Google ja Bing, eivät pidä pientä tekstiä käyttäjäystävällisenä lähestymistapana. Korkeampi fontti ylimääräisellä kirjainten välillä voi olla parempi valinta. Arial, Courier ja Times New Roman ovat yleisimpiä mobiilisivustoilla käytettyjä kirjasintyylejä. Harkitse tuotemerkkisi tyyliopasta, kun päätät kirjasinten tyylistä ja koosta. Mitä tahansa tyyliä ja kokoa käytät mobiilisivustolla, sen pitäisi auttaa tekstin lukemisessa ilman zoomausta.

10 Luo verkkosivustoja kosketuspohjaisille laitteille

Keskimääräinen sormi vaatii 44 pikseliä tarkkaan napsautukseen. Se johtuu sormen koosta ja kosketusnäytön vaatimasta tarkkuudesta. Alle 40 pikselin kohde johtaa huonoon navigointiin. Koska käyttäjien ei ole helpompaa osua kosketusmerkkiin tarkalleen useimmiten, tarvitaan navigointipalautetta. Tämä palaute voi olla värin, fontin vaihdon tai muun visuaalisen vihjeen muodossa. Tällainen palaute voisi auttaa käyttäjiä saamaan luottamusta oikean tuotteen valitsemiseen.

Monitasoisessa navigoinnissa avattavien valikoiden ei pitäisi olla hiiren osoittimen päällä, vaan aktivoida niitä koskettamalla. Pöytäkoneilla liikkuva navigointi toimii parhaiten, mutta mobiilikäyttäjille se on hankalaa.

Kuvien ja graafisten painikkeiden käyttö navigointiin on myös yleistä. Se ohjaa vierailijat oikeaan suuntaan, ja siksi se houkuttelee mobiilisivuston etusivua. Graafisia painikkeita on kuitenkin hyvä käyttää, mutta vältä niiden käyttämistä ensisijaisena navigointina verkkosivun alareunassa.

Anna sivustosi käyttäjille sivustosi yhtenäinen ulkoasu useilla laitteilla. Visuaalisen teeman ja kirjasimen tulee olla yhdenmukaisia mobiili- ja työpöytäsivustoilla. Navigoinnin tulisi kuitenkin olla erilainen sekä mobiili- että työpöytäsivustoilla.

Varmista, että mobiilisivustosi navigointi auttaa sivuston käyttäjiä suorittamaan verkkosivustolla tarvittavia tehtäviä. Käytä mobiilisivuston sisältöä käyttäjien tarpeiden mukaan.

Kuinka optimoida kosketusnäytöt ja pienet painikkeet?

Verkkosuunnittelijat näkevät uuden haasteen verkkosivujen luomisessa kosketusnäytöille ja pienille painikkeille. Halutun painikkeen painaminen on vähemmän tarkkoja, ja käyttäjä turhautuu todennäköisemmin, kun hän painaa väärään suuntaan. Siitä selviäisi hyvin käyttämällä painikkeita linkkien sijasta ja antamalla enemmän tilaa valikkopainikkeiden tai linkkien ympärille. Suurempi navigointipainike auttaa kosketusnäytön käyttäjiä sujuvaan navigointiin. Tässä on joitain vinkkejä kosketusnäyttöjen ja välilehtien optimoimiseksi:

Tunne sivuston käyttäjien päätarkoitus verkkosivustolla vierailemisen takana ja aseta valikkopalkki verkkosivun yläosaan tai alaosaan. Sisältöpohjaisilla verkkosivustoilla valikkopalkki voidaan sijoittaa verkkosivun alaosaan.
Voit piilottaa valikkorivin, jos sisällölle tarvitaan enemmän tilaa. Koko valikko tulee näkyviin, kun sitä napautetaan.
Valikkolinkki voitaisiin sijoittaa näytön yläosaan, kun taas navigointipainike voitaisiin lisätä alareunaan.
Pidä valikkopalkki lyhyenä ja leveänä. Se auttaa mainitsemaan pidempien kategorioiden otsikot helposti.
Pienennä otsikkokuvan kokoa tai käytä sen sijaan logoa saadaksesi lisää navigointitilaa.
Näytä navigointipainikkeiden tyylin, typografian ja värin johdonmukaisuus.
Vältä käyttämästä suurempia kuvia ja grafiikkaa.
Käytä lyhyttä tekstiä valikkopainikkeissa ja kategorioiden otsikoissa. Hyvä vaihtoehto on pinottavan valikon käyttö.
Mainitse tärkeimmät kohteet, joita useimmat käyttäjät haluavat nähdä etusivulla.

Mitä tulee välttää mobiilinavigoinnin optimoinnissa?

Mobiilikäyttäjät eivät pidä enemmän valinnanvaraa painikkeiden välillä. Välttääksesi heidän turhautumisensa, älä ryhdy seuraaviin asioihin:

Älä tarjoa heille enemmän vaihtoehtoja valita
Suuri ei vaakasuuntaiselle vieritykselle
Vältä leijumista
Vältä liukusäätimiä
Yksinkertaistaminen ei tarkoita, että sivuston kävijä kyllästyy.
Ole intuitiivinen navigoinnissa
Tarjoa helposti ja nopeasti tarvittavat tiedot

Johtopäätös:

Mobiilinavigoinnin osalta web-suunnittelijat noudattavat useita lähestymistapoja, ja uusia kehitetään jatkuvasti. Koska sivustot ovat erilaisia, ovat myös sivuston käyttäjien tarpeet, joten navigointi tulee suunnitella sen mukaisesti. Uutissivustolla vierailevat käyttäjät haluavat otsikoita, ja verkkoyritysten käyttäjät tarvitsevat tuote- tai yhteystietoja. Räätälöity navigointi käyttäjien tarpeiden mukaan on tapa tehdä mistä tahansa verkkosivustosta menestyvä.

Vaikka navigointielementit ovat erilaisia mobiilisivustoilla ja työpöytäsivustoilla, mutta eniten tarvitaan tyydyttävää vastausta sivuston käyttäjien kysymyksiin heidän vieraillessaan verkkosivustolla. Sujuva navigointi varmistaa nopeat ja oikeat vastaukset sivuston käyttäjille. Sivuston käyttäjien tarpeiden täyttäminen tarkoittaa heidän kutsumista vierailemaan verkkosivustolla yhä uudelleen ja uudelleen. Tyytyväiset asiakkaat tulevat jälleen sivuille.

Jatka mobiilisivustosi ja sen navigoinnin optimointia jatkuvasti houkuttelemaan sivuston käyttäjiä.

Verkkosuunnittelijana millaista navigointia suosit mobiilisivustollesi? Jaa alla olevissa kommenteissa!