Sisältöön
Synergia Foxy
 

Saavutettavan sivun rakentaminen sisällönsyöttäjän näkökulmasta

Saavutettavuuden idea on, että kuka tahansa pystyy käyttämään verkkopalvelua. Käytön tulee onnistua vaikka ei näkisi, kuulisi, tai pystyisi käyttämään kymmentä sormea sujuvasti. Synergia Foxy –julkaisujärjestelmä huomioi saavutettavuuden niin pitkälle kuin mahdollista:

  • Automatisoiduille kuville annetaan vaihtoehtoiset tekstit (esim. tapahtumissa).
  • Sivun navigaatio on suunniteltu käytettäväksi myös ruudunlukijalla.
  • Lomakkeissa on huomioitu labelit ja muut olennaiset tagit.
  • Lomakkeet hyödyntävät Googlen reCaptchaa (toimii myös heikkonäköisillä ja heikkokuuloisilla henkilöillä).

Huomioi käyttämäsi kieli

Sivustolla käytettävän kielen tulee olla selkeää ja lauseiden tulee olla helposti ymmärrettäviä.

  • Aseta itsesi lukijan asemaan.
  • Tuo keskeisin sisältö heti tekstin alkuun.
  • Käytä mahdollisimman tavallisia ja yleisiä sanoja.

Älä kirjoita tekstiä isoilla kirjaimilla, koska ruudunlukijat saattavat lukea tekstin kirjain kerrallaan. Mikäli teksti halutaan isoilla kirjaimilla, määrittele kappaleen tyyliksi Isot kirjaimet.

Silmäiltävyys

Vältä pitkiä tekstikappaleita. Hyödynnä väliotsikoita, väliviivoja ja listoja. Kappaleet kannattaa pitää parin virkkeen pituisena. Pyri välttämään värillistä tekstiä, koska vierailija voi luulla sitä linkiksi.

Otsikoiden käyttö

Otsikoiden käyttö on tärkeässä roolissa sivulla. Käytä otsikoita hierarkkisesti tyyliin:

  • Otsikko 1 (kullakin sivulla tasan yhden kerran, sivun alussa)
    • Seuraavan tason otsikko (Otsikko 2)
      • Seuraavan tason otsikko (Otsikko 3)
        • Seuraavan tason otsikko (Otsikko 4)
    • Seuraavan tason otsikko (Otsikko 2)

Tärkeää on, ettei otsikkotasoja hypitä yli. Otsikko 1:n jälkeen seuraavan otsikon täytyy olla Otsikko 2, eikä Otsikko 3 tai Otsikko 4.

Otsikoiden tulee olla kuvaavia. Lausemuotoiset otsikot ovat usein paremmin ymmärrettäviä kuin yksittäiset sanat (hyvä otsikko tiivistää siihen kuuluvan keskeisimmän sisällön).


Linkit

Linkitetyn tekstin tulisi kuvata linkin kohdetta, joten vältä Lue lisää -logiikkaa. Ilmoita myös mahdollinen tiedostomuoto linkkitekstissä.

Esimerkki hyvin muotoillusta linkistä:

Katso vuoden 2018 liikevaihto [PDF]
Katso vuoden 2018 liikevaihto täältä

Mikäli linkki ohjaa saman sivuston toiselle sivulle, Avaa linkki samassa välilehdessä. Mikäli linkki ohjaa ulkoiselle sivustolle tai tiedostoon, Avaa linkki uudessa välilehdessä. Vältä Word ja Excel -tiedostoja, koska näiden avaaminen vaatii erillisen ohjelman. Pyri aina tekemään tiedostoista PDF -muotoisia.


Kuvat

Kuvat tekevät tekstistä pääasiallisesti selkeämmän ja luettavamman. Kuvissa on kuitenkin muutamia tärkeitä muistisääntöjä:

  • Lisää kuvalle aina Vaihtoehtoinen teksti (ALT).
  • Älä sisällytä kuvaan tekstiä. Tärkeä tieto tulee olla tekstimuodossa sivulla.
  • Graafit auttavat selkeyttämään sisältöä. Kuitenkin kuvamuotoisten graafien sisältämä tieto tulee olla avattuna tekstimuotoisena sisältöön.Voit myös tehdä graafeista PDF -tiedoston linkin taakse.

Kettu lepää kannon päällä

Esimerkki kuvan vaihtoehtoisesta tekstistä

Yllä olevalle kuvalle on annettu vaihtoehtoinen teksti Kettu lepää kannon päällä, joka kertoo ruudunlukijalle suoraan mistä kuvassa on kyse.


Muuta

Saavutettavuuteen kuuluu myös monia muita asioita (kuten mm. videoiden tekstittäminen). Tässä osiossa kuitenkin on käyty läpi yleisimmin sisällönsyötössä tarvittavat asiat. Mikäli sinulla on kysyttävää, ota meihin yhteyttä. Netistä löytyy paljon ohjelmia, joilla voit seurata saavutettavuuden toteutumista omalla sivustollasi. Yksi hyvä työkalu on Wave Web Accessibility Evaluation Tool.

 

Haluatko lisätietoa Foxysta?

Kiinnostuitko Foxysta? Tuliko sinulle kysyttävää järjestelmän toiminnasta? Haluatko pyytää tarjouksen vai kenties tunnukset demosivustollemme? Ota meihin yhteyttä, niin autamme mielellämme!

Web Designer
Matti Hautaniemi

matti.hautaniemi @ mainossynergia.com
puh. 040 724 0806