Spletna dostopnost

Spletna dostopnost, digitalna dostopnost ali po angleško »accessibility« se dotika dostopa do vsebin na spletu. To pomeni, da lahko splet uporabljajo uporabniki z različnimi ovirami, kot so različne oblike invalidnosti oz. oviranosti ali pa začasne oviranosti, kot je npr. zlom roke, začasna izguba vida, …

Spletne rešitve ali aplikacije so pogosto usmerjene v določene uporabnike ali pa so pripravljene ob osnovni predpostavki, da vsak uporabnik uporablja tipkovnico in miško, ter ima pogled na ekran. Slednje se z vse večjim številom mobilnih naprav, kot so pametni telefoni, tablice in govorni asistenti spreminja (nov input je sedaj dotik, glas, …). Pri takšnih rešitvah pa najpogosteje zapostavljamo uporabnike z različnimi ovirami. Neprilagojena stran ali aplikacija za ne tradicionalne načine uporabe pa lahko vpliva na uporabniško izkušnjo vseh uporabnikov.

Spletna dostopnost je v osnovi koristna za vse, ker predstavlja univerzalno oblikovanje, ki je uporabno za najširši spekter ljudi, ne glede na to, ali imajo kakšno oviranost ali ne. Sam koncept dostopnosti mora zagotavljati tako »neposreden dostop«, kot tudi »posreden dostop« do informacij z uporabo podpornih tehnologij.

Spletno dostopnost tako označuje, da so spletne strani ter aplikacije, orodja narejene na način, ki uporabnikom omogoča:

  • zaznavanje,
  • razumevanje
  • krmarjenje in
  • upravljanje.

Standardi in smernice spletne dostopnosti (accessibility/a11y) so natančno definirani, zato je pomembno, da jih upoštevamo v vseh fazah razvoja, se pravi pri načrtovanju, oblikovanju ter programiranju.

Različne oviranosti pri dostopanju

Poznamo več vrst oviranosti, in sicer permanentne oviranosti in začasne oviranosti. Permanentne so običajno različne oblike invalidnosti, v to skupino spadajo okvare vida, sluha, govora ter telesne, kognitivne in nevrološke okvare. V začasne oviranosti pa lahko umestimo zlom roke, začasna izguba vida, …

Preden se lotimo izdelave dostopnih spletnih strani in aplikacij moramo najprej poznati različne uporabnike in njihove oviranosti, ki jih imajo pri uporabi spleta. Poznamo več vrst oviranosti:

  • fizične,
  • vizualne,
  • slušne,
  • govorne,
  • kognitivne in
  • nevrološke.

Določeni uporabniki imajo lahko tudi več oviranosti ali pa različne stopnje slednjih. Vsaka oviranost pa prinaša določene izzive, ki jih mora uporabnik rešiti. Ti izzivi so: težko berljivo besedilo, nezmožnost uporabe miške, gluhi uporabniki ne slišijo zvoka v videih ali zvočnih alarmih, … Vsi uporabniki pa se prej ali slej srečamo z začasnimi oviranosti, kot je zlom roke, začasna izguba vida, sluha, .. ali čisto situacijske, kjer npr. na vlaku ne moremo poslušati video posnetka, zato rabimo podnapise, pestujemo dojenčka in naša mobilnost je omejena, …

Standardi spletne dostopnosti

Standarde za spletno dostopnost ureja organizacija World Wide Web Consortium (W3C), ki standarde spletne dostopnosti določa in vzdržuje. V skupnosti, ki ureja to področje je vpleteno veliko število uporabnikov z različnimi ovirami. Razlog zato tiči v tem, da bi bili pripravljeni standardi čim bolj učinkoviti za uporabnike z različnimi oviranostmi. Standardi in smernice, ki to določajo se imenujejo Web Content Accessibility Guidelines (WCAG).

Smernice tega dokumenta temeljijo na štirih načelih – spletna stran mora biti:

  • zaznavna
  • operativna
  • razumljiva in
  • robustna

