Sivuston valikot ja sivurakenne kuntoon Silverstripessä

Verkkosivuston sisältö voi olla hyödyllistä ja hyvin kirjoitettua, mutta kävijä ei saa siitä apua, jos oikea sivu jää löytämättä. Selkeä navigaatio kertoo, mitä sivustolta löytyy ja miten sen eri osat liittyvät toisiinsa.

Silverstripe CMS:ssä sivujen järjestämisen lähtökohtana on sivupuu. Sen avulla määritellään pääsivut, alasivut ja niiden keskinäinen järjestys. Julkisen sivuston valikot puolestaan muodostuvat sivupohjien ja mahdollisten erillisten valikkotoimintojen mukaan.

Tässä oppaassa käydään läpi, miten suunnittelet ymmärrettävän rakenteen, järjestät sivut hallinnassa ja tarkistat muutosten vaikutukset. Ohjeiden painikkeet ja kenttien nimet voivat vaihdella sivustosi toteutuksen, käyttöliittymän kielen ja Silverstripe-version mukaan.

Aloita kävijän tarpeista

Ennen sivujen siirtämistä mieti, mitä ihmiset tulevat sivustolle tekemään. Yrityksen asiakas saattaa etsiä palvelun hintaa, yhdistyksen jäsen tapahtuman ajankohtaa ja uusi työnhakija avoimia työpaikkoja.

Kirjaa tärkeimmät käyttötarpeet esimerkiksi näin:

• Haluan tietää, mitä palveluita tarjotaan.
• Haluan löytää yhteystiedot.
• Haluan tutustua toimintaan.
• Haluan lukea ajankohtaiset tiedotteet.
• Haluan ilmoittautua tapahtumaan.

Ryhmittele sisältö näiden tarpeiden ympärille. Organisaation sisäinen osastojako ei välttämättä ole kävijälle tuttu tai hyödyllinen.

Jos käyttäjä joutuu arvaamaan, kuuluuko asia hallintoon, kehitykseen vai asiakkuuksiin, valikko palvelee enemmän organisaatiota kuin asiakasta. Suosi sanoja, joiden merkitys selviää ilman taustatietoja.

Erota sivupuu ja julkinen valikko

Silverstripen sivupuu kuvaa sivujen hierarkiaa. Julkinen navigaatio ei kuitenkaan välttämättä näytä koko puuta sellaisenaan.

Sivupohja voi muodostaa päävalikon ylimmän tason sivuista ja näyttää alasivut erillisessä alavalikossa. Alatunnisteen linkit voivat puolestaan olla kokonaan erikseen määritettäviä.

Silverstripen sivupohjissa on navigaation rakentamiseen toimintoja, joilla kehittäjä voi hakea esimerkiksi tietyn tason valikkosivuja ja sivun lapsisivuja. Lopullinen esitystapa riippuu toteutuksesta. Silverstripen sivupohjien muuttujat.

Jos siirrät sivua hallinnassa eikä julkinen valikko muutu odotetusti, selvitä ensin valikon toimintatapa. Sivustolla voi olla oma valikkoeditori tai rajaus, joka ohittaa tavallisen sivupuun järjestyksen.

Suunnittele selkeä pää- ja alasivujen jako

Päävalikon tehtävänä on esitellä sivuston tärkeimmät kokonaisuudet. Sen ei tarvitse sisältää suoraa linkkiä jokaiseen yksittäiseen sisältöön.

Pienen palveluyrityksen rakenne voisi näyttää tältä:

• Palvelut.
• Hinnasto.
• Yritys.
• Ajankohtaista.
• Yhteystiedot.

Palvelut-sivun alle voidaan sijoittaa esimerkiksi Suunnittelu, Asennus ja Huolto. Yritys-sivun alla voivat olla Henkilöstö ja Referenssit.

Tavoitteena on, että jokaiselle sivulle löytyy perusteltu paikka. Jos sama sisältö tuntuu kuuluvan useaan osioon, valitse sille yksi varsinainen sijainti ja linkitä siihen muualta.

Vältä tarpeettoman syviä ketjuja. Useiden välisivujen kautta kulkeminen voi vaikeuttaa yksinkertaisenkin tiedon löytämistä. Toisaalta kaikkien sivujen nostaminen päätasolle tekee valikosta helposti raskaan.

Luo uusi sivu oikeaan kohtaan

