Tīmekļvietnes izvērtējums atbilstoši digitālās vides piekļūstamības prasībām (WCAG 2.1 AA)

• Ievads
• Izmantoto terminu skaidrojums
• Tīmekļvietņu novērtējuma metodoloģija
• Tīmekļvietņu novērtējuma metodoloģija
• Novērtējuma veikšanai nepieciešamie rīki
• Novērtējuma veikšanas kārtība
• Tīmekļvietņu novērtējuma instrukcija
• Tīmekļvietņu novērtējuma instrukcija
• Galvenā navigācija
• Pamatstruktūras pārbaude
• Tastatūras piekļuve un vizuālais fokuss
• Formu lauki un kļūdu paziņojumi
• Attēlu tekstuālā alternatīva
• Virsraksti
• Krāsu kontrasti
• Teksta izmēra tālummaiņa
• Lapu nosaukumi
• Saturs, kas kustas, mirgo un zibsnī
• Multimediju (audio, video) satura alternatīvas
• Turpmākie soļi
• Papildu resursi
• Pielikums

Ievads

Izstrādājot tīmekļvietnes, mobilās lietotnes, tiešsaistes pakalpojumus un citus digitālos resursus, parasti pastiprināta uzmanība tiek pievērsta ļoti šauram dizaina aspektam – šo resursu vizuālajai pievilcībai, atstājot novārtā jautājumus, kas attiecas uz to lietojamību. Tomēr tieši lietojamība nosaka to, cik kvalitatīva veidosies lietotāju mijiedarbība ar digitālo saturu. Turklāt pieredze liecina, ka arī lietojams digitāls saturs var būt pievilcīgs.

Digitālā satura lietojamību nosaka tā piekļūstamības līmenis, kas tiek vērtēts atbilstoši starptautiskajām vadlīnijām WCAG (Web Content Accessibillity Guidelines). To mērķis ir veicināt tādu digitālo resursu izveidi, ko bez jebkādiem ierobežojumiem varētu izmantot ikviens lietotājs. Jo uzskats, ka piekļūstamība ir saistoša tikai cilvēkiem ar dažādām veselības problēmām – redzes, dzirdes, kustību un garīgajiem traucējumiem, ir maldīgs. Digitālā satura piekļūstamību mūsdienās ierobežo arī daudzi citi faktori, piemēram, digitālā pratība un ierīču veiktspēja.

Digitālā satura piekļūstamības ierobežojumi ir tieši attiecināmi uz atsevišķu lietotāju diskrimināciju pēc noteiktām pazīmēm. Lai to novērstu, 2018. gada rudenī tika pieņemts Eiropas Savienības regulējums, kas nosaka, ka no 2020. gada 23. septembra piekļūstamām ir jābūt visām valsts institūciju tīmekļvietnēm un no 2021.gada 23.jūnija – mobilajām lietotnēm.

Ievērojot šī regulējuma prasības, ir izstrādāts arī Latvijas nacionālais standarts LVS EN 301549:2022 L “IKT produktu un pakalpojumu piekļūstamības prasības”. Ar tā aktuālo versiju var iepazīties Nacionālās standartizācijas institūcijas “Latvijas standarts” tīmekļvietnes sadaļā par Ministru kabineta 2020. gada 14. jūlija noteikumiem Nr.445 “Kārtība, kādā iestāde ievieto informāciju internetā” piemērotajiem standartiem. Standarts, līdzīgi kā daudzi citi dokumenti, tiek regulāri pilnveidots, tāpēc vienmēr pievērsiet uzmanību dokumenta numuram, nosaukumam un apstiprināšanas datumam.

2019.gada 17.aprīlī tika pieņemta Eiropas Parlamenta un Eiropas Padomes Direktīva (ES) 2019/882 - Eiropas Piekļūstamības akts (European Accessibility Act, EAA) par produktu un pakalpojumu piekļūstamības prasībām. Tiesību akts tiks piemērots no 2025. gada 28. jūnija un attieksies uz noteiktām preču un pakalpojumu grupām, kā piemēram - datoriem, planšetdatoriem, viedtālruņiem un to operētājsistēmām, pašapkalpošanās termināļiem (bankomātiem, biļešu automātiem, rindas kārtas numuriņu automātiem u.c.). Direktīvas prasības būs saistošas arī publiskiem iepirkumiem, ja tiek iepirktas likuma darbības jomā ietilpstošās preces un pakalpojumi, t.sk. gaisa, autobusu, dzelzceļa un ūdensceļu pasažieru pārvadājumu pakalpojumi, patērētāju galiekārtas elektronisko sakaru pakalpojumi (piem., rūteri, modemi) un elektronisko sakaru pakalpojumi. Latvijā šobrīd ir izstrādāts likumprojekts “Preču un pakalpojumu piekļūstamības likums”, kas vēl jāpieņem Saeimā.

Šīs tīmekļvietņu piekļūstamības novērtējuma vadlīnijas ir izstrādātas ar mērķi nodrošināt tīmekļvietņu atbilstību piekļūstamības prasībām atbilstoši Eiropas Savienības regulējuma, kā arī iepriekš minētā standarta 9., 10. un 11. punktos norādītajām prasībām. To pamatā ir metodoloģija, kas ļauj gūt vispārīgu priekšstatu par tīmekļvietņu piekļūstamību, ņemot vērā WCAG vadlīniju 2.1 versijas AA līmeņa rekomendācijas.

Vadlīnijas paredzētas tīmekļvietnes izvērtēšanai 11 būtiskākajos piekļūstamības aspektos un novērtējums ir uzskatāms par atbilstošu Ministru kabineta 2020. gada 14. jūlija noteikumu Nr.445 “Kārtība, kādā iestāde ievieto informāciju internetā” prasībām, jo tā ietvaros pastiprināta uzmanība tiek pievērsta četriem piekļūstamības pamatprincipiem. Tie paredz, ka digitālajam saturam ir jābūt:

• uztveramam (attēlu, multimediju satura un cita digitālā satura atspoguļošanas alternatīvu pieejamība);
• darbināmam (iespēja piekļūt digitālajam saturam un izmantot to brīvi – ne vien ar datorpeli, bet arī ar tā dēvētajām palīgtehnoloģijām, piemēram, TAB taustiņu);
• saprotamam (digitālā satura atspoguļošana vienkāršā valodā, lai tas būtu saprotams ikvienam lietotājam, arī cilvēkiem ar dažādiem uztveres traucējumiem);
• robustam (iespēja salāgot digitālo saturu ar dažāda veida iekārtām, piemēram, ekrāna lasīšanas ierīcēm, viedtālruņu virtuālajiem balss asistentiem un u.tml.).

Lai gūtu visaptverošu priekšstatu par tīmekļvietnes piekļūstamību, ir jāveic pilnvērtīga tās izvērtēšana atbilstoši visām WCAG 2.1 vadlīniju prasībām, kas paredz automatizēto un lietotāju testu izmantošanu.

Izmantoto terminu skaidrojums

·        ALT teksti jeb attēla tekstuālā alternatīva – teksti, kas tiek iekļauti HTML kodā, lai aprakstītu attēla (fotogrāfijas, ilustrācijas, grafikas, plakāta u.c.) saturu un mērķi.

·        Aplāde, podraide jeb podkāsts (podcast) – audio vai video formāta raidījums, kas tiek publicēts ar noteiktu periodiskumu un ko var lejupielādēt ierīcēs vai klausīties tiešsaistē.

·        Balss ievade – palīgtehnoloģija lietotāju un digitālā satura mijiedarbības veicināšanai, kas ļauj aizstāt datorpeli ar runu (balss komandas).

·        Ekrāna lasītāji (Jaws, NVDA u.c.) – neredzīgu un vājredzīgu cilvēku “acis” digitālajā vidē. Tās ir palīgtehnoloģijas jeb programmatūras, kas nolasa rakstīto tekstu, tostarp izmantotos simbolus, lietotājiem, kuri redzes traucējumu dēļ neredz ekrāna saturu vai nevar pārvietoties pa to ar datorpeli.

·        Palīgtehnoloģijas (assistive technologies) – tehnoloģijas, kas palīdz datoram vai mobilajam tālrunim padarīt digitālo saturu piekļūstamu cilvēkiem ar dažādiem veselības traucējumiem. Populārākie palīgtehnoloģiju veidi ir datorpele, tastatūra, ekrāna lasītājs un balss ievade.

·        Piekļūstamība (accessibility) – ja digitālās vides pieejamību (availability) nosaka digitālo tehnoloģiju pieejamība un darbība (vai lietotājiem ir pieejams dators vai viedtālrunis, vai šīs ierīces darbojas, vai interneta signāls ir pietiekami spēcīgs, lai varētu atvērt tīmekļvietni un veikt tajā noteiktas darbības u.tml.), digitālās vides piekļūstamība nosaka to, cik ērti lietotāji ar šīm tehnoloģijām var piekļūt digitālajam saturam un mijiedarboties ar to jeb uztvert un saprast šo saturu.

·        SEO (Search Engine Optimization) atslēgvārdi – mirkļbirkas, kas tiek izmantotas ar mērķi popularizēt organizācijas tīmekļvietni interneta vidē, palielināt tās apmeklējumu statistiku, uzlabot tās meklēšanas rezultātus Google, Yandex, Yahoo un citos pasaules vadošajos interneta meklētājservisos u.tml.

·        “Slēgta” jeb ar parolēm aizsargāta tīmekļvietne – jebkura tīmekļvietne, kurā ir nepieciešams autorizēties (internetbanka, dažādu pakalpojumu sniedzēju portāli, e-veikali u.tml.)

·        Spraudnis jeb papildinājums (plugin, adon vai extention) – ir datorprogramma, kas “sadarbojas” ar citām programmām, papildinot to funkcionalitātes.

Tīmekļvietņu novērtējuma metodoloģija

Digitālajā vidē jebkuram elementam ir paredzēta noteikta funkcionalitāte. Lai noteiktu, vai galvenie tīmekļvietnes elementi pilda tiem paredzētās funkcijas, šīs vadlīnijas paredz veikt to izvērtēšanu 11 būtiskākajos piekļūstamības aspektos, kas ir īpaši svarīgi lietotāju un digitālā satura mijiedarbības nodrošināšanai. Starp šiem aspektiem ir tādi, kas attiecas uz:

• tīmekļvietnes funkcionalitāti (navigācija, pamatstruktūra, formas, teksta tālummaiņa, iespēja piekļūt saturam ar tastatūru);
• tīmekļvietnes satura piekļūstamību (virsraksti, lapu nosaukumi, krāsu kontrasti, attēlu tekstuālās alternatīvas, multimediju satura alternatīvas, animētais saturs).

Neraugoties uz to, ka vērtējamie piekļūstamības aspekti ir visnotaļ tehniski, to pārbaudei tiek izmantoti automatizētie testi, tāpēc šī novērtējuma veikšanai nav nepieciešamas priekšzināšanas vai īpašas zināšanas un prasmes IT jomā. Tos var pārbaudīt teju ikviens, kuram ir pieejams dators, viedtālrunis un interneta pieslēgums.

Novērtējuma veikšanai nepieciešamie rīki

Tīmekļvietnes piekļūstamības izvērtēšanai var izmantot dažādus rīkus. Zemāk pievienotajā tabulā ir apkopota informācija par efektīviem bezmaksas rīkiem, kas piemēroti dažādu piekļūstamības aspektu pārbaudei populārākajos interneta pārlūkos – Chrome, Firefox, Microsoft Edge un Safari.

Daļa no šiem rīkiem darbojas interneta pārlūka līmenī, bet daļa – operētājsistēmas (MacOS, Linux vai Windows) līmenī. Detalizētas instrukcijas par to, kā konkrētie rīki ir izmantojami, iekļautas katra izvērtēšanai paredzētā aspekta detalizētajā aprakstā.

Vispārīgie rīki

Pārbaudes rīks	Rīka apraksts	Pārlūks, kurā rīku var izmantot
Accessibility Insights	Izmanto, lai pārbaudītu Android un Windows lietojumprogrammu, kā arī tīmekļvietņu piekļūstamību. Ļauj pārbaudīt tādus piekļūstamības aspektus kā navigācija ar tabulatoru, virsrakstu iezīmes u.c.	Chrome, Microsoft Edge
Google Lighthouse	Sniedz lapai vispārīgu piekļūstamības novērtējumu skalā no 0-100, parāda uzlabojumus konkrētiem piekļūstamības aspektiem	Chrome
Wave	Sniedz vizuālu atgriezenisko saiti par tīmekļvietnes satura pieejamību.	Chrome, Firefox, Edge

Specifiskie rīki

Pārbaudes rīks	Rīka apraksts	Pārlūks, kurā rīku var izmantot
ALT Text Tester	Izmanto ALT jeb attēla tekstuālās alternatīvas pārbaudei.	Chrome
Image ALT	Izmanto ALT jeb attēla tekstuālās alternatīvas pārbaudei.	Firefox
Headings Map	Izmanto virsrakstu piekļūstamības (loģiskās struktūras un hierarhijas) pārbaudei.	Chrome, Firefox
A11y-Outliner	Izmanto virsrakstu un tīmekļvietnes pamatstruktūras pārbaudei.	Firefox
Screen Reader	Rīks, kas darbojas kā ekrāna lasītājs. To izmanto formu, lauku nosaukumu un kļūdas paziņojumu pārbaudei.	Chrome
MacOS Voice Over	Operētājsistēmā MacOS iestrādāts rīks, kas darbojas kā ekrāna lasītājs. To izmanto formu, lauku nosaukumu un kļūdas paziņojumu pārbaudei.	Chrome, Firefox, Safari
Colour Contrast Checker	Izmanto krāsu kontrastu piekļūstamības pārbaudei.	Chrome
WCAG Contrast Checker	Izmanto krāsu kontrastu piekļūstamības pārbaudei.	Firefox

Novērtējuma veikšanas kārtība

Kārtību, kādā ir jāveic tīmekļvietņu novērtējums atbilstoši piekļūstamības prasībām, nosaka Ministru kabineta 2020. gada 14. jūlija noteikumu Nr.445 “Kārtība, kādā iestādes ievieto informāciju internetā” 26.1.1. punkts. Novērtējuma ietvaros ir jāizvērtē katras izlases kopumā iekļautās jeb pārbaudei izvēlētās tīmekļvietnes sadaļas atbilstība 11 piekļūstamības aspektiem:

1.     Galvenā navigācija

2.    Pamatstruktūras pārbaude

3.    Tastatūras piekļuve un vizuālais fokuss

4.    Formu lauki un kļūdu paziņojumi

5.    Attēlu tekstuālā alternatīva

6.    Virsraksti

7.    Krāsu kontrasti

8.   Teksta izmēra tālummaiņa