Vsako načelo ima opredeljene smernice, ki delujejo kot podlaga za razumevanje kriterijev. Kriteriji so določeni na podlagi teh nivojev zahtevnosti – A, AA in AAA. Pri tem je A najnižji nivo, ki ne zahteva večjih obravnav in prilagoditev, nivo AAA pa najtežji in zahteva večje število obravnav in prilagoditev. Nivoji se med seboj dopolnjujejo, ker pomeni, če pripravimo stran za AAA, pokrijemo tudi AA in A nivo.

Pri razvoju spletnih strani in aplikacij si lahko pomagamo z stranmi How to Meet WCAG (Quick Reference) in Web Accessibility Tutorials.

Zakonska ureditev spletne dostopnosti

Področje spletne dostopnosti je zakonsko najbolj urejeno v razvitem svetu, se pravi ZDA in Evropa. V tem primeru so ZDA pred Evropo, saj so določene zakone o dostopnosti (sicer ohlapno) definirali že zelo zgodaj. Evropa pa se je tega področja  bolj resno lotila bolj pozno (ampak bolj natančno).

ZDA

Podlaga zakona je ADA (Americans with disabilities act) iz leta 1990, ki se je skozi leta dopolnjeval. V tem aktu je prepovedana diskriminacija ljudi s posebnimi potrebami in fizičnimi ovirami, kljub dopolnitvam pa spletna dostopnost v zakonodaji ni prejela posebne obravnave. Točnega podatka kdaj bo zakonska ureditev dopolnjena in urejena ni, zato so določene države znotraj ZDA poskrbele za dodatne zakone – npr. Kalifornia (A.B. 434).

Evropa

Leta 2016 je v veljavo prišla Direktiva o dostopnosti spletišč in mobilnih aplikacij organov javnega sektorja.  Direktiva se nanaša na javni sektor, ki zajema državne organe, organe samoupravnih lokalnih skupnosti in osebe javnega prava po zakonu, ki ureja javno naročanje.

V zakonodaji je posredno določeno, da morajo spletne strani in aplikacije izpolnjevati nivo AA WCAG 2.1. standarda. Spletne strani in aplikacije morajo vsebovati tudi izjavo o dostopnosti, ki uporabnike obvešča o tem katere funkcionalnosti so bile dodane za posamezen tip oviranosti, na kakšen način lahko stran uporabljajo ali si jo prilagodijo. Kontaktne informacije za nadaljnja vprašanja in pritožbe, kdo nadzira spletno dostopnost in datum priprave izjave, ki mora biti redno posodabljan (najmanj enkrat letno).

Države EU lahko v svoji zakonodaji določijo višino globe, ki v Sloveniji znaša med 200 EUR in 2000 EUR (vir: Zakon o dostopnosti spletišč in mobilnih aplikacij (ZDSMA) – 13. člen) http://www.pisrs.si/Pis.web/pregledPredpisa?sop=2018-01-1351

Direktiva prične ali je pričela veljati:

  • 23. septembra 2020 za prilagoditev spletišč, objavljenih pred 23. 9. 2018,
  • 23. septembra 2019 za druga spletišča,
  • 23. junija 2021 za mobilne aplikacije.

Pomožne tehnologije

Imamo več vrst pomožnih tehnologij, ki uporabnikom omogočajo lažje prebiranje vsebin. Glavne pomožne tehnologije so:

  • bralec zaslona (screen reader)
  • tipkovnica
  • različni naprave za upravljanje (ustni, naglavni, …)
  • enojni gumb (single switch device)
  • sledilniki gibanja glave in oči
  • glasovni asistenti (Alexa, Google Home, Siri, …)

V zadnjem času so največji preskok naredili glasovni asistenti, ki so še dodatno spodbudili spletno dostopnost, saj če vas Alexa ne najde, vas tudi uporabniki ne bodo. Namreč do sedaj je bila predpostavka, da ima uporabnik vedno zaslon, kot vmesnik do spleta, glasovni asistenti pa to predpostavko sedaj brišejo.