Avaa hallintapaneelista Pages ja valitse uuden sivun lisääminen. Sivua luodessa voit yleensä valita päätason tai olemassa olevan sivun alaisen sijainnin.

Tavallisia vaihtoehtoja ovat:

• Top Level: sivuston päätaso.
• Under another page: valitun sivun alasivu.

Valitse samalla sisällölle sopiva sivutyyppi. Tavallinen palvelukuvaus voi käyttää yleistä sisältösivua, mutta joissakin toteutuksissa palveluille on oma sivutyyppinsä. Silverstripen sivunluontiohje.

Älä tee uutta pääsivua automaattisesti jokaiselle uutiselle tai kampanjalle. Mieti ensin, kuuluuko sisältö olemassa olevan kokonaisuuden alle.

Kun paikka valitaan heti oikein, myöhempi osoitteiden ja linkitysten muuttaminen vähenee.

Muuta sivujen järjestystä hallitusti

Silverstripen sivupuussa sivuja voidaan järjestää vetämällä. Sivun pudottaminen kahden muun väliin muuttaa järjestystä, kun taas pudottaminen toisen sivun päälle voi siirtää sen kyseisen sivun alasivuksi.

Seuraa siirron osoittimia tarkasti. Pelkkä pieni hiiren liike voi tarkoittaa eri toimintoa kuin oli tarkoitus.

Silverstripen ohjeen mukaan muuttunut sijainti ja järjestys tuodaan julkiseksi julkaisemalla siirretty sivu. Tarkista ennen julkaisua myös mahdolliset muut keskeneräiset sisältömuutokset. Sivurakenteen järjestäminen.

Tee ensimmäisellä kerralla yksi muutos ja tarkista tulos. Useiden sivujen siirtäminen kerralla vaikeuttaa sen selvittämistä, mistä odottamaton muutos johtui.

Laajemmasta uudistuksesta kannattaa tehdä suunnitelma ennen hallinnassa työskentelyä.

Vaihda sivun sijaintia asetuksista

Vetäminen ei ole ainoa tapa siirtää sivua. Voit avata muokattavan sivun Settings-välilehden ja etsiä Page location -asetuksen.

Sen kautta valitaan, sijaitseeko sivu päätasolla vai jonkin toisen sivun alla. Tarkista valittu yläsivu ja julkaise muutos, kun kokonaisuus on valmis. Silverstripen sivun sijaintiasetus.

Asetusten kautta siirtäminen voi olla helpompaa suuressa sivupuussa, jossa oikeaan kohtaan vetäminen on hankalaa.

Varmista siirron jälkeen, että sivu kuuluu sisällöllisesti uuteen osioon. Esimerkiksi huolto-ohjetta ei kannata sijoittaa ajankohtaisten uutisten alle pelkästään siksi, että se on juuri kirjoitettu.

Kirjoita valikkotekstit ymmärrettävästi

Sivun otsikon ja valikkotekstin ei tarvitse olla identtisiä. Pitkä otsikko voi toimia sisältösivulla, mutta navigaatiossa lyhyempi muoto helpottaa lukemista.

Esimerkiksi otsikko ”Tietokoneiden huolto ja korjaus yrityksille” voidaan lyhentää valikossa muotoon ”Tietokonehuolto”.

Silverstripessä navigaation nimike voidaan määritellä erikseen sivun nimestä. Myös osoitteen loppuosa on oma tietonsa. Silverstripen nimeämisohje.

Hyvä valikkoteksti on:

• Riittävän lyhyt.
• Sisältöä kuvaava.
• Erottuva muista valinnoista.
• Kävijälle tuttu.
• Yhdenmukainen muun navigaation kanssa.

Vältä useita lähes samannimisiä kohtia, kuten ”Palvelut”, ”Palvelumme” ja ”Palveluratkaisut”. Käyttäjän pitäisi ymmärtää valintojen ero ennen niiden avaamista.

Piilota valikosta vain perustellusti

Kaiken julkaistun sisällön ei tarvitse näkyä päävalikossa. Esimerkiksi kampanjasivu voidaan avata mainoksesta, ja tietosuojaselosteeseen voidaan linkittää alatunnisteesta.

Silverstripen sivuasetuksissa Show in menus? ohjaa tavallisen valikkonäkyvyyden asetusta. Poista valinta tarvittaessa ja julkaise muutos. Oman sivuston valikkototeutuksen täytyy kuitenkin huomioida kyseinen asetus.

