Menu


Hampurilaisvalikko työpöytäsivustolla? Ei kiitos

4.7.2015

Viimeisen parin vuoden aikana työpöytäkokoisilla verkkosivustoilla on yleistynyt navigaatiomalli, jossa ainoa päänavigaation esitystapa on mobiiliversioista tuttu hampurilaisvalikko. Nättihän se kyllä on, mutta kaikilta muilta osin sen käyttäminen ainoana navigaatiomallina on täysi floppi.

Hampurilaismikä?

Hampurilaisvalikko, eli kolmen päällekkäisen viivan purilaisikoni, on nopeasti yleistynyt tarkoittamaan valikon tai vaihtoehtojen symbolia. Myös yksinkertaista ”Menu”-tekstiä näkee usein käytettävän. Hampurilaisvalikko on yleinen näky mobiilisaiteilla, joissa täysmittaisen sivustonavigaation esittäminen on usein tilanpuutteen vuoksi sula mahdottomuus.

Responsiivisten verkkosivustojen muuttuessa arkipäiväisiksi on hampurilaisvalikkoa alkanut kuitenkin enenevissä määrin näkyä myös leveämmissä verkkosivujen esitysmalleissa – siis työpöytäversioissa. Tällaisia verkkosivustoja ovat mm. Huge, Pollen ja ehkä kaikkein kuuluisimpana uutislehti Time.

Huge - esimerkki hampurilaisvalikosta

Huge Inc. ja hampurilaisvalikko pahimmillaan.

Ajatusketju idealle lienee yksinkertainen: miksi nähdä työtä ja vaivaa kahden eri valikkotyylin suunnittelulle, kun kaikki kuitenkin osaavat hampurilaisvalikkoa käyttää? Lisäksi purilainen on visuaalisesti nätti, antaen isoille kuville ja tekstisisällölle hengitystilaa. On myös ymmärrettävää perustella hampurilaisvalikon yleiskäyttöä sillä, että käyttäjälle halutaan luoda yhtenäinen käyttökokemus läpi kaiken kokoisten päätelaitteiden.

Mikäli sivustosi kuitenkin on jokin muu kuin tarinavetoinen taideteos, on hampurilaisvalikon käyttäminen työpöytäkoossa mitä todennäköisimmin pikaruokaan verrattavissa oleva ällötys.

Päänavigaation tarkoitus

Ensin täytyy mainita, että hampurilaisvalikko on pienellä näytöllä aivan kelpo kompromissiratkaisu. Suuremmalla näytöllä sen sijaan päävalikon piilottaminen on silkkaa käyttäjän kiusaamista.

Päävalikko on nimensä mukaisesti sivuston pääasiallinen navigointiväline. Sen pitäisi olla nopeasti saavutettavissa, ei ylimääräisen klikkauksen vaativa pienehkö ikoni jossain yläkulmassa. Päänavigaatiohan on hyödyllinen lähinnä sellaisille käyttäjille, jotka oikeasti selaavat sivustoa, eivätkä poistu heti ensimmäisen sivu jälkeen. Tyypillinen yrityssivusto koostuu 4-7 pääsivusta, mikä tarkoittaisi hampurilaisvalikon kautta käytettynä yhtä monta ylimääristä klikkausta. Vertailun vuoksi omalla sivustollani yli yhden sivun lukevien vierailijoiden keskimääräinen sivulatausten määrä on analytiikan mukaan 5,6. Niin, ja jos sivustosi koostuu kymmenestä eri pääosiosta, on siinä todennäköisesti jotain vikaa.

Hampurilaisvalikon käyttäminen näyttökoosta riippumatta on yksinkertaisesti huonoa bisnestä ja käyttäjän kiusaamista.

Päävalikko ei ole olemassa ainoastaan navigointia varten. Se kertoo käyttäjälle yleisellä tasolla mistä sivustossa oikein on kyse, ja mahdollistaa siten käyttäjälle paremman yleiskuvan muodostamisen ilman ylimääräistä ajankäyttöä. Hampurilaisvalikon tapauksessa käyttäjän on asioikseen avattava valikko, jotta hän voisi muodostaa yleiskuvan sivuston käsittelemistä kokonaisuuksista. Pahimmassa tapauksessa tämä johtaa siihen, ettei käyttäjä muutaman sekunnin vierailunsa aikana saakaan muodostettua yleiskuvaa, vaan siirtyy Googlen seuraavaan osumaan.

Päävalikko viestii käyttäjälle myös käyttäjän sijaintia sivustorakenteessa. Mikäli päävalikkoa ei ole näkyvissä, ei käyttäjän ole mahdollista nähdä, mikä osio juuri tällä hetkellä on valittuna

Hampurilaisvalikon käyttäminen työpöytänäkymissä on myös aivan silkkaa tilan haaskaamista. Kännykkäselaimet ovat aivan oma lukunsa, mutta miksi 23-tuumaisella näytöllä tilaa pitäisi millään tapaa säästellä? Koko responsiivisen suunnittelun idea on se, että saatavilla oleva tila käytettäisiin optimaalisesti kunkin näyttökoon erityispiirteitä kunnioittaen. Hampurilaisvalikko työpöytänäkymässä on tästä näkökulmasta sama kuin maidon myyminen ainoastaan desilitran kokoisissa pakkauksissa.

Älä laita purilaista työpöydälle

Ainoat järkevät käyttötapaukset hampurilaisvalikon käyttämiselle työpöytäsivustoissa ovat puhtaat taidesivut tai etusivupainotteiset sivustot, kuten uutissivustot. Tässä tapauksessa jo edellä mainittu Time-lehti saa osittaisen synninpäästön. Muussa tapauksessa hampurilaisvalikon käyttäminen näyttökoosta riippumatta on yksinkertaisesti huonoa bisnestä ja, vielä kamalampaa, sitä kuuluisaa käyttäjän kiusaamista.

Muista siis, että työpöytäsivustolla hampurilaisvalikko:

  • Hidastaa navigointia
  • Vaikeuttaa sivuston yleiskuvan rakentamista
  • Hämärtää käyttäjän kuvaa sivuston tilasta
  • Säästää ruututilaa vääristä syistä

« Takaisin blogilistaukseen