9.    Lapu nosaukumi

10.                    Saturs, kas kustas, mirgo un zibsnī

11. Multimediju (audio, video) satura alternatīvas

Primāri šī atbilstība ir jānovērtē datorā, taču atsevišķu piekļūstamības aspektu novērtējumu ieteicams veikt arī viedtālrunī:

• Ja novērtējuma rezultātā tiek gūts apstiprinājums tam, ka visās pārbaudei izvēlētajās tīmekļvietnes sadaļās ir ievēroti visi šie 11 piekļūstamības aspekti, tiek uzskatīts, ka tā ir pietiekami piekļūstama ikvienam lietotājam, tostarp personu grupām, kurām piekļūstams saturs uzlabo digitālā satura lietošanas pieredzi, piemēram, cilvēkiem ar dažādiem veselības traucējumiem.
• Ja novērtējuma rezultātā netiek gūts apstiprinājums tam, ka visās pārbaudei izvēlētajās sadaļās ir ievēroti visi šie 11 piekļūstamības aspekti (atbilstība piekļūstamības prasībām netiek apstiprināta vai tiek apstiprināta daļēji), tiek uzskatīts, ka nepiekļūstama ir visa tīmekļvietne, nevis konkrētā tās sadaļa. Šajā gadījumā tīmekļvietnes īpašniekam ir jānodrošina nepilnību novēršana atbilstoši WCAG 2.1. vadlīnijām. Šim mērķim var izmantot arī šī novērtējuma vadlīnijās aprakstītos labās prakses piemērus.

Jāpiebilst, ka labā prakse paredz veikt piekļūstamības novērtējumu vismaz piecām tīmekļvietnes sadaļām. Turklāt pārbaudēm ir jāizvēlas tādas sadaļas, ko ikdienā apmeklē salīdzinoši vislielākais lietotāju skaits.

Tīmekļvietnes atbilstību piekļūstamības principiem var veikt vai nu darba grupās, ko veido vismaz viens speciālists, kurš ir atbildīgs par informācijas izvietošanu organizācijas tīmekļvietnē, un vismaz viens speciālists, kurš ir atbildīgs par tīmekļvietnes tehnisko uzturēšanu, vai arī nosakot atbildīgo personu par tīmekļvietnes izvērtēšanu, kas pēc nepieciešamības var sazināties ar tīmekļvietnes uzturētāju (citu iestādi vai atbilstošo ārpakalpojumu).

Novērtējuma gaitā tiek sagatavots piekļūstamības izvērtēšanas protokols (tā veidlapa pieejama šo vadlīniju 1. pielikumā), kas apliecina tīmekļvietnes atbilstību vai neatbilstību WCAG 2.1 vadlīnijās noteiktajiem piekļūstamības principiem.

Tīmekļvietņu novērtējuma instrukcija

Veicot tīmekļvietņu piekļūstamības novērtējumu, rūpīgi sekojiet līdzi šajā nodaļā aprakstīto piekļūstamības aspektu pārbaudes instrukcijām. Lai jums būtu vieglāk izvērtēt, vai un cik piekļūstams ir katrs no aspektiem, kas ir jāpārbauda šī novērtējuma ietvaros, pirms sākt testēšanu, iepazīstieties ar labās prakses piemēriem šo aspektu piekļūstamības nodrošināšanā.

Veicot piekļūstamības izvērtējumu, rezultātus digitāli apkopojiet atbilstoši šo vadlīniju 1.pielikumā iekļautajam protokolam. Šim nolūkam īpaši piemērotas ir MS Excel formāts, bet var izmantot arī MK Word veidni. Protokols pievienots šo vadlīniju 1. punktā un rediģējamā formātā VARAM tīmekļvietnē Ms Word un Ms Excel formātā.

1. Galvenā navigācija

Piekļūstamu navigāciju raksturo vienkāršība – sākot ar navigācijas elementu nosaukumiem un beidzot ar to izvietojumu lapas struktūrā. Piemēram to, cik ērti lietojama ir tīmekļvietne – cik viegli tajā ir orientēties, meklēt informāciju u.tml., nosaka tas, cik pārdomāti ir izveidota tās navigācija. Bieži tiek pieņemts, ka visiem lietotājiem ir datorpeles un ka visi tās arī lieto. Taču datorpele nav nedz obligāts, nedz arī pašsaprotams digitālā satura izmantošanas instruments. Piemēram, tā var salūzt. Ar to nevar dzēst tekstu. Un ir lietotāji, kuri objektīvu iemeslu dēļ to nemaz nevar izmantot. Starp viņiem ir gan cilvēki ar redzes un kustību traucējumiem (vieni neredz kursoru, otri nespēj to kontrolēt), gan arī cilvēki, kuriem ir pārejošas veselības problēmas (īslaicīgi redzes traucējumi, lauzta roka vai sasists pirksts u.c.). Tāpēc svarīgs priekšnosacījums kvalitatīvas lietotāju un digitālā satura mijiedarbības veicināšanai ir iespēja piekļūt šim saturam vairāk nekā vienā veidā – ne vien ar datorpeli, bet arī dažādām palīgtehnoloģijām.

1.1. Labā prakse

• Lapas navigācija ir labi strukturēta, ir ievērota hierarhija;
• Galvenajā navigācijā ir izvietoti līdz 10 elementiem;
• Navigācijai var piekļūt bez datora peles – pārvietoties ar tastatūras TAB taustiņu;
• Galvenās navigācijas elementu nosaukumi ir saprotami un viegli lasāmi (tas ir svarīgi, piemēram, izmantojot ekrāna lasītāju);
• Apakšnavigācijas elementi jeb galveno navigācijas sadaļu apakšsadaļas tiek izcelti un nodalīti no galvenā satura (main content).

Labās prakses piemērs. Lapas navigācijā var pārvietoties ar TAB taustiņu, navigācijas elementi ir strukturēti, pārskatāmi (pievienoti līdz 10 elementiem) un valodas izvēlnes apakšnavigācijai var piekļūt ar tastatūras taustiņu “Enter”. Galvenās navigācijas elementu nosaukumi ir saprotami un viegli lasāmi.

Latvijas tīmekļvietnes sākumlapa ar pārskatāmiem navigācijas elementiem

Ieteikumi navigācijas veidošanā:

• Pirmā līmeņa jeb galvenie navigācijas elementi, piemēram, “Par mums”, “Pakalpojumi” un “Kontakti”, tiek ietverti lapas galvenē (header). Kājenē (footer) un sānu izvēlnēs to izmantošana ir pieļaujama tikai tad, ja tie ir arī galvenē;
• Apakšnavigācijas elementiem tiek nodrošināta piekļuve ne vien ar datorpeli, bet arī tastatūru – izmantojot Tab taustiņu (Tab uz priekšu, Shift + Tab atpakaļ) Apakšnavigācijas elementi parādās uz augšējās sadaļas nospiežot taustiņu “Enter”;
• Sānu izvēlnes, līdzīgi kā apakšnavigācijas elementi, tiek nodalītas no galvenā satura;
• Viena no sānu izvēlnēm (parasti – ekrāna kreisajā pusē) tiek veidota kā papildu navigācijas bloks, kurā jāatspoguļo detalizēta lapas struktūra satura rādītāja formā. Šādu risinājumu īpaši novērtē lietotāji ar kognitīviem jeb informācijas uztveres traucējumiem. Taču ikdienā tas sniedz ievērojamas priekšrocības ikvienam lietotājam, jo atvērt nepieciešamo tīmekļvietni uzreiz ir daudz ātrāk un ērtāk nekā “ceļot” pa iznirstošām izvēlnēm vai klikšķināt no saites uz saiti, līdz atveras nepieciešamā lapa.

1.2. Testēšana

1.2.1. Navigācijas pārbaude datorā

·        Pārvietošanās lapā ar tastatūras TAB taustiņu (neizmantojot datorpeli) Pārbaudiet, vai, pārvietojoties lapā tikai ar TAB taustiņu, piekļūstat visiem galvenās navigācijas elementiem un variet atvērt apakšnavigācijas izvēlnes.

·        Screen reader (Chrome paplašinājums)

1.     Pievienojiet Screen reader rīku kā interneta pārlūka Chrome paplašinājumu;

2.    Atveriet interneta pārlūkā lapu, kuru vēlaties pārbaudīt;

3.    Nospiežot TAB taustiņu, rīks iezīmē navigācijas elementu un nolasa nosaukumu;

4.    Ar ekrāna lasītāju var pārbaudīt, vai galvenās navigācijas elementi ir nolasāmi, ir aprakstīta apakšnavigāciju izvēlne un norādīts, cik elementu tajā ir iekļauti.

Piemērs. Rīks “Screen reader” lapā nolasa galvenās navigācijas elementus, apraksta apakšnavigāciju un norāda elementu skaitu izvēlnē.

Latvijas tīmekļvietnes sākumlapa ar navigācijas elementiem

• Accessibility Insights

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes adresi, kuru vēlaties novērtēt;

2.    Aktivizējiet tastatūras piekļuves pārbaudes rīku (Accessibility Insights → TAB Stops ON);

3.    Nospiediet datora tastatūrā TAB taustiņu - tukšs aplis iezīmēs elementu, uz kura ir fokuss. Virzoties ar TAB taustiņu tālāk, Jums ekrānā tiks iezīmēts pārvietošanās “ceļš” konkrētajā tīmekļvietnes lapā.

4.    Pārliecinieties, ka:

