Suunnittelu sivustosi navigointi on kuin antaa perusta talosi. Jos suunnittelet säätiösi kunnolla, saatat rakennuksen vaaran romahtaa riippumatta siitä, kuinka mukavaa se näyttää. Jos haluat hyötyä sivustosi parhaista myynnistä tai tuloksista, sinun on vietä aikaa suunnitella, miten yleisösi tulee vuorovaikutuksessa sisältösi kanssa ja selvittää intuitiivisin tapa organisoida ja edustaa sitä.

Muista aina, jos saat tämän osan väärin, saatat vaarantaa suuren osan yleisöstäsi.

Mikä on navigointi?

Navigointia tarkastellaan useammalla kuin yhdellä. Voisit sanoa, että se on verkkosivustollesi keskeinen elementti, jonka avulla asiakkaat voivat löytää etsimäsi ilman sekaannusta tai tarpeettomia napsautuksia. Samoin voit väittää, että se on tapa johtaa asiakkaitasi varovasti tärkeimpiin tietoihisi sivustollesi, jotta voit tuottaa myyntiä tai kyselyitä.

Mahdollisuudet ovat, se on molempia.

Navigointi on kuin monissa muissakin asioissa: ei ole yleisesti sovittu "oikea tapa" tehdä se. Jokaisella verkkosivustolla on omat haasteensa, joita voidaan lähestyä monin tavoin. Hyvä uutinen on, että on olemassa tapoja ajatella ja järjestää sisältöä, joka minimoi epäonnistumisen riskin.

70percentpure

70percentpuren sivusto sisältää yksinkertaisen navigoinnin, joka on sekä pystysuora että vaakasuora.

1) Viimeistele IA ensin

Suuren verkkosivuston sisällön suunnittelu on tärkeä tehtävä, joka on saatava päätökseen ennen kuin suunnittelet navigointiasi. Muulla nimellä IA (Information Architecture) tämä yleiskatsaus, sisällön ymmärtäminen ja sisällön manipulointi muodostaa sivustosi käytettävyyden selkärangan. Suunnittele navigointi ennen tai - sen sijaan, että suunnittelet IA: n oikein, olisikin luoda kirjan indeksi ennen kuin julkaiset sivut. Ei ole hyvä idea.

Luonnollinen kyky nähdä iso kuva auttaa työskentelemään IA: ssa. Vielä tärkeämpää on, että voit nähdä sisällön käyttäjän näkökulmasta. Joskus tämä tarkoittaa, että menette asiakkaan omaa tapaa luokitella sisällönsä - niin valmistaudu vastustukseen, jos näin on.

Seuraavassa on muutamia asioita, joita voit kysyä itseltäsi auttaa valmistamaan järjestelmääsi ja perustelemaan sen asiakkaalle:

  • Mitä sivuja tarvitaan tällä sivustolla?
  • Onko jokaisella sivulla tarkoitus laajempaa järjestelmää, ja onko sisältö hajonnut järkeviin ja suhteellisiin osioihin?
  • Mitä korvauksia on lisättävä sisällön lisäämiseksi tulevaisuudessa?
  • Mitä käyttäjäryhmiä olet tekemässä? (esim. kirjautuneet sisään / ulos, tilaustyypit, mainostajat jne.)
  • Mikä on kunkin käyttäjän tyypin ensisijainen tavoite?

Kaikkien edellä mainittujen vastausten ymmärtäminen, miten sisältösi liittyy käyttäjiin, on perusta hyvän navigointisuunnittelun kannalta.

2) KISS: Pidä se yksinkertaisena, toisinaan

Jokainen, joka on koskaan käyttänyt verkkosivustoa, voi todennäköisesti sopia: navigointialueen pitäisi olla mahdollisimman yksinkertainen. Ylivoimaista käyttäjää valinnoilla ja tähdellä tekstin kanssa navigointi on huono ajatus ja vakavasti haittaa sivustosi yleistä käytettävyyttä.

Bloomberg

Bloombergin yksinkertainen navigointi vaikeuttaa sivustonsa monimutkaisuutta.

Yksinkertaisuus voi kuitenkin olla harhaanjohtavaa. Dig syvemmälle ja saatat huomata, että mikä on todella melko monimutkaista, on taitavasti pakattu tavalla, joka tuntuu yksinkertaiselta. Tämä on IA toiminnassa.