Valikosta piilotettu sivu voi edelleen avautua suoralla osoitteella. Piilottaminen ei siis tee sisällöstä yksityistä. Silverstripen valikkonäkyvyyden ohje.

Jos sivua ei saa enää näyttää kävijöille, tarvitaan eri toimenpide. Julkaisun peruuttaminen säilyttää sivun luonnoksena ja poistaa sen julkaistun version käytöstä. Julkaisun peruuttaminen.

Huomioi osoitteet rakennetta muuttaessa

Sivuston osoitteet voivat seurata sivupuun hierarkiaa. Tällöin esimerkiksi Huolto-sivun siirtäminen Palvelut-osion alta toiseen kohtaan voi muuttaa sen osoitetta.

Silverstripe tukee toteutuksesta riippuen sekä yksinkertaisia että hierarkkisia osoitteita. Selvitä oman sivustosi käytäntö ennen siirtoja. Silverstripen osoiterakenteen kuvaus.

Kirjaa tärkeiden sivujen vanhat osoitteet talteen. Tarkista muutoksen jälkeen, että ne johtavat oikeaan sisältöön, ja järjestä tarvittavat uudelleenohjaukset.

Muista myös:

• Sivujen sisäiset linkit.
• Uutiskirjeissä jaetut osoitteet.
• Mainosten kohdesivut.
• Ladattavien asiakirjojen linkit.
• Ulkopuolisilla sivustoilla olevat viittaukset.

Älä oleta kaikkien linkkien korjaantuvan automaattisesti. Testaa ainakin sivuston tärkeimmät sisääntuloreitit.

Tee yläsivusta hyödyllinen sisältö

Palvelut-yläsivun ei tarvitse olla tyhjä välietappi. Se voi esitellä vaihtoehdot lyhyesti ja auttaa kävijää valitsemaan sopivan alasivun.

Kirjoita jokaisesta palvelusta muutaman virkkeen kuvaus ja lisää selkeä linkki tarkempiin tietoihin. Näin sivu palvelee myös käyttäjää, joka ei avaa pudotusvalikkoa.

Älä kuitenkaan kopioi alasivujen koko sisältöä yläsivulle. Tiivistelmä ja tarkempi kuvaus palvelevat eri tarkoituksia.

Jos valikkoon tarvitaan suora ohjaus toiseen kohteeseen, Silverstripessä voi olla käytettävissä Redirector Page -sivutyyppi. Se ohjaa kävijän sisäiseen tai ulkoiseen osoitteeseen. Silverstripen sivutyypit.

Kerro ulkoisesta kohteesta tarvittaessa jo linkin nimessä, jotta siirtyminen ei yllätä käyttäjää.

Testaa navigaatio eri käyttötavoilla

Tarkista julkaistu valikko tietokoneella ja puhelimella. Kiinnitä huomiota siihen, avautuvatko alasivut helposti ja mahtuvatko valikkotekstit näkymään.

Kokeile myös näppäimistöä:

1. Siirry valikkoon sarkainnäppäimellä.
2. Tarkista, että kohdistus näkyy.
3. Avaa valikkokohteita näppäimistöllä.
4. Varmista, että pääset alavalikkoon ja sieltä pois.
5. Tarkista, etteivät valinnat jää vain hiiren varaan.

Sisällöntuottaja voi korjata epäselvät nimet ja järjestyksen. Näppäimistötoiminnan tai mobiilivalikon tekniset ongelmat voivat puolestaan vaatia kehittäjän työtä.

Pyydä lopuksi toista ihmistä etsimään sivustolta tietty palvelu tai yhteystieto. Hänen valintansa paljastavat nopeasti, vastaako rakenne kävijän odotuksia.

Pidä rakenne ajantasaisena

Sivurakenne tarvitsee ylläpitoa myös julkaisun jälkeen. Uudet sisällöt, päättyneet palvelut ja vanhentuneet kampanjat muuttavat kokonaisuutta vähitellen.

Sovi, kuka hyväksyy uudet päävalikon kohdat ja milloin rakennetta tarkastellaan. Näin navigaatio ei kasva sattumanvaraisesti jokaisen uuden sisällön mukana.

Hyvä tarkistushetki on esimerkiksi palveluvalikoiman muuttuminen. Käy silloin läpi nimet, sivujen sijainnit ja tärkeimmät linkit. Selkeä rakenne auttaa kävijää löytämään vastauksen ja tekee samalla sisällöntuottajan työstä järjestelmällisempää.