• ar TAB taustiņu var piekļūt visiem tīmekļvietnes navigācijas elementiem un to apakšsadaļām (pārvietošanās pa apakšsadaļu izvēlnēm notiek ar Tab taustiņu (Tab uz priekšu, Shift + Tab atpakaļ);
• kustība pa tīmekļvietni ar TAB taustiņu ir secīga un konkrētās tīmekļvietnes lapas satura izkārtojums ir loģisks;
• vizuālais fokuss ir labi redzams, t.i., katrs navigācijas elements ir izcelts – ierāmēts vai izgaismots (plašāk par tastatūras vizuālo fokusu lasiet šo vadlīniju 3.nodaļā).

Piemērs. Pārvietojoties lapā ar TAB taustiņu redzams, ka navigācijas elementu izkārtojums nav secīgs - nevar piekļūt pie nākamā galvenās navigācijas elementa, ja pirms tam neapskata konkrētā elementa apakšnavigācijas izvēlni.

Latvijas tīmekļvietnes sākumlapas ekrānšāviņš ar rīka Accessibility Insights pārbaudi

1.2.2. Navigācijas pārbaude viedtālrunī

Tīmekļvietnes navigācijas piekļūstamības pārbaude viedtālrunī operētājsistēmās Android un iOS ir līdzīga. Abos gadījumos šī pārbaude tiek veikta ar ierīcē iebūvēto ekrāna lasītāju. Atšķiras tikai izmantojamā rīka nosaukums:

1.     Aktivizējiet viedtālruņa iestatījumos ekrāna lasīšanas rīku:

o   Ja izmantosiet pārbaudei viedtālruni ar operētājsistēmu Android, ierīces ekrāna lasītāja aktivizēšanas shēma ir šāda: Settings → Accessibility → Screen Reader → Voice Assistant (pogu var aktivizēt ar dubultklikšķi – pieskaroties tai ar pirkstu divas reizes pēc kārtas).

o   Ja izmantosiet pārbaudei viedtālruni ar operētājsistēmu iOS, ierīces ekrāna lasītāja aktivizēšanas shēma ir šāda: Settings → Accessibility → Voice Assistant (pogu var aktivizēt ar dubultklikšķi – pieskaroties tai ar pirkstu divas reizes pēc kārtas).

2.    Atveriet jebkurā no ierīcē pieejamajiem interneta pārlūkiem tīmekļvietni, kuru vēlaties pārbaudīt.

3.    Lai pārvietotos pa viedtālruņa ekrānu uz priekšu līdzīgi kā ar TAB taustiņu pa datora ekrānu, velciet ar pirkstu pa ierīces ekrānu (swipe) uz labo pusi. Lai pārvietotos atpakaļ, velciet ar pirkstu pa ierīces ekrānu uz kreiso pusi. Savukārt, lai aktivizētu kādu no tīmekļvietnes navigācijas elementiem, izmantojiet dubultklikšķi (pieskarieties konkrētajam elementam ierīces ekrānā ar pirkstu divas reizes).

4.    Pārliecinieties, ka:

o   jūs varat piekļūt visiem navigācijas elementiem, bet īpaši – elementiem, kas atrodas tīmekļvietnes galvenē;

o   jūs varat piekļūt visiem galvenajiem navigācijas elementiem pakārtotajiem elementiem, kas parasti tiek atspoguļoti kā iznirstošas izvēlnes (piemēram, lapas sadaļu apakšsadaļas);

o   vizuālais fokuss ir labi redzams, t.i., katrs navigācijas elements ir izcelts – ierāmēts vai izgaismots (plašāk par tastatūras vizuālo fokusu lasiet šo vadlīniju 3. nodaļā).

2. Pamatstruktūras pārbaude

Lai visi lietotāji varētu orientēties tīmekļvietnē, pārvietoties pa tās satura blokiem vienlīdz labi, nozīmīga loma ir pārdomātai šīs vietnes pamatstruktūrai. Proti, katram elementam, kas veido tīmekļvietnes pamatstruktūru (landmarks), ir jābūt ne vien piekļūstamam, bet arī jāpilda noteikta funkcija. Tradicionāli tīmekļvietnes pamatstruktūra tiek veidota no trīs satura blokiem: galvene, galvenais saturs un kājene. Taču var tikt izmantoti arī citi satura bloki, piemēram, sānu izvēlnes. Kas ir būtiski – neatkarīgi no tā, cik un kādi satura bloki tiek izmantoti, tiem jābūt redzamiem jeb nodalītiem gan vizuāli, gan funkcionāli. Tas nozīmē, ka šim dalījumam jābūt iestrādātam tīmekļvietnes HTML kodā. Ja tīmekļvietnes satura bloki tiek nodalīti tikai vizuāli, tie nav piekļūstami, jo ir ekrāna lasīšanas ierīcēm neredzami. Viena no biežāk izplatītākajām kļūdām, kas būtiski ierobežo tīmekļvietnes pamatstruktūras lietošanu ar dažādām palīgtehnoloģijām, ir tā, ka atsevišķus tās pamatstruktūras elementus var izmantot tikai ar datorpeli. Piemēram, ja lapas galvenos navigācijas elementus jeb sadaļas parasti var atvērt gan ar datora tastatūru, gan ar datorpeli, to apakšnavigācijas elementus jeb apakšsadaļas var atvērt tikai ar datorpeli, kas tās padara nepiekļūstamas lietotājiem, kuri ierīci ikdienā neizmanto.

2.1. Labā prakse

• Tīmekļvietnē drīkst būt tikai viens galvenais elements jeb satura bloks, kurā tiek ievietots lapas galvenais saturs. Navigācijas bloki var būt vairāki.
• Optimālais pamatstruktūras elementu skaits tīmekļvietnē ir 5 līdz 7. Ja to skaits ir lielāks, tīmekļvietnes navigācija ir apgrūtināta.
• Pamatstruktūras elementi ir jāievieto nevis vienā satura blokā, bet vairākos, sadalot tos pēc “piederības”. Piemēram, tīmekļvietnes galvenē tradicionāli tiek iekļauti trīs pamatstruktūras elementi: galvenās navigācijas elementi; elementi, kas ļauj mainīt lapas izskatu – burtu izmēru, valodu u.c.; meklētājs.

Labās prakses piemērs. Lapas pamatstruktūras elementi veidoti strukturēti – “galvenes navigācija”, “galvenais lapas saturs”, “kājenes navigācija” un “sociālā navigācija”.

Sliktās prakses piemērs. Lapā nav atrodami pamatstruktūras elementi un ekrāna lasītājs tos nevar nolasīt.

Latvijas tīmekļvietnes ekrānšāviņš ar pamatstruktūras elementiem.

Ieteikumi pamatstruktūras veidošanai:

• Veidojiet visus tīmekļvietnes elementus redzamus, jo slēpti elementi to padara nepiekļūstamu.
• Nodaliet galvenos pamatstruktūras elementus, iekļaujot tos dažādos satura blokos. Turklāt veidojiet šo dalījumu gan vizuālu, gan funkcionālu – iestrādājiet to tīmekļvietnes HTML kodā.
• Kontaktinformācijas sadaļu veidojiet brīvā tekstā, nevis tabulas formātā, jo ekrāna lasīšanas ierīču orientēšanās spējas tabulās ir ļoti ierobežotas. Šīs ierīces nolasa tabulās atspoguļoto informāciju pa šūnām (horizontāli), tāpēc cilvēkiem ar redzes traucējumiem ir ļoti jānopūlas, lai atcerētos kolonnu secību un izskaitļotu, kura šūna un uz kuru kolonnu attiecas. Īpaši sarežģīti viņiem ir uztvert tabulās atspoguļotu saturu, ja tajās ir apvienotas šūnas, jo nav skaidrs, kuras šūnu rindas vai kolonnas attiecas uz šo apvienoto šūnu kopumu. Ļoti bieži apvienoto šūnu princips tiek izmantots, atspoguļojot kontaktinformācijas sadaļā informāciju par darbiniekiem, kuri pārstāv vienu organizācijas struktūrvienību – nodaļu vai departamentu.
• Definējiet visus satura blokus un sekojiet līdzi tam, lai lapas funkcionālie elementi (piemēram, galvenā navigācija un meklētājs) atrodas to satura bloku rāmjos, uz kuriem tie attiecas.
• Iekļaujot tīmekļvietnē vairākus navigācijas blokus, ņemiet vērā, ka katram no tiem ir nepieciešams savs (unikāls) nosaukums.
• Neiekļaujiet tīmekļvietnes pamatstruktūras elementu saturu bloku nosaukumus šo bloku veidu nosaukumos. Piemēram, ja satura bloka veida nosaukums ir “Navigācija”, ir pietiekami, ja tajā iekļautā satura bloka nosaukums ir “Galvenā”, “Valodu” u.tml. To, ka šajā gadījumā runa ir par “Galveno navigāciju” un “Valodu navigāciju”, ekrāna lasīšanas ierīces sapratīs pašas.

2.2. Testēšana

Accessibility Insights

1.     Atveriet tīmekļvietni, kuru vēlaties pārbaudīt:

2.    Aktivizējiet pārbaudes rīku Accessibility Insights (Accessibility Insights → Ad Hoc Tools → Landmarks On). Jūsu datora ekrānā atvērsies logs, kurā būs redzami tīmekļvietnes struktūras elementi. Galvenie tās satura bloki tiks iezīmēti ar raustītu līniju, bet to labajā augšējā stūrī tiks atspoguļots konkrētā bloka nosaukums;

3.    Pārliecinieties, ka:

• tīmekļvietnes pamatstruktūru veido vismaz trīs elementi: galvene, galvenā daļa un kājene (šo elementu nosaukumi dažādās tīmekļvietnēs var atšķirties, taču tiem jābūt pietiekami saprotamiem, lai tos varētu atpazīt);
• visa informācija ir saprotama, ja to lasa redzamajā secībā, piemēram, virsraksti atrodas tieši virs informācijas, uz kuru tie attiecas;
• visiem informācijas blokiem ir virsraksti, turklāt tie ir loģiski un viegli saprotami (plašāka informācija par to, kā tiek veidoti piekļūstami virsraksti, pieejama šo vadlīniju 6. nodaļā).

4.    Atsevišķi varat pārliecināties, vai:

• tīmekļvietnes pamatstruktūrā ir iekļauts meklētājs;
• kontaktinformācija nav atspoguļota tabulas formātā:
• Atveriet sadaļu, kurā apkopota kontaktinformācija (ja atsevišķa sadaļa kontaktinformācijai tīmekļvietnē nav paredzēta – šī informācija ir iekļauta, piemēram, kājenē vai lapas sānu izvēlnē, pārbaudi ieteicams veikt tīmekļvietnes galvenajā lapā).
• Nospiediet jebkurā vietā uz ekrāna ar datorpeles labo taustiņu un izvēlieties izvēlnē opciju Pārbaudīt (Inspect) vai nospiediet taustiņu kombināciju Ctrl + Shift + I (visi taustiņi jāspiež vienlaicīgi). Ekrāna labajā pusē parādīsies konkrētās lapas HTML kods.
• Rūpīgi apskatiet šo kodu. Ja pie tabulas satura šajā kodā parādās atzīmes <tbody> (table body), <tr> (table row) vai <td> (table data), kontaktinformācija ir atspoguļota tabulas formātā, attiecīgi – tā nav piekļūstama.

3. Tastatūras piekļuve un vizuālais fokuss

Daudzi datoru lietotāji (piem. ar vāju redzi vai kustību traucējumiem), pārvietojoties tīmekļvietnēs, neizmanto peli, bet citu alternatīvo ierīci. Viens no populārākajiem veidiem ir tastatūra. Lietotāja saskarnēm tīmekļvietnē jābūt veidotām tā, lai tās varētu lietot bez peles. Lai pārvietotos pa tīmekļvietni ar tastatūru, pārsvarā tiek izmantots TAB taustiņš. Ja tīmekļvietne ir piekļūstama, ar TAB taustiņu iespējams piekļūt pilnīgi visiem tās elementiem – gan navigācijas elementiem, gan arī tekstam, attēliem, formām, multimediju vadīklām u.tml. Savukārt, ja tīmekļvietne ir daļēji piekļūstama vai nav piekļūstama, tās satura izmantošana ar tastatūru var būt ļoti apgrūtinoša. Lietotāji mēdz izmantot tastatūru, lai veiktu noteiktus uzdevumus tīmekļvietnē, piemēram, aizpildītu reģistrācijas veidlapu. Piekļūstamu tīmekļvietni veicina arī tas, ja tajā tiek nodrošināts tastatūras vizuālais fokuss jeb aktīvā elementa iezīmēšana (izcelšana). Tas būtiski atvieglo lapas navigāciju, jo skaidri parāda lietotājam, kur tieši tīmekļvietnes lapā viņš atrodas. Tastatūras lietojamība ir svarīga arī mobilajās ierīcēs. Bieži vien lietotāji ar ierobežojumiem mobilajās ierīcēs izmanto ārējo tastatūru, jo īpaši, ja šiem lietotājiem ir sarežģīti izmantot skārienu žestus.

3.1. Labā prakse

Tīmekļvietnes saturam jābūt piekļūstamam gan ar datorpeli, gan arī ar tastatūru un citām palīgtehnoloģijām. Labā prakse paredz arī to, ka:

• pārvietošanās secība ar TAB taustiņu caur visiem lapas elementiem ir loģiska un dabīga;
• visiem navigācijas elementiem jābūt fokusētiem jeb iezīmētiem – tiem ir jāizceļas, lai lietotājs vienmēr skaidri zina, kur tieši tīmekļvietnē viņš atrodas.

Tomēr, lai lietotāji varētu pilnvērtīgi izmantot tīmekļvietnes saturu ar tastatūru, gan tās piekļuves, gan arī vizuālā fokusa nodrošināšanā ir jāievēro vairāki būtiski nosacījumi.

3.1.1. Tastatūras piekļuves nodrošinājums

Iespēja pārvietoties pa tīmekļvietni, tās lapām ar TAB taustiņa palīdzību uz priekšu un atpakaļ vēl nenozīmē, ka tastatūras piekļuve ir pilnvērtīga:

• Tabulēšanas secībai jeb secībai, kādā kursors tiek pārvietots pa displeja ekrānu, ir jābilst loģiskai informācijas lasīšanas secībai – no augšas uz leju un no kreisās puses uz labo (uzskatāms piemērs atspoguļots 3. attēlā).
• Tīmekļvietnē nedrīkst būt tā dēvētās “tastatūras lamatas” (salīdzinoši visbiežāk tās ir sastopamas multimediju atskaņotāju vadīklās) – lietotājiem ir jābūt iespējai ar TAB taustiņu ne vien atvērt visus lapas elementus, bet arī aizvērt tos.
• Tīmekļvietnē nedrīkst būt arī tā dēvētās “iznirstošās lamatas”, ko var veidot modālie logi, ja tajos nav iespējas nofiksēt kursoru. Šai iespējai nofiksēt kursoru ir ļoti nozīmīga loma, lai lietotājs varētu pabeigt modālajos logos noteiktas darbības. Piemēram, apstiprināt sīkdatnes vai pagarināt, pārtraukt internetbankas sesiju. Proti, iespējai iziet no šiem logiem ir jābūt tikai tad, kad konkrētā darbība ir veikta.
• Ir jāparedz iespēja ar TAB taustiņu ne vien atvērt nolaižamos sarakstus, bet arī brīvi pārvietoties pa to izvēlnēm ar bulttaustiņiem (←↑↓→), turklāt darīt to, neveicot darbības. Viena no biežāk izplatītajām kļūdām šo sarakstu noformēšanā ir tā, ka, līdzko izvēlnē tiek nospiests bulttaustiņš, sarakstā tiek iezīmēts pirmais vienums un atveras jauna lapa, attiecīgi – citus vienumus atzīmēt nav iespējams.
• Ir jāparedz iespēja atvērt visas aktīvās saites, izmantojot taustiņu Enter.

Tāpat ir svarīgi paredzēt tā dēvētās noklusētās navigācijas iespējas jeb īsceļus (shortcut):

• ESC – modālo logu (sīkdatņu paziņojumi, reklāmas banneri u.c. logi, kas atveras pa virsu lapas saturam, ienākot tīmekļvietnē) aizvēršana;
• Enter – darbības apstiprinājums (identiska funkcionalitāte kā klikšķim ar datorpeles kreiso taustiņu)
• Ctrl + L – interneta pārlūka adrešu joslā esošās adreses kopēšana;
• Ctrl + Shift + T – pēdējās aizvērtās cilnes atvēršana;
• Ctrl + R vai F5 – konkrētās tīmekļvietnes lapas pārlādēšana jeb atjaunināšana (refresh).

Labās un sliktās prakses piemērs. Attēlā pa kreisi TAB taustiņa pārvietošanās “ceļš” pa displeju atbilst loģiskai informācijas lasīšanas secībai (no augšas uz leju, no kreisās puses uz labo). Savukārt attēlā pa labi šis “ceļš” neatbilst piekļūstamības prasībām, jo ir neloģisks (haotisks).

Divi ekrānšāviņi blakus. Katram pa virsu ar līnijām un cipariem attēlots TAB taustiņa pārvietošanās ceļš.

3.1.2. Tastatūras vizuālā fokusa nodrošinājums

Bieži vien tastatūras vizuālais fokuss estētisku apsvērumu dēļ tiek veidots teju nemanāms. Taču labā prakse paredz, ka aktīvajiem tīmekļvietnes lapas elementiem jābūt labi pamanāmiem jebkurā tīmekļvietnes skatā – arī visos iespējamajos kontrasta režīmos. Tāpēc piemērotākie risinājumi kvalitatīva vizuālā fokusa izveidei ir aktīvo lapas elementu izgaismošana vai ierāmēšana, izmantojot šim nolūkam tādu krāsu, kas kontrastē ar šo elementu pamata krāsu (uzskatāms piemērs atspoguļots 4. attēlā).

Divi epasta ievades lauka fokusa piemēri viens zem otra. Augšējam redzams tastatūras fokuss, apakšējam nē.

4.    attēls. Tastatūras vizuālā fokusa labās un sliktās prakses piemērs. Augšējā attēlā tastatūra vizuālais fokuss veidots pareizi – ierāmējot lapas aktīvo elementu (teksta logs “E-pasts”) ar kontrastējošu zilas krāsas līniju. Savukārt apakšējā attēlā šī fokusa nav vispār.

Īpaši nozīmīga loma labi pamanāmam vizuālajam fokusam ir saišu un formu lapu izcelšanā. Piemēram, gadījumos, kad saite tiek iestrādāta attēlā, bet šis attēls nav iezīmēts pietiekami skaidri, lietotājs var nesaprast, ka zem tā “slēpjas” saite, jo ar TAB taustiņu to aktivizēt nevar. Savukārt, ja formu lapas ir iezīmētas neskaidri vai nav iezīmētas vispār, lietotājs var nepamanīt, ka tās ir jāaizpilda, kas viņam var radīt dažādas neērtības. Piemēram, cilvēkiem ar redzes traucējumiem šādi var tikt liegta iespēja iegādāties to vai citu preci, jo viņiem nav iespējas aizpildīt visu tās pasūtījuma formu.

3.2. Testēšana

Ja plānojiet veikt tastatūras vizuālā fokusa pārbaudi interneta pārlūkā Chrome vai Firefox, ņemiet vērā, ka visi aktīvie lapas elementi, izmantojot tās navigācijai tastatūru, tiks iezīmēti pēc noklusējuma. Savukārt, ja veiksiet tastatūras vizuālā fokusa pārbaudi interneta pārlūkā Safari, jums tastatūras vizuālais fokuss ir jāaktivizē manuāli, jo šajā pārlūkā aktīvie lapas elementi pēc noklusējuma netiek iezīmēti. To var izdarīt pārlūka iestatījumos: Settings → Select System Preferences → Keyboard → All controls.

Ja ikdienā digitālā satura piekļuvei izmantojiet datorpeli, jums tastatūras piekļuves un vizuālā fokusa pārbaudes veikšanai lieti noderēs daži praktiski ieteikumi:

1.     Lai sāktu izmantot lapas navigācijai tastatūru, ieklikšķiniet ar datorpeli tās adreses joslā un nolieciet datorpeli malā.

2.    Lai pārvietotos pa lapas elementiem secīgi uz priekšu, nospiediet TAB taustiņu. Savukārt, lai pārvietotos pretējā virzienā, piemēram, atgrieztos pie iepriekšējā elementa, izmantojiet taustiņu kombināciju TAB + Shift (spiediet šos taustiņus vienlaicīgi).

3.    Lai pārvietotos pa tādiem lapas elementiem kā izvēļņu joslas un nolaižamie saraksti, izmantojiet tastatūrā iestrādātos bulttaustiņus (←↑↓→).

4.    Lai atlasītu nolaižamajā sarakstā noteiktu vienumu:

o   pārvietojieties ar TAB taustiņu uz nolaižamā saraksta logu;

o   izmantojiet bulttaustiņus, lai pārvietotu tastatūras vizuālo fokusu uz nepieciešamo vienumu;

o   atlasiet šo vienumu, nospiežot taustiņu Enter vai Space.

3.2.1. Tastatūras piekļuves un vizuālā fokusa pārbaude operētājsistēmā Windows

Ja jūs datorā lietojiet operētājsistēmu Windows, izmantojiet šī piekļūstamības aspekta pārbaudei rīku Accessibility Insights, kas ļauj izvērtēt tastatūras piekļuves un vizuālā fokusa atbilstību piekļūstamības principiem interneta pārlūkos Chrome un Microsoft Edge:

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes, kuru vēlaties novērtēt, adresi.

2.    Aktivizējiet tastatūras piekļuves pārbaudes rīku: Accessibility Insights → Ad Hoc Tools → TAB Stops → Show TAB Stops.

3.    Nospiediet datora tastatūrā vairākas reizes TAB taustiņu. Jums ekrānā tiks iezīmēts TAB taustiņa pārvietošanās “ceļš” konkrētās tīmekļvietnes lapā.

4.    Pārliecinieties, ka:

o   ar TAB taustiņu var piekļūt visam tīmekļvietnes saturam;

o   kustība pa tīmekļvietni ar šo taustiņu ir secīga, proti, konkrētās tīmekļvietnes lapas satura izkārtojums ir loģisks);

