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 tai kuulisi, tai pystyisi käyttämään kymmentä sormea sujuvasti.

Tällä sivulla kerromme miten sivusta tehdään saavutettava sisällönsyöttäjän näkökulmasta.

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 jne.
• Lomakkeet hyödyntävät Googlen reCaptchaa (toimii myös heikkonäköisillä ja heikkokuuloisilla henkilöillä).

Huomioi nämä asiat kun teet sisältöä

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.

Silmäiltävyys

Vältä pitkiä tekstikappaleita. Hyödynnä väliotsikoita, väliviivoja ja listoja. Kappaleet kannattaa pitää parin virkkeen pituisena.

Otsikoiden käyttö

Otsikoiden käyttö on tärkeässä roolissa saavutettavalla sivulla. Näitä täytyy käyttää 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 (eli Otsikko 1:n jälkeen täytyy tulla Otsikko 2, eikä esimerkiksi Otsikko 3).

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).

Älä kirjoita tekstiä isoilla kirjaimilla, koska ruudunlukijat saattavat lukea tekstin kirjain kerrallaan. Mikäli otsikot halutaan isoilla kirjaimilla, on ne määritelty CSS -tyyleihin.

Älä kirjoita otsikkoa isoilla kirjaimilla
ÄLÄ KIRJOITA OTSIKKOA ISOILLA KIRJAIMILLA

Linkit

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

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.

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.