Kun verkkosivusto leviää hyvin laajaksi ja aineistoiltaan kirjavaksi, on turhan mutkikasta yrittää rakentaa sen sivujen rakenteista yhtä eheää hierarkiapuuta. Tällöin on hyödyllistä hahmotella verkkosivustoa, joka on kokoelma suhteellisen itsenäisiä pikkusivustoja. Satelliittimalli on keksitty nimitys navigointimekanismille, jossa verkkosivuston itsenäiset pikkusivustot kootaan yhteen teemasivujen avulla eikä puuhierarkialla.
North Patrol on suunnitteluun erikoistunut konsulttitoimisto. Suunnittelemme, autamme teknologiavalinnoissa, kilpailutamme. Emme myy toteutusprojekteja, emmekä lisenssejä, olemme aidosti asiakkaan puolella.
19.6.2023
Esittelyssä seitsemän eri valikkomallia
Tämä juttu kuuluu artikkelisarjaan, jossa esitellään seitsemän erilaista mekanismia verkkosivuston navigointivalikoiden muodostamiseksi sivuston sivujen keskinäisen rakennehierarkian (tai jonkin metatietoluokittelun) pohjalta.
Esitellyt navigointimallit perustuvat North Patrolin luomaan protomalliin, joka demonstroi käytännössä sitä, millä tavoin verkkosivuston sisällöt hahmottuvat eri navigointimallien kautta.
Satelliittimallin pikkusivustot sidotaan yhteen teemasivuilla
”Satelliittimallissa” on kantavana ideana se, että verkkosivusto muodostuu lukuisista itsenäisistä pikkusivustoista – näitä pikkusivustoja voi olla vaikkapa sadoittain.
Kukin pikkusivusto on nimensä mukaisesti pikkuinen kokonaisuus, joka koostuu vain yhdestä äitisivusta ja sen lapsisivuista. Lapsisivuja voi olla vaikkapa vain muutama, mutta simppeliin malliin mahtuu kyllä jopa parikymmentä lapsisivua.
Pikkusivustolla näytetään äiti- ja lapsisivuista sivunavigaatiovalikko. Koska sivusto on pieni, yhteen asiaan keskittyvä kokonaisuus, jossa on vain yksi syvyystaso, pysyy navigaatiovalikko väkisinkin selkeänä, seurattavana ja hyvin käyttäjää opastavana.
Pikkusivustojen kesken ei tuoteta väkisin keskinäistä puuhierarkiaa, vaan pikkusivusto saa elää sellaisenaan yhden asian itsenäisenä kokonaisuutena sivustolla.
Käyttäjät ohjataan löytämään pikkusivustot teemasivujen kautta. Yksittäinen teemasivu kertoo jostakin laajemmasta aihepiiristä, ja teemasivulle on linkitetty kaikki ne pikkusivustot, joiden voidaan katsoa liittyvän tähän aiheeseen.
Pikkusivusto ei siis kuulu rakennehierarkiassa jonkin teeman alle, vaan sama pikkusivusto voidaan linkittää moneen teemaan.
Havainnemallissa pikkusivusto ”Pyöräily” on kompakti tietokokonaisuus. Pikkusivuston 10 alasivulta löytyvät näpsäkästi kaikki tiedot, joita tämä verkkopalvelu tarjoaa pyöräilyn aiheesta.
Jos käyttäjä laskeutuu yhdelle sivulle kokonaisuudessa Pyöräily, on navigointivalikon avulla helppoa hahmottaa kaikki pyöräilytiedot ja siirtyä jollekin toiselle sivulle, josta etsitty pyöräilytieto löytyy.
Käyttäjälle pikkusivuston navigointimekanismi on ihanteellinen:
- valikko auttaa hahmottamaan pikkusivuston kokonaisuuden ja sisällöt
- valittuna oleva kohta (= oma sijainti sivustolla) erottuu selkeästi
- valikosta on helppoa ja tehokasta siirtyä pikkusivuston toiselle sivulle
- valikko on erittäin hyvin ymmärrettävä, kun siinä on vain yksitasoinen hierarkia.
Mutta jos verkkopalvelussa nyt sitten on vaikka kaksi sataa tällaista pikkusivustoa, kuinka käyttäjä ohjataan löytämään ne?
Jos verkkopalvelulle rakennettaisiin perinteinen puuhierarkia (vaikkapa kumuloituvaa sivuvalikkoa, suppilomallia tai hybridimallia varten) olisi päätettävä, mihin rakennehaaraan ”Pyöräily” kuuluu: onko se Ulkoilua vai Liikuntaa vai Liikennettä? Entä kun se on näitä kaikkia??
Satelliittimallin ideana on se, että pikkusivusto saa kaikessa rauhassa ”kuulua” kaikkiin noihin rakennehaaroihin yhtäläisesti.
Teemasivut ohjaavina linkkilistoina
Satelliittimalli muistuttaa hybridimallia siinä mielessä, että navigointimekanismi hyödyntää kahta erilaista sivutyyppiä:
- teemasivuja, jotka ovat lähinnä linkkilistoja ja
- sisältösivuja, joille muodostuu sivunavigaatiovalikko niiden rakennehierarkian mukaan.
Ylätasolla käyttäjää ohjataan teemasivuilla, jotka esittelevät verkkopalvelusta löytyviä pikkusivustoja. Teemasivujen otsikko kuvaa jonkin aihekokonaisuuden, joka on käyttäjälle intuitiivista ymmärtää.
Ihannetapauksessa teeman sisältörajaus ja otsikointi tehdään valitsemalla käyttäjille tuttuja, arkisia sanoja – kuten vaikkapa Liikunta tai Liikenne.
Teemasivu voi antaa käyttäjälle informatiivisia tekstejä kyseisestä aiheesta, tai teemasivu voi keskittyä tarjoamaan käyttäjälle linkkejä pikkusivustoille. Linkkien esittämistavoissa voidaan hyödyntää kaikenlaisia taittotyylejä yksinkertaisista tekstipohjaisista linkkilistoista kuvallisiin ”linkkikortteihin”.
Kun teemasivulla on paljon linkkejä, ne on syytä ryhmitellä ja erotella visuaalisesti toisistaan vaikkapa väliotsikoiden avulla. Näin voidaan pitkätkin linkkilistat pitää helposti silmäiltävinä: käyttäjä antaa katseensa lipua väliotsikosta toiseen, ja navigoi täten kohti sitä pikkusivustoa, joka omassa tilanteessa kiinnostaa.
Kun teemasivu ”Liikunta” luodaan käsin muokkaamalla, siihen voidaan toimittaa vapaasti linkit kaikkiin niihin pikkusivustoihin, joita käyttäjän voidaan kuvitella etsivän liikunta-aiheesta.
Sama pikkusivusto (”Pyöräily”) voidaan linkittää moneen teemaan, ja teemasivulla voidaan tarpeen mukaan näyttää linkkejä myös pikkusivustojen alasivuille (”Pyöräilykartat”).
Modulaarisuutta sitovan puuhierarkian välttämisellä
Satelliittimallin vahvuus on sen joustava modulaarisuus. Teemasivuille voidaan valita vapaasti juuri sellaiset aiheet, jotka puhuttelevat käyttäjiä, eikä pikkusivustojen kesken tarvitse rakentaa väkinäisesti suurta, eheää puurakennetta.
Uusia aiheita, näkökulmia ja teemoja on helppoa tuottaa, kun ne eivät ole sidottuina sivujen jäykkään rakennehierarkiaan.
Uusia pikkusivustoja on helppoa lisätä palveluun, kun niille ei tarvitse etsiä paikkaa rakennehierarkiasta, vaan ne voidaan lisätä vain linkittämällä relevanteille teemasivuille.
Teemasivujen tuottaminen vaatii kuitenkin toimitustyötä. Koska pikkusivustot eivät ole hierarkkisessa suhteessa teemoihin, ei linkkejä teemasivuille voida generoida automaattisesti.
Ongelmana hallittavuus
Teemasivujen manuaalinen toimittaminen vaatii sisällöntuottajalta/ylläpitäjältä sitä, että kokonaisuuden punainen lanka pysyy kirkkaana.
Kun verkkopalveluun luodaan uusi pikkusivusto, se ei näy missään ennen kuin se on linkitetty jollekin teemasivulle.
Teemasivujen kirjoittajan täytyy hahmottaa, millaisia kokonaisuuksia verkkopalvelun teemat muodostavat, ja mille pikkusivustoille on syytä ohjata mistäkin teemasta. Teemasivujen konsepti ja rajausperiaatteet on tehtävä selviksi kaikille sisällöntuottajille.
Linkkien näkyvyydestä teemasivuilla ei saa muodostua taistelutannerta, jonne jokainen pikkusivuston omistaja haluaa saada oman sivustonsa näkyville mahdollisimman näyttävästi. Tarpeelliset linkitykset on suunniteltava hallitusti käyttäjän näkökulman mukaan.
Teemasivujen kesken on mahdollista luoda hierarkioita, esimerkiksi ”Liikenne”-teemasivulle voidaan luoda alasivuiksi vaikkapa teemat ”Tieliikenne”, ”Raideliikenne” ja ”Vesiliikenne”.
Tässä tarpeessa on kuitenkin arvioitava huolellisesti, mitä sillä saavutetaan. ”Tieliikenne”- ja ”Raideliikenne”-teemasivuista syntyy varmasti lyhyempiä ja helpommin silmäiltäviä linkkilistoja, mutta päädytäänkö käyttäjää ohjaamaan turhauttavasti yhdeltä linkkilistasivulta toiselle linkkilistasivulle? (Tätähän problematisoitiin jo hybridimallin käsittelyssä.) Kannattaisiko ”Tieliikenne”-teeman pikkusivustot kuitenkin linkittää omana ryhmänään ”Liikenne”-teemasivulle, jotta kaikki liikenneasiat löytyvät yhdestä paikasta?
Osion etusivua ei synny
Kun käyttäjä klikkaa malliesimerkissä päänavigaation kohtaa ”Satelliitti”, tästä ei seuraa siirtymää osion etusivulle, vaan pudotusvalikon avaaminen. Käyttäjä siis ohjataan valitsemaan jokin pudotusvalikossa näkyvistä teemasivuista.
Malliesimerkissämme päänavigaatiossa näkyvälle sanalle ”Satelliitti” ei siis ole tätä vastaavaa verkkosivua: kaikki valikossa näkyvät teemasivut ovat rakenteen ”ykköstasolla”.
Malliesimerkissämme tämä onkin ihanteellinen ratkaisu. Jos sivustolle luotaisiin jokin ylätasoinen ”Satelliitti”-osion pääsivu, sivun sisällöstä tulisi aika mitätöntä: joko se toistaisi pudotusvalikossa näkyvät linkit teemasivuille, tai se vetäisi jotenkin valikoidusti yhteen kaikkien teemasivujen tärkeimmät linkit pikkusivustoille. Käyttäjän kannalta on selkeämpää nähdä tarjolla olevat teemat valikosta.
Jos ”Satelliitti”-osiolle haluttaisiin kuitenkin luoda jokin oma etusivu laskeutumissivuksi, on se mahdollista. Linkitys osion etusivulle voidaan esittää vaikkapa hyödyntämällä ”kahta klikattavaa kohtaa” päävalikossa (kuten 2-D-mallissa) tai luomalla teemasivut esittelevään pudotusvalikkoon ensimmäiseksi klikattavaksi kohdaksi linkki ”Satelliitti-etusivu”.
Satelliittimalli soveltuu kuitenkin parhaiten laajalle, moniaineksiselle sivustolle, jossa on paljon sisältöjä kirjavista erilaisista aiheista. Tällaisessa palvelussa on harvoin hyötyä kovin ylätasoisista yhteenvetosivuista – ”Satelliitti-etusivu” ei ehkä palvelisi yhtäkään käyttäjää eikä auttaisi sivustolla navigoinnissa.
Pikkusivustoille äärimmäisen selkeä navigointivalikko
Mallinnetussa ”Satelliittiratkaisussa” on lähdetty siitä periaatteesta, että jokainen pikkusivusto on mahdollisimman selkeästi hahmotettavissa ja navigoitavissa.
Kun käyttäjä laskeutuu mille tahansa pikkusivuston sivulle vaikkapa Googlen hakutuloksista, some-artikkelista, uutiskirjeestä tai muusta linkistä, hän pystyy välittömästi hahmottamaan, että hän on ”Pyöräily”-kokonaisuuteen kuuluvalla sivulla, ja muut pyöräilyaiheiset sivut ovat esillä sivunavigointivalikossa.
Pikkusivustolla liikkuminen ja pyöräilyaiheisen tiedon etsiminen sujuu siis ihanteellisesti hyödyntämällä selkeää sivunavigaatiovalikkoa.
Satelliittimallia on mahdollista soveltaa myös siten, että pikkusivustoilla on syvempiä hierarkiarakenteita. ”Pyöräilykartat”-sivulle voidaan luoda alasivuja, ja sivunavigaatiovalikko voidaan muodostaa indikoimaan syvempiä hierarkoita. Tällöin kuitenkin törmätään samoihin ongelmiin kuin standardivalikoiden muodostamisessa, ja pikkusivustojen selkeys kärsii. Sivuvalikko alkaa ohjata tulkintaa liiaksi, ja satelliittimallin muiden pikkusivustojen olemassaolo ei nouse esille.
Muiden pikkusivustojen löydettävyys onkin satelliittimallin riskikohtana. Mitä tapahtuu, kun käyttäjä haluaisi löytää jotain muita liikenne- tai liikuntasivustoja kuin tämän ”Pyöräily”-sivuston? Murupolku tai sivunavigaatiovalikko ei indikoi Pyöräily-sivustolle mitään kontekstia, joten käyttäjän on älyttävä siirtyä käyttämään päänavigaatiovalikkoa ja sieltä avattavia teemasivuja.
Fiksu sisällöntuottaja osaa myös ennakoida käyttäjän tarpeita ja tajuaa tarjota käsin toimitettuja jatkolinkkejä oman pikkusivustonsa sivujen lopussa. Pyöräilykartat-sivun loppuun kannattaa luoda linkkejä muille karttasivustoille tai vaikka kauneimpien luontokohteiden esittelysivustolle?
Mallissa esitetty rakennehierarkia
Protomallin Satelliitti-osio pysyy modulaarisena, selkeänä ja seurattavana sen ansiosta, että koko puurakenteessa on vain kaksi hierarkiatasoa!
Kun Satelliitti-osion etusivua ei ole, ovat kaikki teemasivut (Liikunta, Liikenne jne.) rakenteen ykköstasoa. (Tämä heijastuu esim. murupolkuun.)
Koska pikkusivustoja ei pakoteta puurakenteeseen teemasivujen alle, ovat myös pikkusivustojen etusivut rakenteen ykköstasoa. ”Pyöräily”-äitisivu on suoraan koko palvelun etusivun alla, mikä näkyy myös murupolussa.
Esimerkkimallissa ainoastaan pikkusivustojen alasivut (kuten Pyöräilykartat) ovat rakennehierarkian kakkostasolla, ja kun pikkusivustojen navigointivalikot pidetään matalina, ei koko sivustolla ole tätä syvempiä hierarkiatasoja.
Esimerkkimallissa siis sivut ”Hybridi”, ”Liikenne” ja ”Pyöräily” ovat kaikki samalla hierarkiatasolla:
Mikäli käytössä olevan julkaisujärjestelmän ylläpitonäkymissä korostuvat sivujen keskinäiset hierarkkiset suhteet, on tämä rakennehierarkian äärimmäinen mataluus epäilemättä sisällöntuottajille vaikeasti hahmotettava.
Jos satelliittimallin verkkopalvelussa on ne parisataa pikkusivustoa, on myös rakennehierarkian ykköstasolla yli parisataa sivua. Ei tästä välttämättä seuraa mitään suurempaa ongelmaa, mutta sisällöntuottajia on syytä pitää tukevassa ohjauksessa, ettei lättänästä hierarkiasta lähdetä lipsumaan, kun rakenteen leveys paisuu valtavaksi.
Ehkä juuri tämän kurinalaisuuden vaatimuksen vuoksi satelliittimallia ei ole kovin paljon julkisissa verkkopalveluissa näkynyt.
Microsoftin M365-ympäristöön sisältyvät modernit SharePoint-sivustot ja näiden sitominen yhteen hub-sivustoilla voidaan kyllä tulkita yhdeksi satelliittimallin sovellutukseksi.
Satelliittimalli soveltuu hyvin…
- Laajoihin verkkopalvelukokonaisuuksiin, joihin on vaikeaa luoda yksiselitteistä puuhierarkiaa.
- Kun verkkopalvelussa tarjotaan hyvin kirjavia, moniaineksisia sisältöjä.
Ongelmakohtia ovat…
- Rakenteen hallittavuus ylläpidossa.
- Teemasivujen manuaalinen ylläpito: linkkejä pikkusivustoille ei voida generoida automaattisesti.
Artikkelisarja navigaatiomekanismien malleista
Esittelyssä seitsemän eri valikkomallia:
PS. Sinua voisi kiinnostaa tulossa oleva ilmainen webinaarimme: Parhaat muotoiluratkaisut tuote- ja palvelusivuille (15.5.2024 klo 10:00). Ilmoittaudu webinaariin