o   vizuālais fokuss ir labi redzams;

o   darbojas īsceļi, bet īpaši – ESC, kas ļauj aizvērt modālos logus.

Efektīvs veids, kā salīdzināt labo un slikto praksi tīmekļvietnes pamatstruktūras veidošanā, ir īpaši šim mērķim izstrādāta platforma, ko veidojusi WACG vadlīniju autori:

• Pārvietošanās ar TAB taustiņu pozitīvais piemērs . Nospiediet TAB taustiņu, lai pārvietotos pa lapas elementiem. Pievērsiet uzmanību, ka lielākajai daļai elementu, kad tie ir fokusā, parādās sarkans fons, bet radiopogas un ar tām saistītais saturs tiek izcelts ar punktētu rāmi.
• PPārvietošanās ar TAB taustiņu negatīvais piemērs . Nospiediet TAB taustiņu, lai pārvietotos pa lapas elementiem. Pievērsiet uzmanību, ka šajā lapā neviens elements nav fokusēts.

3.2.2. Tastatūras piekļuves un vizuālā fokusa pārbaude operētājsistēmā MacOS

Šajā gadījumā tastatūras piekļuves un vizuālā fokusa pārbaude ir jāveic interneta pārlūkā Safari, kas ir noklusētais operētājsistēmas MacOS interneta pārlūks:

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes, kuru vēlaties novērtēt, adresi.

2.    Aktivizējiet operētājsistēmas iestatījumos pārbaudes veikšanai nepieciešamo rīku: Safari-Preferences → Advanced (logā, kas atvērsies, izvēlieties ikonu, kas atgādina zobratu). Izvēlnes satura blokā Accessibility ieķeksējiet izvēles rūtiņu (check-box), kuras aprakstā ir teksts “Press Tab to highlight each item on a web page”.

3.    Nospiediet datora tastatūrā vairākas reizes TAB taustiņu. Ekrānā tiks secīgi vizualizēts jeb izcelts katrs tīmekļvietnes navigācijas un satura elements, pa kuru notiks pārvietošanās ar šo taustiņu.

4.    Pārliecinieties, ka:

o   ar TAB taustiņu var piekļūt visam tīmekļvietnes saturam;

o   kustība pa tīmekļvietni ar šo taustiņu ir secīga, proti, konkrētās tīmekļvietnes lapas satura izkārtojums ir loģisks);

o   vizuālais fokuss ir labi redzams;

o   darbojas īsceļi, bet īpaši – ESC, kas ļauj aizvērt modālos logus.

4. Formu lauki un kļūdu paziņojumi

Viens no nozīmīgākajiem tīmekļvietņu uzbūves elementiem, kas nodrošina kvalitatīvu lietotāju mijiedarbību ar to saturu, ir formas – viens vai vairāki lauki, kuros jāievada vai jāatzīmē noteikta informācija, ko vienmēr papildina viena poga, kas ir vērsta uz konkrētu darbību, piemēram: “apstiprināt”, “meklēt”, “pirkt”, “sūtīt” u.c. Visbiežāk tīmekļvietnē ir sastopamas divas formas: “meklētājs” un “lietotāju autentifikācijas” rīks. Salīdzināšanai var minēt, ka e-pasta formai ir raksturīgi divi lauki (lietotājvārds un parole) un poga “pierakstīties” (sign in). Taču mēdz būt formas, kuru lauku skaits ir lielāks (piemēram, pasūtījumu noformēšanas formas). Atsevišķos gadījumos (piemēram, elektroniskajās aptaujas anketās) to skaits var sasniegt pat vairākus desmitus. Lai formu lauki tiktu aizpildīti pareizi, tiem ir jāpievieno instrukcijas. Tomēr šo instrukciju esamība neizslēdz kļūdu iespējamību. Pirmkārt, ne vienmēr ir saprotams, kāda tieši informācija un kurā laukā ir jāievada. Otrkārt, aizpildot formu laukus, var tikt pieļautas drukas kļūdas (cilvēciskais faktors). Un, treškārt, kļūdas informācijas lauku aizpildīšanas brīdī var rasties tīmekļvietnes līmenī (sistēmas kļūdas). Tāpēc lietotāji par visām kļūdām tiek informēti ar īpašu kļūdas paziņojumu palīdzību, kuriem, līdzīgi kā formu laukiem, ir jābūt piekļūstamiem. Piemēram, ja lietotājs vēlas pasūtīt kādu preci, bet pasūtījuma noformēšanas veidlapā pieļauj kļūdu, tieši no tā, cik kvalitatīvs ir kļūdu paziņojums, ir atkarīgs tas, vai viņš pasūtījumu noformēs līdz galam.

4.1. Labā prakse

• Formām un to laukiem jābūt piekļūstamiem ne vien ar datorpeli, bet arī citos alternatīvajos veidos – tikai ar datora tastatūru (plašāka informācija par tastatūra piekļuvi pieejama šo vadlīniju 3. nodaļā), balss ievadi vai ekrāna lasītāju;
• Formu lauku aizpildīšanas instrukcijām ir jābūt ļoti precīzām. Tikpat precīziem ir jābūt arī kļūdu paziņojumiem. Tiem jāparādās katru reizi, kad kādā no laukiem informācija tiek ievadīta nepareizi, lai kļūdas var novērst ātri un efektīvi;
• Lietotājiem ir jānodrošina pietiekami daudz laika formu lauku aizpildīšanai. Piemēram, cilvēki ar redzes traucējumiem, pateicoties ekrāna lasīšanas ierīcēm, digitālo saturu uztver labi un tajā orientējas salīdzinoši ātri. Tomēr pārslēgšanās starp cilnēm un lietotnēm (piemēram, ja kods, kas nepieciešams, lai autorizētos tajā vai citā tīmekļvietnē, tiek nosūtīts uz e-pastu) viņiem var prasīt vairāk laika nekā citiem lietotājiem.

Ieteikumi piekļūstamu formu lauku veidošanai:

• Veidojiet īsus, kodolīgus formu lauku nosaukumus, kas skaidri raksturo to mērķi, piemēram: “vārds, uzvārds”, “e-pasta adrese”, “tālruņa numurs”;
• Norādiet formu lauku nosaukumos nepieciešamo informācijas ievadīšanas formātu. Piemēram, datuma ievadīšanas formāts var tikt atspoguļots ļoti dažādi: “datums.mēnesis.gads” formātā “00.00.0000”, “mēnesis.datums.gads” formātā “00/00/00”, “mēnesis.gads” formātā “00/0000” u.tml.;
• Norādiet, kuri formas lauki ir aizpildāmi obligāti un kuri nē. Izmantojiet šim nolūkam kādu indikatoru, piemēram, zvaigznīti (*). Šim indikatoram jābūt iekļautam lauka nosaukumā, kas ir iezīmēts konkrētās lapas kodā, vai arī radiopogu un izvēles rūtiņu apzīmējumos. Ja tas būs izcelts tikai vizuāli (piemēram, ar sarkanu krāsu), lietotāji ar redzes traucējumiem šo indikatoru neuztvers;
• Nodrošiniet lietotājiem formu aizpildīšanai optimālu laiku, pirms to sesijas tiek pārtrauktas. Minimālais formas aizpildīšanai paredzētais laiks nedrīkst būt mazāks par 1 minūti;
• Sasaistiet izvēles rūtiņu un radiopogu grupas, izmantojot lauka iestatījumus;
• Ievietojiet lauku vispārējās instrukcijas virs konkrētās formas vai konkrētās sadaļas augšpusē;
• Izkārtojiet formu laukus loģiskā secībā un veidojiet loģisku to navigācijas secību;
• Izmantojiet tā dēvētos “veiksmes paziņojumus” jeb nodrošiniet lietotājiem atgriezenisko saiti. Piemēram, paredziet to, ka uzreiz pēc pogas “meklēt” nospiešanas virs vai zem meklētāja formas parādās informācija par meklēšanas rezultātiem – vai un cik satura vienības, kurās ietverts konkrētais atslēgvārds, tīmekļvietnē ir atrastas. Īpaši svarīga šī atgriezeniskā saite ir gadījumos, kas jāaizpilda apjomīgākas formas, piemēram, aptaujas anketas un pasūtījumu noformēšanas veidlapas. Jo lietotājiem ir jāsaprot, vai anketa ir iesniegta, pasūtījums ir noformēts veiksmīgi u.tml.

Ieteikumi kļūdas paziņojuma veidošanai:
Kļūdas formu laukos tiek apzīmētas trīs veidos: ar īpašiem teksta paziņojumiem, ar izsaukuma zīmi un ar kontrastējošu krāsu (parasti – sarkanu). Lai kļūdu paziņojumus varētu uztvert ikviens lietotājs – arī cilvēki, kuri neatšķir krāsas, tajos nav ieteicams fokusēties tikai uz vienu no kļūdu apzīmēšanas veidiem, piemēram, kontrastējošu krāsu. Ir jākombinē vismaz divi elementi (uzskatāms piemērs, kā veidot kļūdas paziņojumu, atspoguļots piemērā zemāk). Taču ņemiet vērā, ka šie paziņojumi nav jāveido visām kļūdām. Vienkāršākām formām (piemēram, meklēšanas laukam) tie nav nepieciešami. Ja kļūdu izraisījis cilvēciskais faktors, kļūdas paziņojumā tiek norādīts, kurā laukā un kāda veida kļūda ir pieļauta. Savukārt, ja kļūda ir radusies sistēmā, šajā paziņojumā tiek norādīts, ka konkrētā darbība (piemēram reģistrēšanās noteikta pakalpojuma saņemšanai vai pirkuma noformēšana e-veikalā) nav izdevusies. Turklāt ir svarīgi paredzēt iespēju izlasīt šos paziņojumus gan fiziski (ar acīm), gan ar ekrāna lasīšanas ierīcēm, tāpēc: Veidojiet šos paziņojumus īsus un koncentrētus. Iekļaujiet šajos paziņojumos precīzus norādījumus par to, kuros laukos un kādas tieši kļūdas ir fiksētas, kā arī – kā šīs kļūdas novērst. Piemēram, ja nepareizi ir ievadīts datums, laiks vai adrese, kļūdas paziņojumā jābūt norādītam pareizajam šīs informācijas ievades formātam. Veidojiet kļūdu paziņojumu instrukcijas vienkāršās un viegli uztveramas. Izvietojiet kļūdas paziņojumu pirms formas, uz kuru tas attiecas, nevis aiz tās.

Piemērs. Kļūdas paziņojuma izveides labās un sliktās prakses piemērs. Augšējā attēlā kļūdas paziņojums ir iezīmēts, turklāt vairāk nekā vienā veidā. Turklāt zem kļūdas lauka ir izskaidrota kļūda. Savukārt apakšējā attēlā kļūdas paziņojums ir iezīmēts tikai vienā veidā, turklāt kļūda nav izskaidrota.

2 paroles ievades lauku un kļūdu paziņojumu piemēri viens zem otra. Augšējā piemērā kļūdas paziņojumam ir paskaidrojuma teksts un ikona, apakšējā - nav.

Gadījumos, kad tīmekļvietnes formās tiek fiksētas kļūdas, ir svarīgi, lai viss to laukos ievadītais saturs, izņemot sensitīvos datus (piemēram, kredītkaršu numurus), nepazūd arī pēc lapas atjaunināšanas, lai lietotājiem nav jātērē laiks atkārtotai informācijas ievadei.

Labās prakses piemērs (pārbaudīts ar ekrāna lasītāju). Ekrāna lasītājs nolasa formas lauku nosaukumus, pasaka, kuri ir obligāti aizpildāmi. Ja lauki nav aizpildīti pareizi, lasītājs nolasa kļūdas paziņojumu.

Saziņas formas lauka piemērs ar kļūdas paziņojumu par nepareizas informācijas norādi

Sliktās prakses piemērs (pārbaudīts ar ekrāna lasītāju).
Šajā gadījumā formas lauks obligāti pieprasa norādīt e-pastu vai lietotājvārdu un paroli (obligāti aizpildāmais lauks atzīmēts ar *), bet ekrāna lasītājs šo nenolasa.

Lietotājvārda un paroles ievades lauku piemērs. Abi lauki jāievada obligāti

Tāpat ekrāna lasītājs nenolasa kļūdas paziņojumu – “Nepareizs lietotājvārds vai parole”.

Kļūdas paziņojums, kuru ekrāna lasītājs nenolasa - nepareizs lietotājvārds vai parole