Priprava dostopnih spletnih strani in aplikacij

Največkrat se pri dostopnosti v prvi fazi srečamo s kontrastom in barvnimi odtenki. Odtenki morajo biti dovolj močni, da se besedilo ustrezno loči od podlage in da vsi uporabniki oz. velika večina nima težav pri prebiranju. Naslednja točka so velikosti besedila, ki morajo biti temu ustrezna, izogibamo se tudi napisom v velikih črkah. Velika večina uporabnikov, tudi tisti brez oviranosti že uporabljajo povečave besedila preko operacijskih sistemov ali preko funkcionalnosti brskalnikov, zato moramo paziti, da na spletnih straneh in aplikacijah ne pride do težav pri postavitvah, če se besedilo veča.

Pri pripravi dostopnih spletnih strani in aplikacij se moramo držati načel:

  • semantičen HTML (definiranje odsekov strani: header, nav, section, article, aside, footer, …)
  • uporaba bližnjic (skip to navigation, skip to content, …)
  • uporaba WAI-ARIA značk (banner, navigation, main, …)
  • ustrezna uporaba naslovov (h1, h2, h3, …)
  • ustrezna struktura vsebine (naslovi, odstavki, seznami, …)
  • podpora tipkovnici (tipka TAB, fokus)
  • uporaba dostopnih slik, multimedijskih vsebin, tabel in obrazcev (podnapisi, opisi, dodatni opisi, …)

Na spletu je na voljo že ogromno orodij, ki vam olajšajo delo pri pripravi ustrezno dostopnih spletnih strani in aplikacij. Za nekatere primere so na voljo tudi različni vtičniki, kot je npr. za WordPress Sogo Accessibiliy. Sam pa sem mnenja, da se je najbolje držati osnov (enako, kot pri SEO) in že v fazi načrtovanja, oblikovanja in kasneje programiranja uporabiti ustrezne prijeme (metode, značke, …), ki omogočajo maksimalno dostopno stran.

Zakaj tako? Zato, ker so uporabniki z različni oviranostmi obstajali že prej in so razvili svoje metode brskanja po spletu, zato je naša naloga, da jim to omogočimo čim enostavnejše. Zato tudi nisem naklonjen razvijanju ločenih spletnih strani ali različnih vtičnikov za izboljšanje dostopnosti, ampak mora biti dostopnost že del vsake spletne strani ali aplikacije, tako kot je to postal odziven design (RWD).

Predavanja (video)

Zaradi vsega napisanega se je vredno potruditi, da na spletu kolikor se da umaknemo morebitne ovire, ki izključujejo določene uporabnike. Digitalna dostopnost je postala nujna!

Pogosto zastavljena vprašanja

Kaj so WCAG standardi in zakaj so pomembni?

WCAG (Web Content Accessibility Guidelines) so mednarodni standardi za dostopnost spletnih vsebin, ki jih je razvil W3C. Trenutno je aktualen WCAG 2.1 (kmalu 2.2), z tremi nivoji skladnosti: A (osnovne zahteve), AA (priporočen standard za večino strani), AAA (najvišji nivo). EU direktiva o dostopnosti javnih spletnih mest zahteva vsaj AA nivo. Pomembni so ker 15% svetovne populacije ima neko obliko invalidnosti, dostopne strani imajo boljši SEO, širši doseg občinstva, in pravna skladnost (globe do 20.000€ v Sloveniji). WCAG temelji na štirih načelih: Perceivable (zaznaven), Operable (upravljiv), Understandable (razumljiv), Robust (robusten).

Kakšen mora biti barvni kontrast za dostopno spletno stran?

