Linkit

Mikä on linkki?

Linkit ovat siirtymiä. Linkki voi siirtää asiakkaan palvelun sisällä uuteen näkymään, toiseen kohtaan saman näkymän sisällä (ns. ankkurilinkki) tai kokonaan uuteen palveluun.

KDS tarjoaa erilaisiin tarpeisiin erilaisia linkkikomponentteja

• Tavallinen tekstilinkki sopii käytettäväksi silloin, kun linkkiä ei ole tarpeen erityisesti korostaa. Tavallista linkkiä voi käyttää myös leipätekstin seassa.
• Korostettu linkki sopii tilanteisiin, joissa linkin tulee kiinnittää asiakkaan huomio.
• Linkki lisätietotekstillä sopii käytettäväksi silloin, kun linkin yhteydessä halutaan antaa lisätietoa sen sisällöstä.

Linkkien nimeäminen

Nimeä linkit kuvaavasti ja napakasti. Asiakkaan tulee ymmärtää, mihin linkki johtaa ja mitä tietoa sen takaa löytyy. Jos linkit muodostavat listan tai ryhmän, nimeä kaikki ryhmässä olevat linkit samalla tyylillä.

Olennaisiin avainsanoihin perustuva nimeäminen helpottaa sisällön silmäilyä. Myös ruudunlukijan käyttäjälle tärkeää, että linkistä toiseen liikkuminen käy sujuvasti. Linkkitekstin ymmärtäminen ei tällöin edellytä esimerkiksi linkkiä ympäröivän tekstin lukemista.

Jos linkki johtaa verkkopalvelun ulkopuolelle, siirtymän tulee käydä ilmi linkkitekstistä. Voit esimerkiksi mainita linkissä sivuston nimen tai www-osoitteen. Älä kuitenkaan käytä linkkitekstinä pelkkää www-osoitetta.

Milloin linkki, milloin painike?

Lähtökohtaisesti linkit ovat siirtymiä ja painikkeet käynnistävät toimintoja. Joskus asiakkaan kannalta merkittävä toiminto voi kuitenkin olla pelkkä siirtymä. Seuraavassa ohjeita näiden tilanteiden ratkaisemiseksi.

Prosessia eteen- ja taaksepäin vievät painikkeet

Painikkeet ovat asiakkaan kannalta usein käyttöliittymän keskeisimpiä elementtejä. Painikkeiden avulla asiakas voi suorittaa asiointiprosessiin liittyviä toimintoja ja liikkua ohjatusti prosessin eri vaiheiden välillä.

Jos siirtymä vaikuttaa ratkaisevasti asiakkaan prosessin etenemiseen, siirtymä kannattaa yleensä esittää linkin sijaan toimintoa kuvaavalla painikkeella. Siirtymä näyttäytyy siten visuaalisesti samanarvoisena muiden keskeisten toimintojen kanssa.

Esimerkiksi prosessissa eteenpäin ohjaava siirtymätoiminto kannattaa yleensä esittää Seuraava-painikeen avulla.

Näissä tilanteissa voidaan käyttää painiketta eli <button>-elementtiä, joka ohjaa käyttäjää prosessissa eteenpäin. Painike sopii yhteen muiden asiakkaalle esitettävien toimintopainikkeiden kanssa ja muodostaa selkeän ja loogisen kokonaisuuden.

Painikkeen voi toteuttaa tilanteesta riippuen hieman eri tavalla. Huomioi, että <a>-elementti ja <button>-elementti toimivat eri tavoin näppäimistöllä. Painikkeen voi valita välilyönnillä tai enterillä, mutta linkki toimii vain enterillä. Varmista siis, että painikkeet toimivat loogisesti molemmilla näppäimillä. Muista myös, että ruudunlukijan käyttäjän täytyy saada tieto siitä, että näkymä on vaihtunut.

Call to action -linkit

Asiakkaan kannalta tärkeät yksittäiset linkit voi esittää niin sanottuina call to action -linkkeinä. Linkin ulkoasu on samanlainen kuin ensisijaisella painikkeella. Visuaalisesti erottuvan cta-linkin tarkoituksena on ohjata asiakkaan huomio hänen kannaltaan olennaisiin toimintoihin. Cta-linkkejä käytetäänkin esimerkiksi tärkeissä nostoelementeissä.

Vaikka cta-linkit näyttävät painikkeilta, koodissa näiden tulee olla linkkejä. Tällöin ruudunlukijat saavat tiedon siirtymästä. Kiinnitä huomiota myös cta-linkin tekstiin. Asiakkaan pitäisi tekstisisällön perusteella ymmärtää, että linkki siirtää hänet toiseen näkymään.

Jos toiminnon tyyppinä on siirtymä, cta-linkeissä käytetään nuolikuvaketta tekstin oikealla puolella. Jos cta-linkki käynnistää toiminnon, kuvaketta ei käytetä. Lue lisää kuvakkeiden ja ikonien käytöstä.

Huomioi, että samassa näkymässä ei kannata käyttää useita cta-linkkejä, vaan ne sopivat lähinnä vain yksittäisiksi nostoiksi. Jos haluat korostaa useampaa linkkiä tai kokonaista linkkilistaa, käytä mieluummin korostettua linkkiä (LinkBox).

Uuteen välilehteen avautuvat linkit

Oletuksena linkit avataan Kelan ja Kannan palveluissa samaan välilehteen.

Uuteen välilehteen avautuvat linkit ovat usein ongelmallisia esimerkiksi ruudunlukijan käyttäjille ja kognitiivisista rajoitteista kärsiville ihmisille. Siksi linkit kannattaa avata uuteen välilehteen vain erityisistä syistä.

Tilanteet, joissa linkin voi avata uuteen välilehteen:

• Asiakas on tunnistautunut
  Linkin voi ohjata avautumaan uuteen välilehteen esimerkiksi tilanteessa, jossa linkin avaaminen samaan välilehteen johtaisi asiakkaan kirjaamiseen ulos palvelusta (ja palaaminen ei ole mahdollista selaimen takaisin-komennolla) tai jos vaarana on, että asiakas unohtaa itse kirjautua ulos palvelusta. Pyri varmistamaan, että asiakkaan istunto katkeaa automaattisesti selaimen sulkemiseen tai aikakatkaisuun. Muussa tapauksessa linkit kannattaa avata uuteen välilehteen.
• Asiakas menettää syöttämänsä tiedot
  Jos linkin avaaminen samaan välilehteen aiheuttaisi sen, että asiakas menettää sivulle syötetyt tiedot, linkki kannattaa mieluummin avata uuteen välilehteen.
• Selaimen takaisin-toiminto ei toimi
  Kaikissa palveluissa selaimen takaisin-toiminto ei välttämättä toimi tavanomaisesti, jolloin käyttäjä ei pääse palaamaan aikaisemmalle sivulle. Pyri mahdollistamaan selaimen takaisin-toiminnon käyttö palvelussa. Muussa tapauksessa linkit kannattaa avata uuteen välilehteen.

Älä koskaan avaa linkkiä uuteen välilehteen vain varmuuden vuoksi. Käyttäjä voi kuitenkin itse halutessaan avata linkin uudella välilehdellä.

Varmista, että linkkien avautuminen uusille välilehdille noudattaa asiakkaan näkökulmasta johdonmukaista logiikkaa.

Uuteen välilehteen avautuva linkki merkitään kuvakkeella ja sitä kuvaavalla piilotetulla tekstiselitteellä. Näin tieto linkin tyypistä välittyy myös ruudunlukijan käyttäjälle.