4.2. Testēšana

Formu, lauku nosaukumu un kļūdu paziņojumu pārbaudei atbilstoši piekļūstamības principiem, tiek izmantotas ekrāna lasīšanas ierīces. Piemēram, Google Chrome “Screen Reader”, McOS – “Voice Over”, Windows - NVD. Tā kā formu un lauku nosaukumi datorā un viedtālrunī tiek atspoguļoti līdzīgi, bet navigācija, kas ir būtisks priekšnosacījums, lai piekļūtu formām, tiek atspoguļota atšķirīgi, to testēšana ir jāveic gan datorā, gan viedtālrunī.

Formu lapu un kļūdu paziņojumu pārbaude interneta pārlūkā Chrome

Chrome rīks “Screen Reader”

1.     Pievienojiet Screen reader rīku kā interneta pārlūka Chrome paplašinājumu. Līdzko tas būs izdarīts, ekrāna lasītājs ieslēgsies automātiski.

2.    Atveriet interneta pārlūkā lapu, kuru vēlaties pārbaudīt;

3.    Atrodiet tajā visas formas.

4.    Pārliecinieties, ka:
• visam lapas saturam, tostarp formu laukiem (arī visiem nolaižamo sarakstu vienumiem), var piekļūt ar tastatūru un ekrāna lasītāju. Ekrāna lasītājs atskaņos informāciju par to, kurā vietā tīmekļvietnē tieši jūs atrodaties (piemēram, navigācijas joslā), cik apakšsadaļas ir konkrētajai sadaļai, kā arī secīgi nolasīs formas lauku, kuri konkrētajā brīdī būs fokusā, nosaukumus; • katram formas laukam ir nosaukums, turklāt tas ir viegli uztverams un saprotams; • izvēlnēs ir iespēja brīvi pārvietoties uz augšu un uz leju, izmantojot tastatūrā iestrādātos bulttaustiņus (←↑↓→);

5.    Izvēlieties vienu no formām un aizpildiet to ar tastatūru, pieļaujot kādā no laukiem kļūdas.

6.    Pārliecinieties, ka:
• formā (virs tās un/vai pie konkrētā formas lauka) parādās kļūdas paziņojums; ar tastatūru un ekrāna lasītāju var piekļūt kļūdas paziņojumam, turklāt ekrāna lasītājs to nolasa pietiekami kvalitatīvi – tā, lai lietotājam, neredzot šo paziņojumu, ir skaidrs, kur un kādas tieši kļūdas ir pieļautas un kā tās izlabot; • pēc lapas atjaunošanas formas laukos saglabājas visa korekti ievadītā informācija, izņemot sensitīvos datus.

Formu lauku un kļūdu paziņojumu pārbaude interneta pārlūkā Safari

Ja interneta pārlūkā Chrome formu lapu un kļūdu paziņojumu pārbaude tiek veikta ar īpašu rīku, interneta pārlūkā Safari šī piekļūstamības aspekta izvērtēšana tiek veikta ar operētājsistēmā MacOS iebūvēto ekrāna lasītāju:

1.     Atveriet tīmekļvietni vai tās sadaļu, ko vēlaties pārbaudīt.

2.    Atrodiet tajā visas formas.

3.    Aktivizējiet ierīces iestatījumos ekrāna lasītāju: Settings → System Preferences → Accessibility → Voice Over.

4.    Pārliecinieties, ka:

o   Visam lapas saturam, tostarp formu laukiem (arī visiem nolaižamo sarakstu vienumiem), var piekļūt ar tastatūru un ekrāna lasītāju. Ekrāna lasītājs atskaņos informāciju par to, kurā vietā tīmekļvietnē tieši jūs atrodaties (piemēram, navigācijas joslā), cik apakšsadaļas ir konkrētajai sadaļai, kā arī secīgi nolasīs formas lauku, kuri konkrētajā brīdī būs fokusā, nosaukumus.

o   Katram formas laukam ir nosaukums, turklāt tas ir viegli uztverams un saprotams.

o   Izvēlnēs ir iespēja brīvi pārvietoties uz augšu un uz leju, izmantojot tastatūrā iestrādātos bulttaustiņus (←↑↓→).

5.    Izvēlieties vienu no formām un aizpildiet to ar tastatūru, pieļaujot kādā no laukiem kļūdas.

6.    Pārliecinieties, ka:

o   formā (virs tās un/vai pie konkrētā formas lauka) parādās kļūdas paziņojums;

o   ar tastatūru un ekrāna lasītāju var piekļūt kļūdas paziņojumam, turklāt ekrāna lasītājs to nolasa pietiekami kvalitatīvi – tā, lai lietotājam, neredzot šo paziņojumu, ir skaidrs, kur un kādas tieši kļūdas ir pieļautas un kā tās izlabot;

o   pēc lapas atjaunošanas formas laukos saglabājas visa korekti ievadītā informācija, izņemot sensitīvos datus.

5. Attēlu tekstuālā alternatīva

Digitālajā vidē attēlu piekļūstamību nodrošina attēlu tekstuālā alternatīva jeb tā dēvētie ALT teksti. ALT teksts ir vizuālā attēla apraksts, ko, piem., neredzīgajiem lietotājiem nolasa ekrāna lasītājs. ALT tekstu nozīme- veicināt veiksmīgu lietotāju mijiedarbību ar tīmekļvietnes saturu; uzlabot organizāciju rezultātus Google meklētājā; sniegt aprakstu, ja attēla failu nav iespējams apskatīt (piem., lēns internets). Attēlu dizainu ALT teksti nekādi neietekmē, jo ar neapbruņotu aci nav saskatāmi. Tos “redz” tikai ekrāna lasīšanas ierīces, kā arī lietotāji, kuri datoros atslēdz attēlu atspoguļošanas funkciju, lai paātrinātu lejupielādi situācijās, kad ir vājš interneta signāls. Proti, ALT teksti tiek iekļauti attēla lapas koda iezīmēs. Piemēram, šādi: <img src="pointer_to_image.png" alt="šeit ir redzama tekstuālā alternatīva">.

5.1. Labā prakse

• ALT tekstam precīzi jāapraksta attēls;
• ALT tekstam jābūt kodolīgam, bet jāizvairās no viena vārda apraksta;
• ALT teksti jāveido visiem attēliem;
• ALT tekstu aprakstā nevajag iekļaut vārdus “attēls” vai “bilde”.

Attēlu tekstuālās alternatīvas tiek veidotas, ņemot vērā to funkcionalitāti. Kopumā izšķir trīs veidu attēlus – dekoratīvos, funkcionālos un statiskos.

5.1.1. Dekoratīvo attēlu noformējums

Tie ir vizuāli elementi, kas tiek izmantoti satura noformējumam, taču to nekādi neietekmē, tāpēc var tikt pieņemts, ka lietotājiem par tiem nav jāzina. Tipiskākie dekoratīvo attēlu piemēri ir ikonas un bildes, kas tiek izmantotas uzmanības piesaistīšanai. Šie attēli tiek apzīmēti ar tā dēvēto nulles ALT tekstu: alt=““.

Piemērs. Lapā norādītas vairākas satura izvēlnes, kurām pievienotas arī vizuālās ikonas. Šajā gadījumā ikonām ir dekoratīva nozīme, jo tās tikai papildina satura tekstuālo noformējumu

Ārzemju iepirkšanās tīmekļvietnes sākumlapa ar preču kategoriju izvēlni.

5.1.2. Funkcionālo attēlu noformējums

Funkcionālie attēli ir orientēti uz darbību – var pildīt saites funkcijas (uzklikšķinot uz attēla, atveras noteikta saite) vai raksturot noteiktas darbības (piemēram, meklēšanas logs, valodu izvēlne, poga sīkdatņu apstiprināšanai), tāpēc to tekstuālajām alternatīvām nav tieši jāapraksta attēlā redzamais. Pirmajā gadījumā ALT tekstā ir jānorāda konkrētās saites funkcija, piemēram: “Atvērt privātuma politiku”, “Lejupielādēt Ministru kabineta noteikumus Nr.18”Kārtība, kādā novērtē paredzētās darbības ietekmi uz vidi un akceptē paredzēto darbību”. Savukārt otrajā gadījumā ALT tekstā ir jānorāda attēla funkcija. Piemēram, meklēšanas pogai piemērotākā tekstuālā alternatīva būtu “meklēt” vai “sākt meklēšanu”, nevis “lupa”.
Šajā gadījumā, veidojot tekstuālās alternatīvas saistītajiem attēliem, ir jāievēro vienots stils:

• Pozitīvs piemērs navigācijas attēlu aprakstiem: “sadaļa Kontakti”, “sadaļa Par mums”, “sadaļa Darbības jomas”, “sadaļa Noderīgi”.
• Negatīvs piemērs navigācijas attēlu aprakstiem: “Kontakti”, “sadaļa Par mums”, “atvērt Darbības jomas”, “sadaļa Noderīgi”.

5.1.3. Statisko attēlu noformējums

Statisko attēlu mērķis ir papildināt tīmekļvietnes vai mobilās lietotnes saturu – fotogrāfijas, diagrammas, plakāti, infografikas, darba sludinājumi, reklāmas banneri u.c. Šajā gadījumā attēlu tekstuālajām alternatīvām jābūt daudz izsmeļošākām – tām ir jānodod lietotājiem attēla nozīme. Lai statiskajiem attēliem pievienotie ALT teksti būtu funkcionāli, to izveidē jāievēro šādas nianses:

• Izvairieties no vispārīgiem aprakstiem, piemēram, “IMG_2045”, “plakāts”, “Rīga” u.tml., jo tie nesniedz informāciju par konkrētā attēla saturu.
• Neizmantojiet attēlu aprakstos SEO atslēgvārdus, piemēram, “piekļūstamības ekspertu konsultācijas”, “kvalitatīvas piekļūstamības konsultācijas”, “piekļūstamības konsultācijas uzņēmējiem”, “piekļūstamības konsultācijas valsts pārvaldei” u.tml.
• Nedublējiet attēlu aprakstos informāciju, kas ir ietverta saturā, ko tie papildina. Piemēram, ziņas, paziņojuma virsraksts nav uzskatāms par kvalitatīvu ALT tekstu attēlam, kas tajā tiek izmantots kā ilustrācija.
• Izmantojiet īsus, koncentrētus tekstus, piemēram: “Uz galda stāv atvērta piena paka un krūze.” vai “Uzņēmuma vadītājs pasniedz balvu labākajam darbiniekam.” Optimālais ALT teksta garums ir līdz 250 rakstu zīmēm.
• Izvairieties no liekvārdības. Nesāciet aprakstu ar tekstu “Attēlā redzams…” un neizmantojiet ALT tekstos tādus vārdus kā “poga”, “saite”, “attēls”. Ekrāna lasīšanas ierīces šo informāciju nodrošina automātiski.
• Miniet attēla aprakstā krāsas, ja tām ir nozīme.
• Nebaidieties no humora, jo ALT tekstiem nav jābūt formāliem. Īpaši, ja attēls ir smieklīgs.
• Ja attēlā (piemēram, logotipā, reklāmas plakātā, darba sludinājumā, grafikā) ir iekļauts teksts, tas ir jāatspoguļo arī šī attēla tekstuālajā alternatīvā. Ja šis teksts ir apjomīgs un sarežģīts, iekļaujiet attēlu aprakstos tikai svarīgāko informāciju par to saturu un pievienojiet saiti uz tīmekļvietni, kurā pieejama detalizētāka informācija par pakalpojumu, pasākumu, vakanci, pētījuma rezultātiem u.tml. tekstuālā formātā.
• Ja iespējams, piesaistiet ALT tekstu izveidei nozares ekspertus. Tas ļaus izveidot kvalitatīvākas attēlu tekstuālās alternatīvas, jo jūs varat nepārzināt visas ar to vai citu tēmu saistītās nianses. Īpaši svarīgi tas ir, aprakstot dažādas preces un pakalpojumus. Tā ir šķietami nenozīmīga nianse, kurai dažkārt var būt ļoti nozīmīga loma attēla nozīmes paskaidrošanā. Piemēram, suņu audzētāju kluba tīmekļvietnē ievietoto attēlu aprakstos vēlams norādīt ne vien to, ka attēlā redzams suns, bet arī konkrētā suņa šķirnes nosaukumu. Savukārt, ja šis pats attēls ar suni tiek ievietots, lai padarītu vizuāli pievilcīgāku kāda parka tīmekļvietni vai ilustrētu rakstu, kurā ir aprakstītas aktīvās atpūtas iespējas ģimenēm, tā apraksts var būt vispārīgāks.

Labās prakses piemērs ALT tekstam: “Āboliņu pļavā novietots zils spainis ar sarkanām zemenēm”

Sliktās prakses piemērs ALT tekstam: “Zemenes”

Āboliņu pļavā novietots zils spainis ar sarkanām zemenēm

5.2. Testēšana

ALT teksti ir viens no piekļūstamības principiem, kuru pārbaudei ieteicams kombinēt automatizētos un lietotāju testus:

• automatizētie testi ir piemēroti, lai ātri noteiktu attēla tekstuālās alternatīvas esamību vai neesamību. Šim nolūkam var izmantot dažādus rīkus, piemēram, Wave, ALT Text Tester un Image ALT;
• ar lietotāju testiem var noteikt, vai šie apraksti ir jēgpilni – vai tie atspoguļo attēla saturu.

ALT Text Tester rīks

1.     Pievienojiet ALT Text Tester kā Chrome paplašinājumu;

2.    Atveriet tīmekļvietnes lapu vai sadaļu, kuru vēlaties pārbaudīt;

3.    Jūsu datora ekrānā atvērsies logs, kurā būs uzskaitīti visi tajā publicētie attēli.

4.    Novietojiet datorpeles kursoru uz izvēlētā attēla vai iezīmējiet to ar tabulatora palīdzību. Datora ekrānā parādīsies teksta logs. Ja attēlam ir pievienots ALT teksts, tas būs uzreiz nolasāms. Ja ALT teksts nav pievienots, šajā logā uzrādīsies teksts “ALT Text Missing”.

5.    Pārbaudiet divas lietas:

• vai visiem tīmekļvietnē publicētajiem attēliem (gan fotogrāfijām, grafikiem, plakātiem u.tml., gan arī ikonām, logotipiem un navigācijas pogām) ir pievienoti ALT teksti;
• vai šie teksti ir izveidoti korekti – atbilstoši iepriekš aprakstītajiem labās prakses piemēriem.

Piemērs. Pēc rīka ALT Text Tester aktivizēšanas, tiek uzskaitīti visi attēli lapā. Novietojot peles kursoru uz attēla piemērā, parādās pievienotais ALT teksts.