WCAG 2.1 AA standard zahteva: minimalno 4.5:1 kontrast za normalno besedilo (pod 24px ali 19px bold), 3:1 za veliko besedilo (nad 24px ali 19px bold), in 3:1 za UI komponente in grafične elemente. AAA nivo zahteva 7:1 za normalno besedilo. 8% moških in 0.5% žensk ima neko obliko barvne slepote (najpogosteje rdeče-zelena). Orodja za testiranje: WebAIM Contrast Checker, Colour Contrast Analyser. Izogibajte se: svetlo siva na beli (#999 na #fff je samo 2.8:1 - premalo), rumena na beli, samo barva za informacijo (dodajte ikone/tekst). Črna na beli (21:1) ni vedno najboljša - lahko je preveč agresivna; off-white ozadja (#fafafa) so prijetnejša.

Kako napišem dober alt tekst za slike?

Dober alt tekst opisuje vsebino in funkcijo slike za screen reader uporabnike. Pravila: konkretno opisujte (ne "slika" ali "fotografija"), maksimum 125 znakov (screen readerji truncate), vključite kontekst (zakaj je slika tam), izogibajte se "slika od..." ali "fotografija prikazuje", za dekorativne slike uporabite prazen alt="" (ne skip alt attribute), za kompleksne slike (grafi, diagrami) dodajte longdesc ali aria-describedby z daljšim opisom. Primeri: Slabo: alt="slika" / Dobro: alt="Žiga Polc predava o UX optimizaciji na WordCamp Ljubljana 2025". Za logo: alt="Podjetje ime" ne "logo". Za gumbe z ikono: alt mora opisati akcijo "Iskanje" ne "ikona lupe". Ne generirajte alt tekstov avtomatsko - specifičnost je ključna.

Zakaj je navigacija s tipkovnico pomembna za dostopnost?

7 milijonov ljudi uporablja samo tipkovnico za navigacijo (motorične ovire, blindness, power users). Zahteve: vsi interaktivni elementi morajo biti dostopni s Tab tipko, jasen focus indicator (outline ali border - ne smete ga odstraniti s outline:none brez alternative), logičen tab order (levo-desno, zgoraj-dol), vse funkcije dostopne brez miške (dropdown meniji, modali, galerije), Skip to content link za bypass navigation, in escape key zapre modale. Testirajte: odklopite miško in poskusite opraviti vse ključne akcije samo s Tab, Enter, Escape, Arrow keys. Pogosta napaka: custom dropdown ki deluje samo z miško, modali ki trapajo focus, in odstranjen focus indicator zaradi "estetike".

Kako naredim spletno stran prijazno za screen reader uporabnike?

Screen readerji (NVDA, JAWS, VoiceOver) interpretirajo semantičen HTML. Osnove: uporabite pravilne HTML elemente (nav, main, article, aside, footer - ne vsi divs), heading hierarhija (H1 samo enkrat, H2 za glavne sekcije, H3 podsekčije - ne skipajte nivojev), opisni link teksti (ne "klikni tukaj" ali "preberi več", ampak "Preberi članek o SEO optimizaciji"), labeli za vse form fields (label element povezan z input), ARIA landmarks kjer semantičen HTML ne zadostuje, in alt teksti. Izogibajte se: navigation z select/dropdown elementi, tables za layout (samo za tabelarne podatke), floating content brez logical order. Testirajte: namestite NVDA (brezplačno) in poskusite navigirati stran z zaprtimi očmi.

Kdaj naj uporabljam ARIA (Accessible Rich Internet Applications) atribute?

ARIA atributi dodajajo semantični pomen kjer HTML ne zadostuje. Uporabite SAMO ko: native HTML ne obstaja (npr. aria-expanded za accordion ni potreben če uporabljate details/summary), dynamic content se spreminja (aria-live za notifications, loading indicators), custom widgets (tab panels, tree menus), ali za dodatni kontekst (aria-label za ikone brez besedila). NIKOLI: aria-label na elementih ki že imajo visible tekst, redundant ARIA (role="button" na button elementu), aria-hidden="true" na fokusabilnih elementih. Pravilo #1: "No ARIA is better than bad ARIA". Semantic HTML je vedno prva izbira. Pogosti ARIA: aria-label, aria-labelledby, aria-describedby, aria-expanded, aria-current, aria-live, role="navigation/main/complementary".

Kako naredim spletne obrazce dostopne?

Dostopni forme zahtevajo: vsak input ima povezan label element (for/id attributi), obvezna polja označena z aria-required="true" in vizualnim indikatorjem (*), jasna error sporočila povezana z inputi (aria-describedby), fieldset in legend za skupine (radio buttons, checkboxes), placeholder NI zamenjava za label, autocomplete atributi za standardne podatke (name, email, tel), in inline validation (ne samo ob submit). Error handling: error sporočila morajo biti descriptive ("Email format napačen" ne samo "Napaka"), rdeča barva NI edini indikator (dodajte ikono/tekst), in focus naj se postavi na prvi error. Izogibajte se: placeholder kot label (izgine ob vnosu), CAPTCHA brez alternative (audio verzija), in time limits brez možnosti podaljšanja. Uporabite autocomplete za polja kot ime, email - zmanjša effort za 40%.

Kaj potrebujem za dostopno video vsebino?

WCAG 2.1 AA zahteva: closed captions/podnapisi za vse video vsebine z zvokom (ne samo za gluhe - 85% Facebook videov se gleda brez zvoka), transkript vsebine (text verzija vsega govorjenega in pomembnih zvočnih efektov), audio description track za vizualno pomembne elemente (blindness users), kontrole dostopne s tipkovnico (play/pause, volume, fullscreen), in auto-play SAMO če je muted. Quality standardi: podnapisi morajo biti sync'd (±3s tolerance), brez spelling napak, include speaker identification, in non-speech info [PLOSKANJE], [GLASBA]. Orodja: YouTube auto-captions 70% accurate (vedno editirajte), Rev.com profesionalna transkripcija. Pomembno: video predvajalniki morajo biti dostopni - keyboard accessible - HTML5 video ima native podporo, custom players potrebujejo ARIA.

Kako se dostopnost razlikuje na mobilnih napravah?

Mobilna dostopnost dodaja dodatne izzive: touch target velikost minimum 44x44px (Apple HIG) ali 48x48px (Material Design) - manjši so težko klikljivi s prsti ali za motorične ovire, zadosten spacing med elementi (8px minimum), orientacija ne sme biti locked (landscape/portrait oba možna), pinch-to-zoom omogočen (ne user-scalable=no), in fokus ne sme biti trapped. Screen readers na mobilnih: VoiceOver (iOS) in TalkBack (Android) delujejo drugače kot desktop - swipe gestures namesto tab, touch exploration mode. Testirajte: iOS VoiceOver + Android TalkBack, različne velikosti naprav, in z dejansko fizično disabilities (artritis simulatorji, motor skill challenges). 57% spletnega traffica je mobilen - mobilna dostopnost ni opcijska.

Ali obstajajo pravne zahteve za dostopnost spletnih strani v Sloveniji?

Da. Direktiva EU 2016/2102 zahteva da javne spletne strani in mobilne aplikacije dosegajo WCAG 2.1 AA nivo. To vključuje: državne in lokalne organe, javne ustanove (šole, bolnišnice), in organizacije financirane iz javnih sredstev. Privatne strani niso direktno zavezane (razen če so "essential services"), AMPAK: dosegljivostni zakon 2025 razširja zahteve na banking, e-commerce, in transport. Non-compliance kazni: do 20.000€ v Sloveniji, tožbe v EU in ZDA (ADA lawsuits). Certifikacija ni obvezna, ampak dokumentacija JE: accessibility statement (opis skladnosti, known issues, feedback mechanism), VPAT (Voluntary Product Accessibility Template) za B2B, in redni auditi. Dejstvo: 71% invalidnih uporabnikov zapusti nedostopno stran takoj - izgubljate potencialne stranke.

Arhiv objav "dostopnosti"

Povezane objave

PODCAST

Podcast
Zig zag

Apple PodcastSpotify Podcast