Käytä esimerkiksi Microsoftin kotisivua. Niiden päävalikossa on vain neljä kohdetta, jotka kuulostavat melkoisesti melko tarpeettomilta ottaen huomioon niiden tuotevalikoiman. Mutta pudotuspisteet ovat hyvin älykkäästi jakautuneet osioihin, ja ne on esitetty siten, että löydät etsimäsi nopeasti ja helposti.

microsoft

Alisivut ovat kuin pienoiskohteita, samaa navigointimuotoa noudattaen. Valikko tuntuu ja käyttäytyy samalla tavalla, mutta se mukautuu tarjoamaan enemmän yksityiskohtia, mitä syvemmälle pääset sivustoon.

microsoft2

Se on helppokäyttöinen, ennustettavissa ja johdonmukainen. Kun otetaan huomioon niiden tuotevalikoima ja verkkosivuilla olevien sivujen määrä, tämä ei ole mikään tärkeä tekijä, ja se on luonnollisesti monen tunnin iteraattisen kehityksen tulos. Ei vain se tuntuu yhdeltä tuotteelta - joka on erittäin rauhoittava kävijälle - mutta se järjestää sisällön tavalla, joka sopii sekä asiakkaalle että Microsoftille.

3) Valitse suuntaa huolellisesti

Koska tietokoneen näyttö on perinteisesti käytetty maisemamuodossa, horisontaalinen navigointi tekee paljon järkeä. Niin paljon aikaa vain tuntuu tasapainoisemmalta, vähemmän häiritsevältä ja helppoa asentaa suunnittelun näkökulmasta.

Oculus

Oculus, VR-kuulokkeiden valmistajat olisivat tyhmät, jos he eivät puhu virtuaalisista maisemistaan ​​vaakasuoralla valikolla. Ei vain se mukava metafora, mutta antaa käyttäjälle mahdollisuuden syventää sisältöään vierittämällä sivua alaspäin.

Horisontaaliset valikot eivät kuitenkaan tuo lisäarvoa kaikissa konteksteissa, minkä vuoksi näet paljon vertikaalista navigointia etenkin sähköisessä kaupankäynnissä. Se kantaa kaikuja värillisistä kielekkeistä, jotka auttavat sinua löytämään tuotteita fyysiseen luetteloon, ja välttää horjumattomasta palkista liian paljon tekstiä ja liian monta vaihtoehtoa.

Hyvä pystysuuntainen navigointi ei ole helppoa, varsinkin jos sinulla on paljon tuotteita. Siksi pidän tästä Jack Jonesista.

jackjones

Tekstin vieressä olevat kuvakkeet todella tukevat luettavuutta. Yksinkertaiset muodot ovat yllättävän kommunikoivia ja auttavat pitämään navigointialue keskittyneenä ja siistinä. Napsauta luokkaa ja valikko laajenee paljastaaksesi alavalinnat uudelleen silmään hyvin helposti.

Pystysuuntaisen valikon epätavallisempi käyttö on saatavilla Squarepusherin sivustolla. Tässä navigointia käytetään kuten välilehti, pääosan sisällön vierestä, jonka käyttäjä voi vain selata ja napsauttaa. Se on paljon lineaarisempi lähestymistapa ja kattaa Squarepusher-radan peräkkäisen luonteen.

squarepusher

Säännöt ovat muuttumassa

Kuten kaikkialla verkossa, uudet tekniikat, tekniikat, laitteet ja trendejä tuovat omaan haasteeseensa ja innovaatioitaan pöydälle. Responsive web design tarkoittaa perinteistä horisontaalinen nav on nyt myös pystysuora nav (pienemmillä näytöillä). Parallaaksitekniikat käsittelevät navigointialueita ja virtaavat kuin vuorovesi, riippuen siitä, missä olet sivulla.

Ei ole olemassa yhtä tapaa luoda täydellinen sivusto nav. Suunnittelun ja testaamisen toeristinen lähestymistapa, mieluiten pääsemällä sivustosi tilastoihin ja tulostietoihin, tuottaa todennäköisesti parhaan tuloksen.

Koska moottori, joka ajaa verkkosivustoasi, navigoinnin tulee olla ennakoitavaa, yksinkertaista, johdonmukaista ja hyvin sijoitettua.