Skats no tīmekļvietnes ar ALT tekstu piemēru attēliem

6. Virsraksti

Virsraksti ir lapas satura “mugurkauls”. Cilvēkam ir grūti uztvert lielu informācijas apjomu, kas izkārtots vienlaidus. Virsraksti tiek izmantoti, lai izveidotu loģisku satura struktūru, kā arī sadalītu to tematiskajos blokos, tā uzskatāmi norādot, kāda informācija tekstā ir primārā (galvenā) un kāda tai ir pakārtota. veidots tīmekļvietnes satura vadības sistēmā, attiecīgi – tas ir iezīmēts tīmekļvietnes kodā. Virsrakstu strukturēšana palīdz orientēties tīmekļvietnē lietotājiem, kuri:

• izmanto ekrāna lasīšanas ierīces (tām ir atsevišķa funkcija, kas nodrošina tikai virsrakstu lasīšanu);
• izmanto navigācijai tikai tastatūru, jo kāda iemesla dēļ nevar izmantot datorpeli (piemēram, viņiem ir kustību traucējumi rokās).

6.1. Labā prakse

Piekļūstami virsraksti ir ne vien viegli uztverami satura un noformējuma ziņā, bet arī nodala dažādus satura elementus un ir izkārtoti loģiskā, jēgpilnā secībā jeb hierarhijā. Pretējā gadījumā tīmekļvietnes struktūras kods būs nepareizs un tās mijiedarbība ar lietotājiem būs apgrūtināta vai neiespējama.

• Katrā lapā izmantojiet vienu unikālu virsrakstu “h1”, kas apraksta, par ko ir šī lapa. Vairāku “h1” virsrakstu izmantošana ir slikta prakse gan piekļūstamības, gan SEO aspektā;
• Izmantojiet virsrakstus, lai aprakstītu lapas saturu, nevis tāpēc, lai teksts izskatītos lielāks un izceltos;
• Izmantojiet virsrakstu līmeņus tāpat kā grāmatu satura rādītājus – hierarhijā;
• Izvēlieties virsrakstu nevis pēc tā lieluma, bet gan pēc tā līmeņa satura kontekstā;
• Neizlaidiet kādu no virsraksta līmeņiem. Piemēram, virsraksts “h2” tiek pievienots aiz virsraksta“h1”.

Hierarhija nozīmē, ka virsraksti sakārtoti secībā no vissvarīgākā līdz vismazāk svarīgajam. “H1” ir vissvarīgākais virsrakstu līmenis, “h6” - vismazāk svarīgais.

Virsrakstu hierarhijas piemērs.

• h1 = Lapas virsraksts - h2 = apakšvirsraksts lapas saturā - h3 = h2 apakšvirsraksts
• h4 = h3 apakšvirsraksts - h2 = apakšvirsraksts lapas saturā - h2 = Saistītās ziņas (blakus sadaļa) - h2= Sazinieties ar mums (kājenes sadaļā) - h3= adrese (adreses informācija) - h3 = Sekojiet mums (saites uz sociālajiem medijiem)

Labās prakses piemērs. Virsrakstu struktūra lapā veidota loģiskā secībā – hierarhijā.

Latvijas tīmekļvietnes virsrakstu struktūras pārbaude

Sliktās prakses piemērs. Virsrakstu struktūras līmeņos nav ievērota hierarhija. Piemēram, lapā nav galvenā virsraksta “h1”, pēc virsraksta “h3” seko “h5”.

Ārzemju tīmekļvietnes ziņu lapas virsrakstu struktūras pārbaude

6.2. Testēšana

Virsrakstu piekļūstamību var pārbaudīt pēc virsrakstu iezīmēm un to struktūras.

6.2.1. Virsrakstu iezīmju pārbaude

Virsrakstu iezīmes jeb to, vai teksts, kas vizuāli izskatās pēc virsraksta, patiešām tāds arī ir, var noteikt ar tādiem rīkiem, kā piem., Wave un Accessibility Insights. Par virsrakstu iezīmēm uzskatāmi to līmeņu apzīmējumi – “h1”, “h2”, “h3” u.c.

Lai pārbaudītu virsrakstu iezīmes ar Wave rīku:

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes adresi, kuru vēlaties novērtēt;

2.    Uzklikšķiniet Wave rīka izvēlnē uz pogas Wave This Page. Pie visiem virsrakstiem, kas ir iezīmēti tīmekļvietnes kodā, parādīsies mazas ikonas. Savukārt pie virsrakstiem, kas nav funkcionāli, šādas ikonas nebūs;

3.    Pārbaudiet trīs lietas:

o   vai tīmekļvietnes strukturējumā ir uzskaitīti visi virsraksti;

o   vai visi teksti, kas vizuāli atgādina virsrakstus, tādi arī ir -vai tie ir iekļauti tīmekļvietnes strukturējumā;

o   vai tīmekļvietnes strukturējumā nav iekļauts kāds elements, kas nav virsraksts.

Piemērs. Virsrakstu pārbaude ar Wave rīku.

Virsrakstu pārbaude ar Wave rīku

Līdzīgi kā tastatūras piekļuves un vizuālā fokusa pārbaudes gadījumā, arī virsrakstu iezīmju veidošanas labo un slikto praksi var salīdzināt īpaši šim mērķim izstrādātajā platformā, ko veidojusi WACG vadlīniju autori:

• Virsrakstu iezīmju veidošanas pozitīvais piemērs . Aktivizējiet šajā tīmekļvietnē rīku Wave vai Accessibility Insights. Pievērsiet uzmanību ikonām, kas atrodas pie virsrakstiem. Tās apliecina, ka virsraksti ir funkcionāli.
• Virsrakstu iezīmju veidošanas negatīvais piemērs . Aktivizējiet šajā tīmekļvietnē rīku Wave vai Accessibility Insights (Accessibility Insights → Ad Hoc Tools → Headings). Pievērsiet uzmanību, ka pie teksta, kas vizuāli atgādina virsrakstu, nav ikonas. Tas nozīmē, ka šis virsraksts nav funkcionāls.

6.2.2. Virsrakstu strukturējuma pārbaude

Virsrakstu struktūru var pārbaudīt ar rīku HeadingsMap. Par virsrakstu iezīmju strukturējumu uzskatāma to hierarhija jeb tīmekļvietnes kodā iezīmētā virsrakstu struktūra.
HeadingsMap

1.     Pievienojiet HeadingsMap kā Chrome (vai Firefox) paplašinājumu;

2.    Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes adresi, kuru vēlaties pārbaudīt;

3.    Uzklikšķiniet uz HeadingsMap ikonas. Ekrānā tiks atvērts tīmekļvietnes satura koks;

4.    Pārbaudiet divas lietas:

·        vai šo virsrakstu struktūra ir loģiska (piemēram, vai zem kāda virsraksta kā apakšvirsraksti neparādās virsraksti, kas uz konkrēto tēmu neattiecas);

• vai tīmekļvietnes strukturējumā ir uzskaitīti visi virsraksti.

Arī šajā gadījumā labo un slikto praksi var salīdzināt WACG vadlīniju autoru izveidotajā platformā:

• Virsrakstu struktūras pozitīvais piemērs . Aktivizējiet šajā tīmekļvietnē rīku Headings Map (Chrome) Pievērsiet uzmanību, ka šajā gadījumā tīmekļvietnes virsrakstu strukturējums ir ļoti precīzs.
• Virsrakstu struktūras negatīvais piemērs . Aktivizējiet šajā tīmekļvietnē rīkus Headings Map vai A11y-Outliner. Pievērsiet uzmanību, ka šeit ir tikai viens virsraksts.

7. Krāsu kontrasti

Viens no galvenajiem tīmekļvietnes saskarnes piekļūstamību raksturojošajiem aspektiem ir krāsu kontrasti jeb vairāk vai mazāk izteiktas teksta un tā fona krāsas atšķirības, kas palīdz uztvert informāciju. Krāsu kontrasts ir attiecība starp tekstu (vai grafiku) un fona krāsu. Lai tīmekļvietnē publicētā informācija būtu piekļūstama, tās noformējumā izmantoto krāsu kontrastam jābūt optimālam. Tas attiecas ne vien uz teksta noformējumu, bet arī uz attēlu kompozīcijām, tīmekļvietnes navigācijas elementu dizainu un citiem vizuāliem elementiem.

Piemēram, gados vecākiem cilvēkiem parasti zūd krāsu kontrastu jutīgums, kas ir raksturīga vājredzīgu cilvēku redzes īpatnība. Tas nozīmē, ka šīs lietotāju grupas labāk uztver informāciju, kuras noformējumā izmantoti augsti krāsu kontrasti, piemēram, klasiskā melnās un baltās krāsas kombinācija. Tajā pašā laikā cilvēkiem, kuri sirgst ar disleksiju (informācijas uztveres traucējumi, kas izpaužas kā grūtības lasīt un uztvert rakstītu tekstu), augsti krāsu kontrasti informācijas uztveri var būtiski apgrūtināt dēļ to spilgtuma. Viņi labāk uztver krāsas, kurām ir augsts krāsu kontrasta koeficients, bet samērīgs krāsu spožuma kontrasts. Piemēram, vidēji brūnas un melnas krāsas kombināciju. Laba lasāmība tīmekļvietnē ir svarīga arī lietotājiem, kuri saturu lasa uz maziem ekrāniem, piemēram, viedtālrunī vai viedpulkstenī, sliktā apgaismojumā un zemas kvalitātes monitoros.

7.1. Labā prakse

Saskaņā ar WCAG vadlīniju AA līmeni:

·        Krāsu kontrastam jābūt optimālam;

·        Kontrasta attiecība starp standarta teksta krāsu (mazāk nekā 18pt vai mazāk nekā 14pt treknrakstā) un fona krāsu ir vismaz 4,5:1;

Piemērs. Augšējā attēlā redzams optimāls krāsu kontrasts. Savukārt apakšējā attēlā redzams nepietiekams krāsu kontrasts, jo krāsu toņi ir pārāk līdzīgi. Izmantojot tos teksta un tā fona noformējumam, digitālais saturs kļūs nepiekļūstams noteiktām lietotāju grupām.

Divi krāsu kontrasta piemēri viens zem otra. Katrā piemērā salīdzināti divi pelēki apļi - augšā gaiši un tumši pelēki apļi, apakšā - blāvi pelēki apļi.

• Kontrasta attiecība starp liela izmēra (lielāka vai vienāda ar 18pt vai lielāka vai vienāda ar 14pt treknrakstā) un fona krāsu ir vismaz 3:1;
• Siltās un aukstās krāsas veido vislabāko krāsu kontrastu.

Labās prakses piemērs. Krāsu kontrasta attiecība šajā gadījumā ir 11:14. (balti burti uz tumši violeta fona), kas ir atbilstoša gan standarta burtu izmēram, gan lielākam.

Latvijas Republikas Tiesībsarga mājaslapas sākumlapa, balti burti uz tumši violeta fona, atbilstoša krāsu kontrasta attiecība

Papildu ieteikumi:

• Izvietojot tekstu uz attēla (piemēram, reklāmas plakāta), izmantojiet tam papildu fona krāsu, kas ir vienkrāsaina. Šādi jūs panāksiet labāku kontrastu, kā arī vairāk izcelsiet vēlamo vēstījumu;
• Pietiekamu krāsu kontrastu var panākt ne tikai ar melnu un baltu krāsu. To nodrošina arī tādas krāsu kombinācijas kā zila ar baltu un dzeltena ar melnu;
• Izvairieties no tā, ka funkcionalitātes vai nozīmes piešķiršanai tiek izmantota tikai krāsa. Piemēram, tīmekļvietnē ievietojot hipersaiti bez pasvītrojuma (izceļot tikai ar krāsu). Lietotāji ir pieraduši redzēt, ka saites ir pasvītrotas;
• Ja tas ir iespējams, izstrādājiet papildu vizuālos norādījumus, kas palīdz saprast tīmekļvietnes funkcionalitāti cilvēkiem, kuri krāsas redz citādi. Kombinējiet krāsu ar formām, izmēriem, simboliem vai tekstu;
• Pievērsiet papildu uzmanību pogu, saišu un izvēlņu krāsu kontrastam, jo tie ir tīmekļvietnes navigācijas līdzekļi;
• Neizvietojiet tekstu un attēlus uz raiba fona. Šajā gadījumā par raibu fonu tiek uzskatīts jebkāds fons, kas nav vienkrāsains. Tas attiecas arī uz fonu, kura noformējumā tiek izmantotas tā dēvētās “ūdenszīmes” jeb teju caurspīdīgi dizaina elementi, kas var šķist gluži nemanāmi, taču var ietekmēt uz tām publicētās informācijas uztveri;
• Izvairieties tekstu noformējumā no blāviem krāsu toņiem (gaiši pelēka krāsa, pasteļtoņi u.tml.), jo tie saplūst ar fonu, tāpēc satura uztvere var būt apgrūtināta ikvienam lietotājam – arī tiem, kuriem nav redzes un informācijas uztveres traucējumu;
• Izvairieties no tādām teksta un fona krāsu kombinācijām kā zaļš ar sarkanu un zils ar dzeltenu.

7.2. Testēšana

Krāsu kontrasta pārbaudei izmanto gan manuālos, gan automātiskos testēšanas rīkus. Krāsu kontrasta pārbaudi sāk ar automātisko testu, lai konstatētu, vai lapā ir krāsu kontrasta problēmas.

Automātiskie testēšanas rīki

Lighthouse (Chrome, Edge; pieejams arī kā Chrome un Firefox paplašinājums):

1.     Atveriet Google Chrome pārlūkā tīmekļa lapu, kuru vēlaties pārbaudīt;

2.    Ar peles labo pogu noklikšķiniet uz ekrāna un izvēlieties “Inspect” (Pārbaudīt);

3.    Izvēlieties cilni “Lighthouse”, atzīmējiet, ko vēlaties analizēt un nospiediet “Analyze page load”.

Piemērs. Pārbaude ar Lighthouse rīku parāda, ka teksta un fona krāsu attiecība nav atbilstoša, norādot un iezīmējot arī konkrētās krāsu kļūdas.

Tīmekļvietnes skats pēc Ligthouse rīka aktivizēšanas

Wave rīks ir vairāk piemērots tā dēvēto “slēgto” jeb ar parolēm aizsargāto tīmekļvietņu testēšanai. Wave rīka lietošana:

1.     Pievienojiet Wave rīku kā Chrome, Firefox vai Edge paplašinājumu; Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes adresi, kuru vēlaties novērtēt;

