Saavutettavuus ei ole enää pelkkä lisäominaisuus verkkosivustoilla, vaan olennainen osa laadukasta digitaalista palvelua. Esteetön verkkosivusto mahdollistaa sen, että mahdollisimman moni käyttäjä voi käyttää palvelua riippumatta esimerkiksi näkö-, kuulo-, liikunta- tai kognitiivisista rajoitteista.
Drupal tunnetaan vahvasta saavutettavuusosaamisestaan, ja saavutettavuus on ollut pitkään yksi sen kehityksen painopistealueista. Oikein toteutettuna Drupal tarjoaa erinomaiset työkalut WCAG-vaatimusten täyttämiseen ja käyttäjäystävällisten verkkopalveluiden rakentamiseen.
Mitä saavutettavuus tarkoittaa?
Saavutettavuus tarkoittaa, että verkkopalvelu on:
- Havaittava
- Hallittava
- Ymmärrettävä
- Toimintavarma
Tavoitteena on, että mahdollisimman moni voi käyttää palvelua erilaisilla laitteilla ja apuvälineillä.
Miksi saavutettavuus on tärkeää?
Saavutettavuus hyödyttää:
- Näkövammaisia käyttäjiä
- Kuulovammaisia käyttäjiä
- Ikääntyneitä käyttäjiä
- Mobiilikäyttäjiä
- Hitaiden yhteyksien käyttäjiä
- Tilapäisistä rajoitteista kärsiviä käyttäjiä
Esteettömyys parantaa käytettävyyttä lähes kaikille käyttäjille.
Lainsäädäntö asettaa vaatimuksia
Monissa maissa julkishallinnon ja osittain myös yksityisten palveluiden on täytettävä saavutettavuusvaatimukset.
Yleisimmin noudatetaan:
- WCAG 2.1 -ohjeistusta
- WCAG 2.2 -suosituksia
Saavutettavuus kannattaa huomioida jo projektin alkuvaiheessa.
Drupalin saavutettavuusominaisuudet
Drupal sisältää useita saavutettavuutta tukevia ominaisuuksia:
- Näppäimistökäytön tuki
- ARIA-ominaisuudet
- Selkeät lomakerakenteet
- Semanttinen HTML
Monet ominaisuudet ovat käytettävissä suoraan ilman lisämoduuleja.
Käytä semanttista HTML-rakennetta
HTML-rakenne auttaa apuvälineitä ymmärtämään sivun sisällön.
Hyviä käytäntöjä:
- Käytä otsikkotasoja oikein.
- Käytä listoja tarkoituksenmukaisesti.
- Hyödynnä HTML5-elementtejä.
Selkeä rakenne helpottaa sekä käyttäjiä että hakukoneita.
Otsikkorakenne on tärkeä
Hyvä otsikkohierarkia auttaa käyttäjiä hahmottamaan sisällön.
Esimerkiksi:
H1 – Sivun pääotsikko
H2 – Pääosio
H3 – AlaosioOtsikkotasojen ohittamista kannattaa välttää.
Huolehdi värien kontrasteista
Riittämätön kontrasti vaikeuttaa sisällön lukemista.
Varmista:
- Riittävä tekstin ja taustan kontrasti
- Selkeät painikkeet
- Hyvä luettavuus kaikilla laitteilla
Kontrastiongelmat ovat yksi yleisimmistä saavutettavuuspuutteista.
Lisää vaihtoehtoiset tekstit kuville
Kuvat eivät välity ruudunlukijoille ilman alt-tekstiä.
Hyvä alt-teksti:
- Kuvaa kuvan tarkoituksen
- On riittävän informatiivinen
- Ei toista ympäröivää sisältöä tarpeettomasti
Koristekuville voidaan käyttää tyhjää alt-attribuuttia.
Huomioi näppäimistökäyttö
Kaikki käyttäjät eivät käytä hiirtä.
Sivuston tulisi olla käytettävissä:
- Tab-näppäimellä
- Enterillä
- Nuolinäppäimillä
Kaikkien toimintojen tulee olla saavutettavissa myös ilman hiirtä.
Tee lomakkeista saavutettavia
Lomakkeet ovat yksi yleisimmistä ongelmakohdista.
Muista:
- Selkeät kenttien nimet
- Virheilmoitukset
- Ohjetekstit
- Looginen tab-järjestys
Drupal tarjoaa hyvät työkalut saavutettavien lomakkeiden rakentamiseen.
Vältä pelkkään väriin perustuvaa viestintää
Älä ilmaise tärkeää tietoa ainoastaan värin avulla.
Esimerkiksi:
❌ Punainen kenttä tarkoittaa virhettä.
Parempi vaihtoehto:
✔ Punainen kenttä ja tekstimuotoinen virheilmoitus.
Tämä auttaa värisokeita käyttäjiä.
Responsiivisuus tukee saavutettavuutta
Saavutettava sivusto toimii:
- Puhelimilla
- Tableteilla
- Tietokoneilla
- Suurennetuilla näkymillä
Responsiivinen suunnittelu on tärkeä osa esteettömyyttä.
Huolehdi linkkien selkeydestä
Vältä linkkitekstejä kuten:
Lue lisää
Klikkaa tästäParempi vaihtoehto:
Lue lisää Drupalin saavutettavuusominaisuuksistaKuvaavat linkit auttavat erityisesti ruudunlukijoiden käyttäjiä.
Videoiden saavutettavuus
Jos sivustolla on videoita, huomioi:
- Tekstitykset
- Transkriptiot
- Selkeä äänenlaatu
Saavutettava videosisältö palvelee laajempaa käyttäjäryhmää.
Testaa ruudunlukijalla
Tekninen toteutus ei aina kerro koko totuutta.
Hyviä testausmenetelmiä ovat:
- Näppäimistötestaus
- Ruudunlukijat
- Saavutettavuustyökalut
Todellinen käyttökokemus löytyy usein testaamalla.
Hyödynnä automaattisia työkaluja
Saatavilla on useita hyödyllisiä työkaluja:
- Lighthouse
- WAVE
- Axe
- Browser Developer Tools
Ne auttavat löytämään yleisimpiä ongelmia.
Saavutettavuus ja SEO
Saavutettavuus ja hakukoneoptimointi tukevat usein toisiaan.
Molemmat hyötyvät:
- Selkeästä rakenteesta
- Otsikkohierarkiasta
- Kuvien alt-teksteistä
- Loogisesta navigaatiosta
Hyvä saavutettavuus voi myös parantaa hakukonenäkyvyyttä.
Kouluta sisällöntuottajat
Tekninen toteutus ei yksin riitä.
Myös sisällöntuottajien tulee ymmärtää:
- Otsikkorakenteet
- Alt-tekstit
- Linkkien merkitys
- Selkeä kieli
Saavutettavuus on koko organisaation yhteinen tehtävä.
Saavutettavuus on jatkuva prosessi
Esteettömyys ei valmistu kerran.
Sivustoa tulee:
- Testata säännöllisesti
- Kehittää jatkuvasti
- Seurata uusien sisältöjen laatua
Pienetkin muutokset voivat vaikuttaa saavutettavuuteen.
Yhteenveto
Drupal tarjoaa erinomaiset mahdollisuudet esteettömien verkkopalveluiden rakentamiseen. Semanttinen HTML, toimiva otsikkorakenne, saavutettavat lomakkeet, hyvä kontrasti ja näppäimistökäytön huomioiminen muodostavat vahvan perustan saavutettavalle sivustolle.
Saavutettavuus ei ole pelkästään tekninen vaatimus, vaan tapa rakentaa parempia verkkopalveluita kaikille käyttäjille. Kun esteettömyys huomioidaan jo suunnitteluvaiheessa, lopputuloksena syntyy laadukkaampi, käyttäjäystävällisempi ja kestävämpi verkkopalvelu.