Blogi

Ovatko verkkosivujen pop-upit saavutettavia?

Kirjoittanut Loihde | 04.06.2025


Pop-upit eli ponnahdusikkunat ovat yleinen tapa näyttää lisäsisältöä verkkosivuilla. Niistä on tullut verkkopalveluiden käyttäjille myös “pakollinen paha” evästekyselyiden myötä.  Lisäksi myös esimerkiksi ostokehotteet, mainokset ja chat-palvelut saattavat toimia pop-up –ikkunoina. Törmäämme siis ponnahdusikkunoihin jatkuvasti verkkopalveluita käyttäessämme, mutta ovatko pop-upit saavutettavia kaikille käyttäjille? Saavutettavuusasiantuntijamme kokosi yhteen vinkit asioista, jotka verkkopalveluita kehittäessä kannattaa huomioida pop-upien saavutettavuuden osalta. 

 

Mitä pop-upeissa pitää huomioida saavutettavuuden kannalta? 

Vältä turhaan yllättäviä pop-upeja.  

Mikäli sivustolla on paljon itsekseen avautuvia pop-upeja, käyttökokemus kärsii. Jos ponnahdusikkuna ilmaantuu hoverilla tai fokuksella, sisältö ei saa kadota eikä jäädä auki ilman sulkumahdollisuutta. Ponnahdusikkuna ei saa estää muuta käyttöä tai rikkoa kohdistusjärjestystä. 

 

Kerro käyttäjälle, mitä on tapahtumassa.

Linkin tai painikkeen pitää kertoa, että sisältö avautuu ponnahdusikkunaan. Esimerkiksi “Näytä taulukko (avautuu ikkunaan)”. 
 
Pop-upin tulee olla käytettävissä näppäimistöllä.

Jos toiminto vaatii hiirtä, se ei ole saavutettava – ei pelkästään ruudunlukijan käyttäjälle, vaan myös näppäimistö- ja kytkinlaitteiden käyttäjille. 
 

Tuo fokus pop-upin sisään.  

Kun pop-up avautuu, kohdistaminen täytyy siirtyä sen sisälle, ja sulkemisen jälkeen palautua järkevästi takaisin alkuperäiseen paikkaan. Fokus ei saa karata taustalle. Käyttäjän ei tule voida vahingossa navigoida pop-upin ulkopuolelle ennen sen sulkemista  
 
Ikkunan sulkemisen on oltava helppoa.

Pop-upin sulkemiseen on annettava tapa, joka toimii kaikilla saavutettavuusvaatimusten mukaisilla metodeilla, esim. pelkällä näppäimistöllä. Esimerkiksi Esc-nappulan käyttö pop-upin sulkemiseen on vakiintunut käytäntö.Mielellään myös klikkaus pop-upin ulkopuolelle sulkee sen, mutta tämä ei saa olla ainoa keino, sillä se ei ole kaikille saavutettava. 
 

Muista kertoa apuvälineille, että kyseessä on erillinen ikkuna. 

Kun sivulle avautuu ponnahdusikkuna (kuten modaali tai dialogi), ruudunlukijan käyttäjän on tärkeää tietää, että näkymä on muuttunut. Tämän voi varmistaa merkitsemällä ikkunan oikein: sille annetaan tekninen "rooli" ja selkeä otsikko, jotta käyttäjä tietää missä on ja miksi. Näin varmistat, että esimerkiksi tilausvahvistus tai virheilmoitus ei jää huomaamatta näytönlukijaa käyttävältä.

 

Kontrastit ja luettavuus kuntoon.

Kaikkien tekstien ja elementtien kontrastien tulee täyttää vähintään AA-tason vaatimukset. 
 

Sisältö ei saa kadota liian nopeasti.

Jos jotain näkyy hoverilla tai fokuksella (esim. vinkki tai tieto), sen pitää pysyä näkyvissä niin kauan, että käyttäjä ehtii käsitellä sen. 

Hyvä pop-up ei ole vain visuaalisesti näyttävä, vaan ennakoitava, hallittava ja saavutettava kaikille käyttäjille. Noudattamalla saavutettavuusohjeita varmistetaan, että myös näppäimistökäyttäjät, ruudunlukijan käyttäjät ja monet muut voivat käyttää palvelua sujuvasti.