2.    Uzklikšķiniet uz Wave rīka ikonas interneta pārlūka spraudņu izvēlnē;Ekrāna kreisajā pusē atvērsies logs, kurā būs atspoguļota informācija par to, cik tieši krāsu kontrastu kļūdas konkrētajā tīmekļvietnes lapā (nevis visā tīmekļvietnē) ir fiksētas. Savukārt pašā tīmekļvietnē pie katras no kļūdām parādīsies maza ikona sarkana kvadrāta formā;

3.    Izvēlieties iepriekšējā punktā minētā loga izvēlnē sadaļu Detaļas (Details). Arī šeit parādīsies mazas ikonas sarkana kvadrāta formā. To skaits būs vienlīdzīgs ar lapā reģistrēto kontrastu kļūdu skaitu. Uzklikšķinot uz jebkuras ikonas šajā logā, tīmekļvietnes lapā tiks iezīmēta ar to saistītā ikona, tā norādot, kurā tieši vietā tieši atrodas saturs, kuram nav pietiekams kontrasts;

4.    Pārliecinieties, ka:

o   tīmekļvietnē publicētās satura krāsu kontrasta koeficients ir vismaz 4,5:1;

o   šis krāsu kontrasta koeficients ir izmantots ne vien dažādu aprakstu, bet arī galvenē un kājenē atspoguļotās informācijas, ikonu, navigācijas elementu un citas tekstuālas informācijas noformēšanai.

Piemērs. Krāsu kontrasta pārbaude ar Wave rīku. Kreisajā lapas pusē tiek parādītas konstatētās problēmas, t.sk. krāsu kontrasta.

Tīmekļvietnes skats pēc Wave rīka aktivizēšanas.

Manuālie testēšanas rīki

Manuālos pārbaudes rīkus izmanto sekojošos gadījumos:

• Pēc automātiskās pārbaudes, ja tiek konstatētas kontrastu problēmas;
• Ja teksts ir novietots virsū attēlam;
• Ja vēlas veikt kontrasta uzlabojumus konkrētā lapā

Colour Contrast Checker

1.     Pievienojiet Colour Contrast Checker kā interneta pārlūka Chrome paplašinājumu;

2.    Atveriet tīmekļa lapu, kuru vēlaties pārbaudīt;

3.    Uzklikšķiniet uz Colour contrast checker rīka ikonas interneta pārlūka spraudņu izvēlnē;

4.    Uz atvērtā rīka, uzspiediet uz fona krāsas ikonas un novietojiet to uz lapas fonu, kuru vēlaties pārbaudīt;

5.    Uzspiediet uz teksta krāsas ikonas un novietojiet to uz teksta krāsas, kuru vēlaties pārbaudīt;

6.    Rīks nosaka un parāda kontrasta attiecību (piemērā Nr. kontrasta attiecība ir 2.66, kas nav pietiekama);

7.    Kontrasta uzlabošanai var izmantot rīka funkciju “Lightness” un manuāli pielāgot atbilstošu kontrasta attiecību (piemēram, šajā gadījumā padarot tumšāku fona krāsu).

Piemērs. Krāsu kontrasta attiecība 2.66 nav pietiekama ne standarta, ne liela izmēra tekstam (pārbaude veikta ar baltas krāsas burtiem uz raibā fona gaišākās daļas).

Tīmekļvietnes skats pēc rīka Colour Contrast Checker aktivizēšanas

8. Teksta izmēra tālummaiņa

Populārākajos interneta pārlūkos (Chrome, Firefox, Microsoft Edge un Safari) teksta izmēru var mainīt divos veidos:

• Tīmekļvietnes tālummaiņa (page zoom) ļauj pietuvināt vai attālināt ne vien tekstu, bet arī attēlus, ikonas, “pogas” u.tml. To var veikt gan interneta pārlūka, gan arī operētājsistēmas līmenī.
• Teksta izmēra tālummaiņa (text-only zoom) ļauj pietuvināt vai attālināt tikai tekstu. To var veikt interneta pārlūka līmenī. Taču šāda iespēja var būt paredzēta arī tīmekļvietnes līmenī. Šādos gadījumos teksta tālummaiņas ikona, kuras apzīmēšanai parasti izmanto “A” burtu, procentus vai pluss un mīnuss zīmes, tiek iekļauta tīmekļvietnes galvenē līdztekus krāsu kontrastu un citām saskarnes izskatu mainošajām izvēlnēm.

Salīdzinoši visbiežāk lietotāji izmanto minētās iespējas, lai varētu izlasīt tekstu mobilajās ierīcēs. Īpaši aktuāli tas ir cilvēkiem ar redzes traucējumiem un gados vecākiem cilvēkiem. Pieredze liecina, ka seniori digitālā satura palielināšanai datoros un dažkārt arī viedierīcēs nereti izmanto lupu, jo nav informēti par iespējām mainīt teksta izmēru tiešsaistē.

Tomēr teksta izmēra un tīmekļvietnes tālummaiņu mēdz praktizēt arī lietotāji bez jelkādiem redzes traucējumiem. Piemēram, cilvēki, kuri ikdienā daudz strādā ar tekstiem – žurnālisti, korektori, rakstnieki un citi. Un cilvēki, kuri vēlas samazināt slodzi acīm, ko rada ilgstoša koncentrēšanās uz maza izmēra tekstiem.

8.1. Labā prakse

Mainot teksta izmēru tīmekļvietnē, kuras izstrādē un uzturēšanā nav ievēroti piekļūstamības principi, tā var kļūt nelietojama, jo tālummaiņas rezultātā teksts var tikt sakropļots (skatīt zemāk pievienoto attēlu). Bet cilvēkiem ar redzes traucējumiem tā var būt nelietojama uzreiz, jo viņu datoros liels burtu izmērs var būt iestatīts interneta pārlūka vai operētājsistēmas līmenī pēc noklusējuma.

Labā prakse paredz nodrošināt tīmekļvietnē tādu satura noformējumu, ko vienlīdz labi var uztvert gan normālā (100%), gan maksimālā (200%) tālummaiņas režīmā. Tas nozīmē, ka piekļūstams digitālais saturs, pirmkārt un galvenokārt, ir tāds saturs, kas teksta tālummaiņas gadījumā nekādi neietekmē tīmekļvietnes saturu un funkcionalitāti. Otrkārt, tas ir tāds saturs, kura uztveršanai teksta tālummaiņas gadījumā nav jāizmanto palīgtehnoloģijas. Piemēram, operētājsistēmas līmenī iebūvētais ekrāna palielinātājs (screen magnifier), kas ļauj pietuvināt atsevišķus lapas fragmentus (piemērs, kas atspoguļo izmaiņas, kas var vai nevar notikt tīmekļvietnes skatā pēc tālummaiņas, atspoguļots 10. un 11. attēlā).

Šādu satura noformējumu iespējams panākt, veidojot tīmekļvietnes pēc principa “mobile first”. Tas nozīmē, ka teksta tālummaiņas gadījumā tīmekļvietnes saskarne tiek atspoguļota mobilajā izklājumā. Ja vien šajā izklājumā neiztrūkst atsevišķi elementi (piemēram, iepirkumu grozs vai lietotāju autentifikācijas logs), kas var būt neapdomīgi likvidēti, jo tā šķiet praktiskāk, estētiskāk u.tml., tīmekļvietne arī maksimālā teksta izmēra palielinājuma režīmā turpina funkcionēt pilnvērtīgi:

• lielāki kļūst tikai teksti, nevis attēli un citi vizuālie elementi;
• lielāki kļūst visi tīmekļvietnē publicētie teksti (ja teksts ir publicēts attēla formātā, tas nemainīsies, attiecīgi – maksimālās tālummaiņas režīmā nebūs salasāms);
• visi teksti joprojām ir pieejami pilnā apjomā – teikumi nav aprauti, nav pazuduši atsevišķi teksta fragmenti;
• teksta slejas un sekcijas, kā arī attēli un citi satura elementi nepārklājas;
• visas atstarpes starp teksta rindām joprojām ir savās vietās;
• visi teksta bloki ir redzami un brīvi izlasāmi – to lasīšanai nav jāizmanto tā dēvētā horizontālā “ritināšana” (tā ir pieļaujama tikai, lai pārietu uz citu tīmekļvietnes sadaļu);
• visi tīmekļvietnes aktīvie elementi ir izmantojami ne vien ar datorpeli, bet arī ar TAB taustiņu;
• visi tīmekļvietnes aktīvie elementi ir fokusēti;
• tīmekļvietnē joprojām ir iespēja izmantot visas izvēlnes (piemēram, mainīt valodas un krāsu kontrastus), vadīklas (piemēram, tīmekļvietnes aizvēršanas poga), kā arī formu laukus (piemēram, meklēšanas logs).

Labās prakses piemērs.

Tīmekļvietne pēc tālummaiņas ir ieguvusi saglabājusi pilnu funkcionalitāti. Nav mainījies arī tās teksta elementu noformējums – tie nepārklājas un joprojām ir viegli salasāmi.

Latvijas Republikas Tiesībsarga mājaslapa ar palielinātu tekstu.

Sliktās prakses piemērs.Pēc tālummaiņas lapai apakšpusē ir parādījusies horizontālās ritināšanas rīkjosla (scroll-bar). Tā ir viena no pirmajām pazīmēm, kas norāda uz to, ka lapas saturs ekrānā netiek atspoguļots pilnā apmērā. Tāpat daļa no lapas satura ir kļuvusi neredzama (kājenē ietvertais teksts nav salasāms) un nepieejama (piemēram, lapas augšpusē ir pazudis valodu pārslēgs).

Eiropas migrācijas tīkla mājaslapa ar palielinātu tekstu. Lapai apakšpusē tagad ir horizontālās ritināšanas rīkjosla (scroll-bar), daļai kājenes pazudusi fona krāsa un lapas augšpusē ir pazudis valodu pārslēgs.

8.2. Testēšana

Par to, ka teksta un lapas tālummaiņas gadījumā tīmekļvietnes saturs joprojām ir piekļūstams teju ikvienam lietotājam, var pārliecināties vairākos veidos.

8.2.1. Teksta tālummaiņas pārbaude interneta pārlūkos Chrome un Firefox

Lai veiktu tālummaiņas pārbaudi interneta pārlūkos Chrome un Firefox:

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes, kuru vēlaties novērtēt, adresi.

2.    Iestatiet izvēlētā interneta pārlūka rīkjoslā teksta tālummaiņas režīmu: Skats (View) → Tālummaiņa (Zoom) → Tikai teksta tālummaiņa (Zoom Text Only). Šo režīmu var iestatīt arī ar datora tastatūras taustiņu kombināciju Alt + V, Z, T.

3.    Palieliniet tekstu līdz 200%:

o   Ja izmantojat operētājsistēmu Windows vai Linux, nospiediet datora tastatūrā taustiņu kombināciju Ctrl + [+] (turiet nospiestu kontroles taustiņu un nospiediet četras līdz sešas reizes taustiņu [+]). Līdzīgu rezultātu var panākt, nospiežot taustiņu Ctrl un rullējot datorpeles rullīti uz augšu jeb prom no sevis (rullējot rullīti uz leju jeb uz sevi, teksta izmērs samazinās).

o   Ja izmantojat operētājsistēmu MacOS, nospiediet datora tastatūrā taustiņu kombināciju Cmd + [+] (turiet nospiestu komandtaustiņu un vienlaikus četras līdz sešas reizes nospiediet taustiņu +). Līdzīgu rezultātu var panākt, nospiežot taustiņu Cmd un rullējot datorpeles rullīti uz augšu jeb prom no sevis (rullējot rullīti uz leju jeb uz sevi, teksta izmērs samazinās).

o   Neatkarīgi no tā, kādu operētājsistēmu izmantojiet, teksta tālummaiņu var veikt arī interneta pārlūka rīkjoslā. Atveriet tās izvēlni un sadaļā Tālummaiņa (Zoom) uzklikšķiniet uz pogas “+”, lai palielinātu tekstu, bet uz pogas “-”, lai samazinātu. Skaitlis, kas redzams starp šīm pogām, ir pašreizējās tālummaiņas procentuālā vērtība.

4.    Pārliecinieties, ka teksta tālummaiņa nav ietekmējusi tīmekļvietnes saturu un funkcionalitāti atbilstoši 8.1. punktā aprakstītajiem labās prakses piemēriem.

8.2.2. Teksta tālummaiņas pārbaude interneta pārlūkā Safari

Pārbaude iespējama operētājsistēmā MacOS. Lai veiktu pārbaudi:

1.     Ierakstiet interneta pārlūka teksta laukā tīmekļvietnes, kuru vēlaties novērtēt, adresi.

2.    Palieliniet tekstu līdz 200%. To var izdarīt divējādi:

o   Atveriet interneta pārlūka rīkjoslas izvēlni un palieliniet tekstu: Skatīt izvēlni (View Menu) → Palielināt tekstu (Make Text Bigger).

o   Nospiediet datora tastatūrā taustiņu kombināciju Alt + Cmd + [+] (turiet nospiestu Alt un komandtaustiņu un vienlaikus četras līdz sešas reizes nospiediet taustiņu [+]).

3.    Pārliecinieties, ka teksta tālummaiņa nav ietekmējusi tīmekļvietnes saturu un funkcionalitāti atbilstoši 8.1. punktā aprakstītajiem labās prakses piemēriem.

9. Lapu nosaukumi

Nosaukums bieži vien ir pirmais, ko cilvēki redz vai dzird, atverot jaunu tīmekļvietnes lapu vai sadaļu. Tas palīdz cilvēkiem orientēties tīmekļa vietnēs un lietotnēs. Īpaši noderīgi tas ir lietotājiem ar redzes traucējumiem (t.sk. ar lasīšanas vai kognitīviem traucējumiem), kuri nevar uzreiz uztvert visu lapu/ekrānu. Tīmekļvietnes lapu nosaukumiem ir jābūt unikāliem – tie nevar atkārtoties. Pareizi veidoti tīmekļvietņu lapu nosaukumi būtiski uzlabo organizācijas rezultātus Google meklētājā.

9.1. Labā prakse

• Veidojiet lapu nosaukumus īsus un kodolīgus, precīzi raksturojot to saturu un mērķi;
• Pārliecinieties, ka lapu nosaukumi ir unikāli jūsu tīmekļvietnei un visām ar to saistītajām vietnēm – tie neatkārtojas;
• Iekļaujiet lapas nosaukumu sākumā, bet tīmekļvietnes un/vai organizācijas, kurai tā pieder, nosaukumu – beigās. Piemērs:
• Par mums | VARAM tīmekļvietne
• Aktualitātes | VARAM tīmekļvietne
• Administratīvi teritoriālā reforma | VARAM tīmekļvietne
• Ievērojiet lapu nosaukumu izveidē vienotu stilu. Piemēram, atdalot iepriekš aprakstīto primāro un sekundāro informāciju, izmantojiet visos lapu nosaukumos vienu un to pašu simbolu – domuzīmi vai vertikālu svītru nevis katrā lapā citu simbolu. Tas pats attiecas arī uz organizācijas, kurai konkrētā tīmekļvietne pieder, nosaukuma rakstību. Proti, rakstiet šo nosaukumu visur vienādi, piemēram, “VARAM tīmekļvietne” (kā iepriekšējā punktā aprakstītajā piemērā) vai “www.varam.gov.lv”, vai “Vides aizsardzības un reģionālās attīstības ministrija”, nevis katrā lapas nosaukumā citādi. Iekļaujiet lapu, kas veidotas kā daudzpakāpju procesa daļa (piemēram, reģistrēšanās pakalpojuma saņemšanai vai pasūtījuma noformēšana) vai kādas sadaļas apakšsadaļa, nosaukumā konkrētā procesa vai soļa, kas tajās aprakstīts, nosaukumu. Piemēram: Iedzīvotāju pieteikumu izskatīšana ministrijas kompetences jomās | Pakalpojumi | VARAM tīmekļvietne Līgums | Izveido eParaksts Mobile | eparaksts.lv Ievērojiet tīmekļvietņu lapu nosaukumu izveidē izvēlēto valodu pareizrakstības likumus.
• Ievērojiet lapu nosaukumu izveidē vienotu stilu. Piemēram, atdalot iepriekš aprakstīto primāro un sekundāro informāciju, izmantojiet visos lapu nosaukumos vienu un to pašu simbolu – domuzīmi vai vertikālu svītru (kā iepriekšējā punktā aprakstītajā piemērā), nevis katrā lapā citu simbolu. Tas pats attiecas arī uz organizācijas, kurai konkrētā tīmekļvietne pieder, nosaukuma rakstību. Proti, rakstiet šo nosaukumu visur vienādi, piemēram, “VARAM tīmekļvietne” (kā iepriekšējā punktā aprakstītajā piemērā) vai “www.varam.gov.lv”, vai “Vides aizsardzības un reģionālās attīstības ministrija”, nevis katrā lapas nosaukumā citādi.
• Iekļaujiet lapu, kas veidotas kā daudzpakāpju procesa daļa (piemēram, reģistrēšanās pakalpojuma saņemšanai vai pasūtījuma noformēšana) vai kādas sadaļas apakšsadaļa, nosaukumā konkrētā procesa vai soļa, kas tajās aprakstīts, nosaukumu. Piemēram:
• Iedzīvotāju pieteikumu izskatīšana ministrijas kompetences jomās | Pakalpojumi | VARAM tīmekļvietne
• Līgums | Izveido eParaksts Mobile | eparaksts.lv
• Ievērojiet tīmekļvietņu lapu nosaukumu izveidē izvēlēto valodu pareizrakstības likumus.

Labās prakses piemērs. Attēlā lapas nosaukums sākas ar tās virsrakstu, kuram seko organizācijas nosaukums: Nozaru politika| Vides aizsardzības un reģionālās attīstības ministrija.

Lapas nosaukums sākas ar tās virsrakstu, pēc tam organizācijas nosaukums

Sliktās prakses piemērs. Lapas nosaukumā ir redzama tikai informācija par pašu tīmekļvietni un tās adrese – Latvijas valsts portāls, latvija.lv. Pareizi noformēts lapas nosaukums būtu šāds: E-pakalpojumi | Latvijas valsts portāls.

Lapas nosaukums sākas ar tās virsrakstu, pēc tam organizācijas nosaukums

9.2. Testēšana

Tīmekļvietņu lapu nosaukumu atbilstība piekļūstamības principiem tiek pārbaudīta vizuāli:

1.     Atveriet tīmekļvietni vai tās sadaļu, ko vēlaties pārbaudīt;

2.    Pārliecinieties, ka lapas nosaukums, kas pēc noklusējuma parādīsies jūsu izvēlētā interneta pārlūka loga virsrakstjoslā vai cilnē, atbilst 9.1. punktā aprakstītajiem labās prakses piemēriem.

Piemērs. Tīmekļvietnes lapas nosaukums: Par mums – Tiesībsargs
Tiesību joma – Tiesībsargs

Lapas nosaukums sākas ar tās virsrakstu, pēc tam organizācijas nosaukums

10. Saturs, kas kustas, mirgo un zibsnī

Dažādi kustīgi elementi (attēli un teksti, kas mirgo, zibsnī u.tml.) digitālajā vidē parasti tiek izmantoti, lai pievērstu lietotāju uzmanību un veicinātu viņu mijiedarbību ar digitālo saturu. Salīdzinoši visbiežāk animēti tiek tādi digitālā satura elementi kā:

• Slaideri – attēli, kas secīgi mainās paši vai var tikt mainīti manuāli. Tos bieži izmanto, lai īsi atspoguļotu tīmekļvietnes galvenajā lapā jaunāko, aktuālāko informāciju, piemēram, akcijas piedāvājumus. Tāpat slaideri nereti tiek izmantoti, veidojot foto galerijas.
• Reklāmas banneri un videoklipi.
• Ziņu plūsmas (piemēram, RSS ziņu plūsma) – informācijas monitorēšanas sistēma, kas ļauj veidot tīmekļvietnē jaunāko ziņu apkopojumu par dažādām organizācijai saistošām tēmām. Informācija, kas tiek atspoguļota šajās plūsmās, tiek automātiski “ielasīta” no dažādiem kanāliem (ziņu portāliem, sociālajiem tīkliem u.tml.), izmantojot dažādus atslēgvārdus. Ņemot vērā, ka parasti šajā ziņu plūsmās ir līdz 10 ziņām, tās atkarībā no tēmas aktualitātes var mainīties gan ļoti reti, gan arī nepārtraukti.
• Vērtības, kas atjaunojas automātiski. Uzskatāmākie piemēri ir valūtas kurss, aviobiļešu cenas un aktuālā laika prognoze, ko savās tīmekļvietnēs mēdz publicēt ziņu portāli.

10.1. Labā prakse

• Paredziet iespēju, ka kustīgos elementus var apturēt vai nopauzēt – ar tastatūras Escape taustiņu vai uzskatāmu pogu;
• Automātisko animāciju veidojiet tā, lai tā vienu reizi “nospēlē” un apstājas (nevis spēlē bez apstājas);
• Pārliecinieties, ka jūsu attēli mirgo vai zibsnī ne vairāk kā trīs reizes sekundē. Pirmkārt, saturu, kas kustas ātrāk, ir grūti uztvert. Otrkārt, tas var izraisīt reiboņus, krampjus un citas veselības problēmas.
• Iestatiet kustīgo attēlu animācijas cikla garumu jeb intervālu (laiks no animācijas sākuma līdz brīdim, kad tā beidzas). Optimālais tā laiks ir divas sekundes, maksimālais – piecas;
• Nodrošiniet lietotājiem iespēju noteikt vērtību, kas atjaunojas automātiski, atjaunošanās regularitāti;
• Izvairieties no GIF attēlu izmantošanas, jo animācijas ātrumu ietekmēt ir teju neiespējami, tādēļ šis kustīgo attēlu veids tiek uzskatīts par lietotājiem nedraudzīgāko. To ieteicams aizstāt ar HTML5 videoklipiem, kas ir lietotājiem draudzīgāki.

Labās prakses piemērs. Lapā ievietotie slaideri paredz manuālu pāršķiršanu un apstādināšanu.

Kustīga attēla ekrānšāviņš no Latvijas tīmekļvietnes ar uzrakstu - Izstāde otrajā stāvā un koka sienas pulksteni fonā

Sliktās prakses piemērs. Lapā ievietoto reklāmas banneri nav iespējams apstādināt un tas automātiski spēlē bez apstājas.

Kustīga reklāmas banera ekrānšāviņš no Latvijas tīmekļvietnes

10.2. Testēšana

1.     Atveriet tīmekļvietni vai tās sadaļu, kurā ir publicēts animēts saturs;

2.    Pārliecinieties, ka animētā satura elementi ir veidoti, ievērojot 10.1. punktā aprakstītos labās prakses piemērus.

3.    Pārbaudiet trīs lietas:

o   vai šis saturs apstājas pats un viena tā cikla garums nepārsniedz piecas sekundes;

o   vai šo saturu var apturēt, ja tas aktivizējas automātiski – atverot konkrēto tīmekļvietnes sadaļu;

o   vai šis saturs nemirgo vai nezibsnī biežāk kā trīs reizes sekundē.

11. Multimediju (audio, video) satura alternatīvas

Multimediju saturam ir jābūt piekļūstamam dažādām lietotāju grupām. Piemēram, nedzirdīgiem un vājdzirdīgiem cilvēkiem ir svarīgi, ja audio vai video saturam tiek nodrošināti subtitri, teksta noraksts un/vai vispārīgs apraksts teksta formātā. Arī cilvēki ar redzes traucējumiem var saskarties ar ierobežojumiem. Pirmkārt, nereti video materiāli tiek veidoti bez balss ieraksta, lai gan tajos var tikt atspoguļota būtiska informācija. Otrkārt, ja video materiālam ir skaņa, ierunātu tekstu (piemēram, dialogus) cilvēki ar redzes traucējumiem var uztvert ļoti labi, bet video noskaņu – tikai daļēji. Taču tādam video saturam kā filmas un TV raidījumi noskaņai ir ļoti nozīmīga loma. Un to neredzīgiem un vājredzīgiem cilvēkiem var nodot, izmantojot teksta norakstu (jo to var izlasīt ekrāna lasīšanas ierīces) vai ar audio aprakstu (jo to var noklausīties).

11.1. Multimediju satura alternatīvu veidi

Kopumā izšķir trīs veidu multimediju satura alternatīvas: subtitri, teksta noraksts un audio apraksts. Lai gan visiem alternatīvajiem audio un video satura atspoguļojuma veidiem ir vienots mērķis – padarīt multimediju saturu piekļūstamu (saprotamu un viegli uztveramu) ikvienam lietotājam, to noformējumā ir jāņem vērā zināmas nianses.

11.1.1. Subtitri (subtitles, captions)

Subtitri ir detalizēts video (konferenču, videoklipu, filmu, TV raidījumu, videospēļu u.tml.) satura atšifrējums oriģinālvalodā un/vai kādā no svešvalodām.

Subtitru veidi:

• Atvērtie subtitri (open captions, burned in captions, baked on captions) tiek iestrādāti jeb “iededzināti” video materiālā attēla formātā, tāpēc tie nav piekļūstami:
• tos nevar ieslēgt un izslēgt, kā arī nolasīt ar ekrāna lasīšanas ierīcēm;
• tie nepielāgojas ierīces ekrāna izmēram.

Lai arī atvērtie subtitri var būt vizuāli pievilcīgāki par slēgtajiem (jo tiem var veidot dažādus dizainus), tie arī nav praktiski un finansiāli izdevīgi. Pirmkārt, šādu subtitru izveide maksā dārgāk. Otrkārt, ja tajos tiek konstatētas kļūdas, labojumi ir jāveic visā video failā. Piemēram, ja kļūdas tiek konstatētas publiskotam video, kam jau ir noteikts skatījumu skaits, video ir jādzēš, jāizlabo un jāpublicē no jauna (uzskatāms atvērto subtitru piemērs atspoguļots 15. attēlā).

·        Slēgtie subtitri (closed captions) tiek veidoti kā atsevišķs fails, izmantojot šim nolūkam īpašus rīkus, ko piedāvā tādas platformas kā Facebook, YouTube, Vimeo u.c. (uzskatāms šādu subtitru piemērs atspoguļots 14. attēlā). Šādu subtitru galvenās priekšrocības:

• tos var ieslēgt un izslēgt, izmantojot pogu, kas tiek apzīmēta ar diviem burtiem – “CC” (abreviatūra no angļu valodas termina closed captions);
• tie pielāgojas ierīces ekrāna izmēram;
• tos var veidot gan tiešsaistē, gan arī augšupielādēt kā atsevišķu failu (populārākie subtitru faila paplašinājumi ir SRT un SBV);
• tos var lejupielādēt (lieti noder, veidojot teksta norakstu – plašāka informācija par tā izveides mērķiem un principiem pieejama 11.1.2. punktā);
• tos var izveidot jebkurā brīdī (tie nav jāpublicē uzreiz kopā ar video);
• tajos fiksētās kļūdas var izlabot labot jebkurā brīdī, turklāt tiešsaistē (izmaiņas tiek veiktas tikai subtitros, nevis visā video failā).

·        Automātiskie subtitri (automatic subtitles) tiek veidoti ar mašīnlasīšanas un balss atpazīšanas tehnoloģijām. Tie ir sastopami vairākās digitālajās platformās, piemēram, YouTube (pieejami tikai video saturam, kas ir angļu valodā) un Google Meet. Šie subtitri nav piemēroti video satura piekļūstamības nodrošināšanai, jo nav precīzi. Taču tos var efektīvi izmantot kā pamatu atvērto un slēgto subtitru izveidei.

11.1.2. Teksta noraksts (transcript)

Tas ir multimediju satura attēlojums teksta formātā, kas tiek publicēts uzreiz zem konkrētā ieraksta. Lai gan audio un video materiālu teksta norakstiem ir vienots mērķis – palīdzēt lietotājiem labāk tajos labāk orientēties, uztvert to saturu, šo materiālu teksta noraksta izveides principi nedaudz atšķiras.

Video faila teksta noraksts ir detalizēts tā satura atšifrējums. Parasti tajā tiek dublēts viss subtitru saturs, izņemot laika kodus, kas lietotājiem ļauj gūt visai konkrētu priekšstatu par video faila saturu, to neskatoties. Lai arī šī video satura alternatīva primāri ir paredzēta cilvēkiem ar redzes traucējumiem, to novērtē arī citi lietotāji. Piemēram, cilvēki, kuriem ir jāapstrādā liels informācijas apjoms, meklējot tīmeklī materiālus par viņiem saistošām tēmām. Ja viņiem aktuālie atslēgvārdi būs iekļauti jūsu video teksta norakstā, ir ļoti liela iespēja, ka meklēšanas platforma (piemēram, Google vai Yandex) piedāvās šo video kā vienu no atlasītājiem resursiem.

Savukārt audio faila teksta noraksts ir jēgpilns tā satura apraksts jeb atstāstījums teksta formātā, kas parasti tiek izmantots radio raidījumu un podkāstu piekļūstamības nodrošināšanai. Audio failiem, kas laika ziņā pārsniedz 10 līdz 15 minūtes, parasti tiek veidoti vispārīgi apraksti, iekļaujot vien būtiskāko informāciju, runaspersonu citātus. Bet īsākiem audio failiem tie var būt arī ļoti detalizēti – teju kā video failu teksta noraksti.

11.1.3. Audio apraksts (audio description</