Nacrt:Wikipedija:Stilski priručnik/Pristupačnost

Izvor: Wikipedija
Prijeđi na navigaciju Prijeđi na pretragu

Web pristupačnost je prilagođavanje web stranica tako da navigacija i čitanje budu lakši i pristupačniji svim korisnicima. Ovo je prvenstveno namenjeno da pomogne osobama sa različitim stepenima invaliditeta, ali može biti od pomoći svima. Cilj nam je da se pridržavamo Smernica za pristupačnost web sadržaja 2.1[n 1] na kojima se zasnivaju sledeći predlozi. One stranice koje se pridržavaju ovoga je mnogo lakše čitati i uređivati.

Upravni odbor Fondacije Wikimedija je 14. januara 2006. godine doneo sledeću rezoluciju o nediskriminaciji:

Fondacija Wikimedija zabranjuje diskriminaciju sadašnjih ili budućih korisnika i zaposlenih na osnovu rase, boje kože, pola, vere, nacionalnog porekla, starosti, invaliditeta, seksualne orijentacije ili bilo koje druge zakonom zaštićene karakteristike. Fondacija Wikimedija se obavezuje na princip jednakih mogućnosti, posebno u svim aspektima odnosa zaposlenih, uključujući zapošljavanje, administraciju plata, razvoj zaposlenih, unapređenje i transfer.

Fondacija nalaže da se ova politika „ne sme ignorisati, zanemarivati ili umanjivati od strane rukovodioca ili službenika Fondacije, niti u lokalnim smernicama bilo kog projekta Wikimedije”.

Struktura članka[uredi | uredi kod]

Standardizovana struktura članaka poboljšava pristupačnost, jer omogućava korisnicima da znaju gde mogu da očekuju da se sadržaj koji ih zanima nalazi. Na primer, ako korisnik koji je slep ili slabovid traži veze za razjašnjavanje, višeznačne odrednice ili kratak opis i ne pronađe nijednu na vrhu stranice, znaće da ih nema i ne moraju da čitaju celu stranicu da bi otkrili da su na pogrešnoj stranici.

Naslovi odeljaka[uredi | uredi kod]

Naslovi treba da budu deskriptivni i u doslednom redosledu kako je definisano u Stilskom priručniku.

Ugnezdite naslove redom po nivoima, počevši od nivoa 2 ( == ), zatim nivo 3 ( === ) i tako dalje. (Nivo 1 je automatski generisani naslov stranice). Ne preskačite delove sekvence, kao što je izbor nivoa za isticanje teksta; ovo nije svrha naslova.

U svrhu čitljivosti za urednike sa slabim vidom – samo u izvornom uređivaču – može se dodati jedan prazan red ispod svakog naslova, ali ne više od jednog; više od jednog praznog reda ispod naslova odeljka će prouzrokovati da se na prikazanoj stranici vidi dodatni prostor. Takođe treba uzeti u obzir kako se jedna prazna bela linija ispod naslova odeljaka može pojaviti na malom ekranu za određeni članak, jer mnogi urednici koriste mobilne uređaje za uređivanje, a samo jedan prazan red ispod zaglavlja zapravo može umanjiti čitljivost za ove urednike, za neke članke.

Primeri ispravne i neispravne upotrebe ugnežđenih naslova
Ispravno Nasumično/haotično Preskakanje nivoa

[Uvodnik članka]
==Naslov== [nivo 2]
===Podnaslov=== [3]
==Naslov== [2]
===Podnaslov=== [3]
====Pod-podnaslov==== [4]
==Naslov== [2]

[Uvodnik članka]
====Pod-podnaslov?==== [4]
===Podnaslov?=== [3]
==Naslov?== [2]
==Naslov?== [2]
====Pod-podnaslov?==== [4]
===Podnaslov?=== [3]

[Uvodnik članka]
[Nedostaje naslov drugog nivoa]
===Podnaslov?=== [3]
==Naslov== [2]
[Nedostaje naslov trećeg nivoa]
====Pod-podnaslov?==== [4]
==Naslov== [2]

Ne pravite pseudo-naslove zloupotrebljavajući tačku-zarez (rezervisano za liste opisa) i pokušajte da izbegnete korišćenje podebljanih oznaka. Čitači ekrana i druge pomoćne tehnologije mogu da koriste samo naslove koji imaju oznake naslova za navigaciju. Ako želite da smanjite veličinu tabele sadržaja (TOC), umesto toga koristite {{TOC limit}}. U slučajevima kada se {{TOC limit}} ne može koristiti zbog naslova nižeg nivoa na drugim mestima u članku, onda korišćenje podebljanog teksta za pod-pod-podnaslove izaziva najmanje smetnje za korisnike čitača ekrana. Ako uopšte koristite pseudo naslov znači da ste iscrpili sve druge opcije. To znači da je obu opciju treba veoma retko koristiti.

Primeri prihvatljive i netačne upotrebe pseudonaslova i opisnih lista
Prihvatljivo Neispravno

[Uvodnik članka]
==Naslov== [nivo 2]
===Podnaslov=== [3]
'''Pseudo-naslov'''
==Naslov== [2]
===Podnaslov=== [3]
====Pod-podnaslov==== [4]
;Naziv koji prati:
:barem jedna definicija ili lista opisa
:i još opcionalnih stavki, praveći listu

[Uvodnik članka]
==Naslov== [nivo 2]
===Podnaslov=== [3]
'''Pseudo-naslov'''
==Naslov== [2]
===Podnaslov=== [3]
<small>==Pod-podnaslov==</small> [2]

Plutajući elementi[uredi | uredi kod]

U vikikodu, plutajuće elemente (uključujući slike) treba postaviti u odeljak kojem pripadaju; ne stavljajte sliku na kraj prethodnog odeljka kako bi se pojavila u sledećem. (U zavisnosti od platforme, ređanje nekoliko slika pored relativno male količine teksta može dovesti do toga da određena slika bude gurnuta nadole u sledeći odeljak. Ipak, ovo nije problem pristupačnosti, pošto čitači ekrana uvek čitaju alt= svake slike na mestu gde je slika kodirana).

Rezolucija[uredi | uredi kod]

Članci na Wikipediji treba da budu dostupni čitaocima koji koriste uređaje sa malim ekranima kao što su mobilni uređaji ili čitaocima koji koriste monitore niske rezolucije. Na desktopu, ovo je ponekad problem u člancima sa više slika na obe strane ekrana; iako će niže rezolucije imati tendenciju da rastežu pasuse vertikalno, pomerajući slike u tom pravcu, pazite da ne dodajete slike ili drugi lebdeći sadržaj na obe strane ekrana istovremeno. Velike tabele i slike takođe mogu stvoriti probleme; ponekad je horizontalno pomeranje neizbežno, ali uzmite u obzir restrukturiranje širokih tabela kako bi se proširile vertikalno, a ne horizontalno.

Tekst[uredi | uredi kod]

Podrazumevano, većina čitača ekrana ne označava atribute prezentacijskog teksta (podebljano, kurziv, podvučeno, monospace, precrtano) ili čak semantičke atribute teksta (naglasak, važnost, brisanje teksta), tako da se precrtani tekst čita normalno zajedno sa bilo kojim drugim tekstom. (Urednicima koji koriste čitače ekrana koji učestvuju u Wikipedijinim politikama i debatama o brisanju savetuje se da uključe obaveštenja o atributima teksta kada to rade, pošto je precrtani tekst veoma čest u internim diskusijama Wikipedije).

Pošto čitači ekrana obično ignorišu precrtavanje teksta, njegova retka upotreba u člancima (npr. za prikazivanje promena u tekstualnoj analizi) će izazvati probleme pristupačnosti i potpunu konfuziju ako je to jedina indikacija koja se koristi. Ovo se odnosi i na elemente <s> i <del> (zajedno sa njihovim odgovarajućim <ins>, koji se obično vizuelno prikazuju kao podvučeni), kao i na šablone koji ih koriste. Nemojte koristiti precrtavanje da biste prigovorili sadržaju za koji mislite da je neprikladan ili netačan. Umesto toga, komentarišite ga sa <!-- i --> (tj. zagradama za komentare), uklonite ga u potpunosti ili koristite ugrađeni šablon za čišćenje/osporavanje i postavite pitanje na stranici za razgovor.

  1. Ne koristiti potencijalno nečitljive simbole kao na primer ♥ (simbol srca); umesto toga koristite slike sa alt tekstom.[1]
  2. Simboli koji mogu da izazovu probleme za čitače ekrana možda već imaju šablone koji proizvode sliku i alt tekst. Primer je simbol bodeža ({{}}).

Redosled znakova mora biti dovoljan da prenese semantičke aspekte teksta (i, po mogućnosti, druge slične oblike sadržaja); oslanjanje na prilagođene „specijalne simbole“ koje se razlikuju samo po svojstvima CSS-a ili viki oznakama nije prihvatljivo. Na primer, ne sme se koristiti ćirilično S (С) umesto latiničnog C.

Nemojte koristiti tehnike koje zahtevaju interakciju da bi se dobile informacije, kao što su opisi alata ili bilo koji drugi tekst koji „lebdi“. Skraćenice su izuzete od ovih zahteva, tako da se šablon {{abbr}} (omotač za <abbr> element) može koristiti za označavanje dugačkog oblika skraćenice (uključujući akronim ili inicijalizam).

Nemojte umetati prelome redova unutar rečenice, jer to otežava uređivanje pomoću čitača ekrana. Prelom jednog reda može da dolazi posle rečenice, što može pomoći nekim urednicima.

Veličina fonta[uredi | uredi kod]

Smanjen ili uvećan font treba da se koristi štedljivo i obično se koristi kroz automatske elemenata stranice kao što su naslovi, zaglavlja tabele i standardizovani šabloni. Promene veličine su navedene kao procenat originalne veličine fonta, a ne kao apsolutna veličina u pikselima. Relativne veličine povećavaju pristupačnost za korisnike sa oštećenim vidom tako što im omogućavaju da postave podrazumevanu (veliku) veličinu fonta u podešavanjima pregledača. Apsolutne veličine uskraćuju korisnicima takvu mogućnost.

Izbegavajte korišćenje manjih veličina fonta u elementima stranice koji već koriste manju veličinu fonta, kao što je većina teksta u infokutijama, navigacionim kutijama i odeljcima sa referencama.[n 2] To znači da oznake <small>...</small> i šabloni kao što su {{small}} i {{smalldiv}}, ne treba da se primenjuju na običan tekst unutar tih elemenata. Ni u kom slučaju rezultirajuća veličina fonta bilo kog teksta ne bi trebalo da padne ispod oko 85% podrazumevane veličine fonta stranice. Imajte na umu da HTML <small>...</small> oznaka ima semantičko značenje sitnog slova ili bočnih komentara;[2] ne koristite ga za stilske promene.

Drugi jezici[uredi | uredi kod]

Reči ili fraze koje nisu na srpskohrvatskom treba da budu zatvorene u {{lang}}, koji koristi kodove jezika ISO 639, na sledeći način:

{{jez|fr|Assemblée nationale}}

što se prikazuje kao:

Assemblée nationale

ili {{jez-fr|Assemblée nationale}}

što se prikazuje kao:

fr. Assemblée nationale.

Razlog: {{jez}} dozvoljava alatkama za čitanje teksta da tekst pročitaju na tačnom jeziku.[3]

Nije neophodno niti poželjno umotavati ove konstrukcije u kurziv; šabloni {{jez}} i {{jez-xx}} su već automatski kurzivi. Ako tekst ne treba da se ispisuje u kurzivu — kao što su imena bendova — moguće je dodati |iskošeno=ne da biste zamenili podrazumevano ponašanje.[n 3]

Imajte na umu da transliteracije treba da koriste {{Transl}}, izgovori treba da koriste {{IPA}}, {{Respell}} ili srodni šablon, a prevodi {{Prev}}. {{PIE}} je za protoindoevropski jezik.

Wikipedija ima niz šablona specifičnih za neke jezike kao što su {{lang-zh}} i {{nihongo}}, koji korisnicima pružaju parametre šablona specifične za jezik, kao što su opcije za unos različitih metoda transliteracije. Iako nema svaki jezik svoj šablon, ponekad je bolje koristiti ove šablone za pojednostavljenje vikiteksta, umesto da se niže nekoliko instanci {{Jez}} i {{Transl}}.

Linkovi[uredi | uredi kod]

  1. Napravite dobre opise veza, posebno za spoljne veze (izbegavajte veze u stilu „klikni ovde !“ ili „ovo“).[4][5]
  2. Nemojte koristiti Unikod znakove kao ikone; umesto toga koristite sliku sa alternativnim tekstom. Na primer, neki čitači ekrana ne mogu da reprodukuju znak poput „→“ (strelice na desno) u koristan tekst.

Boja[uredi | uredi kod]

Dva skrinšota sa interfejsovima punim teksta. Skrinšot na vrhu koristi crvenu, zelenu i plavu, dok onaj na dnu koristi skoro istu žutu boju za crvenu i zelenu, tako da je tekst jedva čitljiv.
Skrinšotovi koji prikazuju uticaj crveno-zelenog daltonizma

Boje se najčešće nalaze u člancima Wikipedije u okviru šablona i tabela.

Članci (i druge stranice) koji koriste boju treba da imaju na umu dostupnost, po sledećim smernicama:

  • Pobrinite se da boja nije jedini metod prenošenja bitnih informacija. Naročito, ne koristite obojen tekst ili pozadine osim ako se ne koristi i drugi metod prenošenja informacije kao što su pristupačni simboli koji su i u legendi ili futnote. Bez toga, slepim korisnicima ili korisnicima koji koriste ištampanu stranicu ili uređaj bez boja informacije neće biti prenesene;
  • Linkovi treba da budu jasno prepoznatljivi čitaocima. Nemojte da bojite tekst plavo kako bi sakrili linkove;
  • Neki čitaoci su delimično ili potpuno daltonisti. Pobrinite se da je kontrast teksta i pozadine barem na barem na AA nivou Smernica za pristup web sadržaju (WCAG 2.0), dok je poželjan AAA nivo;
    • Možete koristiti par onlajn alatki za ovo, kao što su WebAIM-ov proveravač konstrasta ili WhoCanUse sajt, ili Snukov proveravač kontrasta;
      • Postoje i druge alatke, ali proverite da li su ažurirane pre korišćenja. Neke alatke su zasnovane na WCAG 1.0 algoritmu, dok je sada standard WCAG 2.0. Ako alatka ne pominje da je zasnovana na WCAG 2.0, pretpostavite da je zastarela;

Blok elementi[uredi | uredi kod]

Spiskovi[uredi | uredi kod]

Nemojte razdvajati stavke lista koristeći prazne redove ili prelome kolona tabele između njih. Ovo uključuje stavke u listi opisa (lista napravljena sa početnom tačkom-zarezom ili dvotačkom, što je takođe način na koji je većina diskusija na stranici za razgovor) ili uređena lista ili neuređena lista. Liste su namenjene grupisanju elemenata koji pripadaju zajedno, ali MediaWiki će protumačiti prazan red kao kraj jedne liste i započeće novu listu. Prekomerni dupli prelomi izmeđi redova takođe ometaju čitače ekrana, koji će objaviti više lista kada je korisnik hteo da napravi samo jednu i stoga ti prelomi mogu da dovedu u zabludu ili zbune korisnike ovih programa. Takvo nepravilno formatiranje takođe može višestruko povećati vreme koje im je potrebno da pročitaju spisak.

Nemojte menjati tip obeleživača inicijalne liste (dvotačke, zvezdice ili heš znakova) u jednoj listi. Kada uvlačite tokom odgovaranja na neku objavu koji počinje bilo kojom mešavinom dvotačka i zvezdica i ponekad heš znakova, potrebno je kopirati bilo koju seriju tih znakova koja je gore korišćena i dodati još jedan takav znak. Alternativno, jednostavno uvucite red i započnite novu diskusiju (tj. novu HTML listu).

Na primer, u diskusiji, DaY ovo je najbolja praksa:

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
** Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2
*** Čini mi se da je u duhu Wikipedije. —Korisnik:Primer1

ili DaY, u diskusiji bez nabrajanja:

: Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
:: Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2
::: Čini mi se da je u duhu Wikipedije. —Korisnik:Primer1

Ovo DaY je takođe prihvatljiva praksa (da se potisne zvezdica na početak odgovora):

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
*: Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2
*:: Čini mi se da je u duhu Wikipedije. —Korisnik:Primer1

Ali ne radite ovo (ne prebacujte tip sa liste za nabrajanje u listu opisa):

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
:: Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2
*** Čini mi se da je u duhu Wikipedije. —Korisnik:Primer1

niti ovo (ne prebacujte tip sa spiska za nabrajanje u skisak opisa):

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
:* Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2

niti ovo (ne ostavljajte prazne redove između stavki spiska):

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 

** Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2

niti ovo (ne skačite preko više od jednog nivoa):

* Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
*** Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2

Ovo se uglavnom obeshrabruje:

: Podrška. Sviđa mi se ova ideja. —Korisnik:Primer1 
:* Imam pitanje: Šta ti se sviđa kod ove ideje? —Korisnik:Primer2

Umetanje zvezdice nepotrebno povećava složenost liste i čini da je veća verovatnoća da će ljudi koristiti pogrešne nivoe uvlačenja u svojim odgovorima. U ovom slučaju, bolje je koristiti samo dve tačke.

Više pasusa unutar stavki liste[uredi | uredi kod]

Normalne oznake MediaWiki liste su nažalost nekompatibilne sa normalnim označavanjem paragrafa MediaWiki.

Da biste stavili više pasusa u istu stavku liste, DaY odvojite ih sa {{pb}}:

* Ovo je jedna stavka.{{pb}}Ovo je druga stavka
* Ovo je još jedna stavka.

Ovo se takođe može uraditi DaY sa eksplicitnim HTML oznakama za pasuse (obratite pažnju na završnu oznaku </p>):

* Ovo je jedna stavka.<p>Ovo je novi paragraf u istoj stavci.</p>
* Ovo je druga stavka.

U oba slučaja to se mora uraditi DaY na jednoj liniji koda. Međutim, opciono možete koristiti trik umotavanja preloma linije koda u HTML komentar (koji ga potiskuje kao prelom izlazne linije), da biste bolje odvojili pasuse u prikazu koda:

* Ovo je jedna stavka.<!--
--><p>Ovo je novi paragraf u istoj stavki.</p>
* Ovo je druga stavka.

Ova tehnika se može koristiti DaY za različite oblike uključivanja blokova unutar stavke liste (jer su stavke liste tehnički blok elementi, koji mogu da sadrže druge blok elemente):

* Ovo je jedna stavka.<!--
--><p>Ovo je novi paragraf unutar ove stavke i sada ćemo citirati nekoga:</p><!--
-->{{talk quote block|Zamislite svet u kome svaka osoba ima slobodan pristup celokupnom ljudskom znanju.|Džimbo}}<!--
--><p>Ovo je zatvarajući paragraf u istoj stavki liste.</p>
* Ovo je druga stavka.

Imajte na umu da se svaki fensi šablon ne može koristiti na ovaj način (npr. neki ukrasni šabloni citata su zasnovani na tabeli, a MediaWiki parser neće tretirati takve oznake kao da su unutar stavke liste).


Nemojte koristi prelome redova za simulaciju pasusa, jer imaju različitu semantiku:

* Ovo je jedna stavka.<br>Ovo je isti paragraf sa prelomom reda pre njega.
* Ovo je druga stavka.

Kod za lomljenje reda ( <br> ) je za korišćenje unutar paragrafa, kao npr. za stihove pesme ili blokova izvornog koda.

Definitivno nemojte pokušavati da koristite dvotačku da bi ste izjednačili nivoe uvlačenja, pošto (kao što je gore pomenuto) to proizvodi tri odvojene liste:

* Ovo je jedna stavka prve liste.
: Ovo je potpuno druga lista
* Ovo je treća lista

Alternativno, možete DaY koristite jedan od šablona HTML liste da biste garantovali grupisanje. Ovo je najkorisnije za uključivanje blok elemenata, kao što je formatirani kod, u liste:

{{bulleted list
|1=Ovo je jedna stavka:
<pre>
Ovo je neki kod.
</pre>
Ovo je još uvek deo prve stavke.
|2=Ovo je druga stavka.
}}

Ali ova tehnika se ne koristi na stranicama za razgovor.

Uvlačenje[uredi | uredi kod]

Pristupačan pristup uvlačenju je šablon {{block indent}} za sadržaj u više redova; koristi CSS za uvlačenje materijala. Za pojedinačne redove postoje različiti šabloni, uključujući {{in5}} (univerzalni šablon, sa istim imenom na svim Wikimedijinim sajtovima); ove uvlake sa različitim razmacima. Nemojte zloupotrebljavati <blockquote>...</blockquote> element ili šablone koji ga koriste (kao što je {{blockquote}} AKA {{quote}} ) za vizuelno uvlačenje; oni su samo za direktno citirani materijal. Generička alternativa {{block indent}} je kreirana za takve slučajeve bez navodnika, pa je koristite.

Dvotačka ( : ) na početku reda označava taj red u MediaWiki parseru kao <dd> deo HTML liste opisa (<dl>).[n 4] Vizuelni efekat u većini web pregledača je uvlačenje linije. Ovo se koristi, na primer, za označavanje odgovora u nizu diskusija na stranicama za razgovor. Međutim, samo ovoj oznaci nedostaje traženi <dt> (term) element liste opisa, na koji se odnosi <dd> (opis/definicija). Kao što se može videti pregledom koda poslatog pretraživaču, ovo dovodi do pokvarenog HTML-a (tj. ne uspeva validacija[6] ). Rezultat je da će pomoćna tehnologija, kao što su čitači ekrana, objaviti listu opisa koja ne postoji, što je zbunjujuće za svakog posetioca koji ne koristi oštećene oznake Wikipedije. Ovo nije idealno za pristupačnost, semantiku ili ponovnu upotrebu, ali se trenutno često koristi, uprkos problemima koje izaziva korisnicima čitača ekrana.

Ne treba ostavljati prazne redove u uvučenim listama., naročito u člancima. Softver će ovo čitati kao kraj jedne i početak druge liste. Ako je potreban prostor, postoje dva pristupa koja će imati različite rezultate za čitače ekrana:

Prvi je da dodate prazan red sa istim brojem dvotačaka kao i oni koji prethode tekstu iznad i ispod praznog reda. Ovo je prikladno kada dva urednika daju komentare odmah jedan iza drugog na istom nivou uvlačenja. Na primer:

: Potpuno se slažem. —Korisnik:Primer
:
: Baš mi i nije jasno. Jel ima neki drugi izvor za ovo? —Korisnik:Primer2

Ovo će čitaču ekrana reći da su ovo dve stavke liste (linija sa dve tačke bez teksta će biti zanemarena). Drugi pristup, kada je materijal zamišljen da bude jedan komentar (ili druga stavka liste, npr. u tekstu članka) je da se koriste oznake novog pasusa na istoj izlaznoj liniji (pogledajte prethodni odeljak za napredne tehnike u ovom, da biste uključili složeni blokovi sadržaja):

: Tekst ovde.{{pb}}Još teksta. —Korisnik:Primer10

Da biste prikazali matematičku formulu ili izraz na sopstvenoj liniji, preporučuje se da <math display="block">1 + 1 = 2</math> koristi umesto :<math>1 + 1 = 2</math>.

Vertikalne liste[uredi | uredi kod]

Vertikalne liste sa zvezdicama[uredi | uredi kod]

Problem sa praznim redovima je u tome što, ako su stavke liste odvojene sa više od jednog preloma reda, HTML lista će biti završena pre preloma reda, a druga HTML lista će biti otvorena nakon preloma reda. Ovo efektivno razbija ono što se vidi kao jedna lista na nekoliko manjih lista za one koji koriste čitače ekrana. Na primer, za kodiranje:

* Bela ruža
* Žuta ruža

* Ružičasta ruža

* Crvena ruža

softver delimično potiskuje razmake između redova i stoga izgleda ovako:

  • Bela ruža
  • Žuta ruža
  • Ružičasta ruža
  • Crvena ruža

ali će ga čitač ekrana pročitati kao: „Lista od 2 stavke: (zvezdica) Bela ruža, (zvezdica) Žuta ruža, kraj liste. Lista od 1 stavke: (zvezdica) Ružičasta ruža, kraj liste. Lista od 1 stavke: (zvezdica) Crvena ruža, kraj liste."

Ne razdvajajte stavke liste prelomima redova (<br />). Koristite {{plainlist}} / {{unbulleted list}} ako lista treba da ostane vertikalna; ili razmotrite {{flatlist}} / {{hlist}} ako bi se lista mogla bolje prikazati horizontalno (inline) kao što je opisano u sledeća dva odeljka.

Neoznačene vertikalne liste[uredi | uredi kod]

Za liste bez nabrajanja koje se kreću niz stranicu, dostupni su šabloni {{plainlist}} i {{unbulleted list}}, da bi se poboljšala pristupačnost i semantička smislenost označavanjem onoga što je jasno lista umesto uključivanja <br /> prelomi redova, koji ne bi trebalo da se koriste—pogledajte gore. Razlikuju se samo po viki oznakama koje se koriste za kreiranje liste. Imajte na umu da pošto su ovo šabloni, tekst svake stavke liste ne može sadržati simbol vertikalne trake ( | ) osim ako nije zamenjen sa {{!}} ili se nalazi u oznakama <nowiki>...</nowiki>. Slično tome, ne može da sadrži znak jednakosti ( = ), osim ako nije zamenjen sa {{=}} ili sadržan u okviru <nowiki>...</nowiki>, mada ovo možete zaobići tako što ćete dati nazive parametrima ( |1=, |2= itd. ). Ako ovo postane prevelika gnjavaža, možda ćete moći da koristite varijantu koristeći {{endplainlist}} umesto toga. Unutar reference, možda će vam trebati {{unbulleted list citebundle}}.

Primer obične liste
Vikitekst Prikazuje se kao
{{plainlist |
* Bela ruža
* Žuta ruža
* Ružičasta ruža
* Crvena ruža
}}
  • Bela ruža
  • Žuta ruža
  • Ružičasta ruža
  • Crvena ruža
Primer liste bez nabrajanja
Vikitekst Prikazuje se kao
{{unbulleted list
| Bela ruža
| Žuta ruža
| Ružičasta ruža
| Crvena ruža
}}
  • Bela ruža
  • Žuta ruža
  • Ružičasta ruža
  • Crvena ruža

Alternativno, u šablonima kao što su navigacioni sandučići i slično, ili bilo koji odgovarajući kontejner, takve liste mogu biti stilizovane klasom „plainlist“, na ovaj način:

  • | listclass = plainlist or
  • | bodyclass = plainlist

U infokutijama :

  • | rowclass = plainlist or
  • | bodyclass = plainlist

mogu se koristiti.

Horizontalne liste[uredi | uredi kod]

Za liste koje se kreću preko stranice i u pojedinačnim redovima u infokutijama i drugim tabelama, šabloni {{flatlist}} i {{hlist}} (za horizonalnu listu) su dostupni za poboljšanje pristupačnosti i semantičkog smisla. Ova funkcija koristi ispravne HTML oznake za svaku stavku liste, umesto da uključuje znakove za nabrajanje koje se, na primer, čitaju (npr. "tačka mačka tačka pas tačka konj tačka...") pomoćnim softverom koji koriste ljudi koji su slepi. Šabloni se razlikuju samo po viki-oznakama koje se koriste za kreiranje liste. Imajte na umu da kada se tekst prosleđuje ovim (ili bilo kojim drugim) šablonima, znak vertikalne trake ( | ) treba da bude prikazan sa {{!}} {{!}}.

Primer flatlist-e
Wikitekst Prikazuje se kao
{{flatlist |
* Bela ruža
* Crvena ruža
** Ružičasta ruža
* Žuta ruža
}}
  • Bela ruža
  • Crvena ruža
    • Ružičasta ruža
  • Žuta ruža
Primer hlist-e
Wikitekst Prikazuje se kao
{{hlist
| Bela ruža
| Crvena ruža
| Ružičasta ruža
| Žuta ruža
}}
  • Bela ruža
  • Crvena ruža
  • Ružičasta ruža
  • Žuta ruža

Alternativno, u šablonima kao što su navigacioni sandučići i slično, ili bilo kom odgovarajućem kontejneru, takve liste mogu biti stilizovane klasom hlist, na ovaj način:

  • | listclass = hlist ili
  • | bodyclass = hlist

U infokutijama :

  • | rowclass = hlist ili
  • | bodyclass = hlist

mogu se koristiti.

Naslovi liste[uredi | uredi kod]

Nepravilno korišćenje tačke-zareza da bi se napravilo lažno zaglavlje liste može da stvori rupu u listi. Umesto toga, možete da koristite oznake naslova.

1. Neispravan
; Plemeniti gasovi
* Helijum
* Neon
* Argon
* Kripton
* Ksenon
* Radon
DaY 2. Naslov
== Plemeniti gasovi ==
* Helijum
* Neon
* Argon
* Kripton
* Ksenon
* Radon

Tabele[uredi | uredi kod]

Čitači ekrana i drugi alati za pregledanje weba koriste specifične oznake tabele kako bi pomogli korisnicima da se kreću kroz podatke sadržane u njima.

Koristite ispravnu vikitable sintaksu cevi da biste iskoristili sve dostupne funkcije. Pogledajte meta:Pomoć:Tabele za više informacija o posebnoj sintaksi koja se koristi za tabele. Nemojte koristiti samo formatiranje, bilo iz CSS-a ili čvrsto kodiranih stilova, za stvaranje semantičkog značenja (npr. promena boje pozadine).

Mnogi navigacioni sandučići, šabloni serija i infokutije su napravljeni pomoću tabela.

Izbegavajte korišćenje <br /> ili <hr /> oznake u susednim ćelijama da emuliraju vizuelni red koji se ne odražava u strukturi HTML tabele. Ovo je problem za korisnike čitača ekrana koji čitaju tabele ćeliju po ćeliju, HTML red po HTML red, a ne vizuelni red po vizuelni red.

Tabele podataka[uredi | uredi kod]

{|
|+ [Opis tabele]
|-
! scope="col" | [Zaglavlje kolone 1]
! scope="col" | [Zaglavlje kolone 2]
! scope="col" | [Zaglavlje kolone 3]
|-
! scope="row" | [Zaglavlje reda 1]
| [Ćelija 1,2] || [Ćelija 1,3]
|-
! scope="row" | [Zaglavlje reda 2]
| [Ćelija 2,2] || [Ćelija 2,3]
...
|}
Naslov ( |+ )
Naslov je naslov tabele, koji opisuje njenu prirodu.[7] Tabele sa podacima uvek treba da sadrže naslov.
Zaglavlja redova i kolona ( ! )
Kao i natpis, oni pomažu posetiocima da predstave informacije u logičnoj strukturi.[8] Zaglavlja pomažu čitačima ekrana da prikažu informacije zaglavlja o ćelijama podataka. Na primer, informacije zaglavlja se izgovaraju pre podataka ćelije, ili se informacije zaglavlja daju na zahtev.[9] Pošto se zaglavlje reda i kolone mogu izgovoriti pre podataka u svakoj ćeliji kada se krećete u režimu tabele, neophodno je da zaglavlja kolone i zaglavlja redova na jedinstven način identifikuju kolonu, odnosno red.[10]
Opseg zaglavlja ( ! scope="col" | i ! scope="row" | )
Ovo jasno identifikuje zaglavlja kao zaglavlja redova ili zaglavlja kolona. Zaglavlja se sada mogu povezati sa odgovarajućim ćelijama.[11]

Wikipedija:Priručnik za stil/pristupačnost/tabele sa podacima pruža detaljne zahteve o:

  1. Ispravni naslovi tabela
  2. Ispravna struktura zaglavlja
  3. Složene tabele
  4. Slike i boja
  5. Izbegavanje ugnežđenih tabela

Tabele rasporeda[uredi | uredi kod]

Izbegavajte korišćenje tabela za vizuelno pozicioniranje netabelarnog sadržaja. Tabele podataka pružaju dodatne informacije i metode navigacije koje mogu biti zbunjujuće kada sadržaju nedostaju logički odnosi između redova i kolona. Umesto toga, koristite semantički odgovarajuće elemente ili < div > s i atribute style.

Kada koristite tabelu za pozicioniranje netabelarnog sadržaja, pomozite čitačima ekrana da ga identifikuju kao tabelu izgleda, a ne tabelu sa podacima. Postavite atribut role="presentation" na tabelu i nemojte postavljati nijedan atribut summary. Nemojte koristiti elemente < caption > ili < th > unutar tabele ili unutar bilo koje ugnežđene tabele. U označavanju viki tabele, to znači da ne koristite |+ ili ! prefiksi. Uverite se da je redosled čitanja sadržaja ispravan. Vizuelni efekti, kao što su centriranje ili podebljano pismo, mogu se postići pomoću stilskih listova ili semantičkih elemenata. Na primer:

{| role="presentation" class="toccolors" style="width:94%"
|-
| colspan="2" style="text-align: center; background-color: #ccf;" | <strong>Važan tekst</strong>
|-
| Ture bure || gura
|-
| Bula bure || valja.
|}

Slike[uredi | uredi kod]

  1. Slike i ikone koje nisu isključivo dekorativne treba da sadrže alt atribut koji služi kao zamena za sliku za slepe čitaoce, paukove pretrage i druge ne-vizuelne korisnike. Ako se doda dodatni alternativni tekst, treba da bude sažet ili da uputi čitaoca na naslov ili susedni tekst.
  2. Izbegavajte da koristite slike umesto tabela i grafikona. Gde je to moguće, svi grafikoni i dijagrami bi trebalo da imaju tekstualni ekvivalent ili da budu dobro opisane kako bi korisnici koji ne mogu da vide sliku mogli da razumeju koncept.
  3. Izbegavajte stavljanje slika na levu stranu ekrana pošto konzistentna leva margina čini čitanje lakšim.
  4. Izbegavajte sendvičovanje teksta između 2 slike.
  5. Idelno, članak ne bi trebalo da ima više od 100 slika.
  6. Izbegavajte da u tekstu ne upućujete na sliku levo ili desno. Mesto na kom se slika nalazi se možda razlikuje na mobilnim verzijama sajta, a takođe je i besmisleno za korisnike kojima članke čita softver za čitanje. Koristite opise za identifikacije slika.
  7. Detaljni opisi slika, gde nisu pogodni za članak, treba da se nalaze na stranici slike, sa napomenom da će slika preusmeriti na detaljniji opis.
  8. Slike treba da se nalaze u delu članka za koji su vezani, a ne u zaglavlju članka ili nekom drugom delu. Ovo osigurava da će se slike prikazivati na mobilnim uređajima i (njihovi opisi) čitati kroz čitače ekrana na mestima na kojima treba.
  9. Ne stavljati slike u zaglavlje članka.

Animacije, video i audio sadržaji[uredi | uredi kod]

Animacije[uredi | uredi kod]

Da bi bila dostupna, animacija (GIF – Format za razmenu grafike) treba da:

  • Ne bude duži od pet sekundi (što ga čini čisto dekorativnim elementom)[12] ili
  • Bude opremljen kontrolnim funkcijama (zaustavljanje, pauza, reprodukcija)[13]

Ovo zahteva da GIF-ovi sa animacijama dužim od pet sekundi budu konvertovani u video (da biste saznali kako, pogledajte vodič za pretvaranje animiranih GIF-ova u Theora OGG).

Animacije ne smeju da imaju više od tri blica u bilo kom periodu od jedne sekunde. Poznato je da sadržaj koji treperi više od tri puta u sekundi izaziva napade.[14]

Video[uredi | uredi kod]

Video zapisima se mogu dodati titlovi u vremenski ograničenom tekstualnom formatu. Postoji odgovarajuća stranica pomoći na Commons:Video#Subtitlovi i titlovi. Titlovi su namenjeni za transkripciju govora.

Postoji potreba za titlovima za osobe sa oštećenim sluhom. Od novembra 2012. to nije moguće, ali se ova funkcija može lako dodati i zahtevana je u bugzilla:41694. Zatvoreni titlovi su namenjeni za gledanje umesto titlova. Zatvoreni titlovi pružaju tekstualnu verziju svih važnih informacija koje se pružaju putem zvuka. Može uključivati dijaloge, zvukove (prirodne i veštačke), okruženje i pozadinu, radnje i izraze ljudi i životinja, tekst ili grafiku.[15] Trebalo bi konsultovati vodiče van Wikipedije da biste saznali kako da napravite titlove.[16]

Tekstualna verzija videa je neophodna za slepe, ali od novembra 2012. ne postoji pogodan način da se obezbedi alternativni tekst za video snimke.

Audio[uredi | uredi kod]

Titlovi za govor, tekstove, dijaloge itd.[17] se lako mogu dodati audio datotekama. Metod je sličan onom za videe: Komons:Video#Subtitlovi i titlovi.

Stilovi i opcije označavanja[uredi | uredi kod]

Najbolja praksa: Koristite viki oznake i CSS klase radije nego alternative[uredi | uredi kod]

Generalno, stilove za tabele i druge elemente na nivou bloka treba postaviti pomoću CSS klasa, a ne pomoću inline atributa stila. CSS za čitav sajt u MediaWiki:Common.css je pažljivije testiran da bi se obezbedila pristupačnost (npr. dovoljan kontrast boja) i kompatibilnost sa širokim spektrom pretraživača. Štaviše, omogućava korisnicima sa vrlo specifičnim potrebama da menjaju šeme boja u sopstvenoj tabeli stilova (Special:MyPage/skin.css, ili stilska lista njihovog pretraživača). Na primer, lista stilova na Wikipedija:Stilski listovi za korisnike sa oštećenim vidom obezbeđuje veći kontrast pozadine za navigacione kutije. Problem je u tome što kada se zaobiđu podrazumevane klase na celoj lokaciji, pojedincu je mnogo teže da odabere sopstvenu temu.

Takođe stvara veći stepen profesionalizma tako što obezbeđuje dosledan izgled između članaka i usklađenost sa stilskim vodičem.

Što se tiče pristupačnosti, odstupanja od standardnih konvencija se mogu tolerisati sve dok su pristupačne. Članovi projekta pristupačnosti su obezbedili da podrazumevani stil bude dostupan. Ako neki šablon ili specifična šema boja odstupa od standarda, njegovi autori treba da se postaraju da ispunjava zahteve pristupačnosti kao što je pružanje dovoljnog kontrasta boja. Na primer, infokutija i navigaciona kutija koji se odnose na sportski tim mogu koristiti žutu i crvenu šemu boja, kako bi se povezali sa bojama tima. U ovom slučaju, tamnocrvene veze na svetlo žutoj daju dovoljan kontrast boja, pa bi bile dostupne, dok bele na žutoj ili crne na crvenoj ne bi.

Uopšteno govoreći, članci bi trebalo da koriste wiki oznake, a ne ograničeni skup dozvoljenih HTML elemenata. Posebno nemojte koristiti elemente HTML stila <i> i <b> za formatiranje teksta; poželjno je koristiti Wiki-oznake '' ili ''' za čisto tipografski kurziv i boldovanje, respektivno, i koristiti šablone ili elemente semantičkog označavanja za značajnije razlike. Element <font> takođe treba izbegavati u tekstu članka; koristite {{em}}, {{code}}, {{var}} i druge naše šablone semantičkih oznaka po potrebi, da naglasite logičke razlike ne samo vizuelne. Koristite šablone {{resize}}, {{small}} i {{big}} da biste promenili veličinu fonta, umesto da je eksplicitno podešavate pomoću atributa CSS stila kao što su font-size ili zastareli elementi stila kao što je <big>. Naravno, postoje prirodni izuzeci; na primer, može biti korisno koristiti element <u>...</u> da bi se naznačilo nešto poput primera veze na koju se zaista ne može kliknuti, ali se podvlačenje inače generalno ne koristi u tekstu članka.

Korisnici sa ograničenom podrškom za CSS ili JavaScript[uredi | uredi kod]

Automatski skupljeni (prethodno skupljeni) elementi ne bi trebalo da se koriste za sakrivanje sadržaja u glavnom delu članka.

Članci Wikipedije bi trebalo da budu dostupni čitaocima koji koriste pregledače i uređaje koji imaju ograničenu ili nikakvu podršku za JavaScript ili kaskadne tabele stilova, što se u web razvoju naziva „progresivno poboljšanje“. Zapamtite da se sadržaj Wikipedije može slobodno ponovo koristiti na načine koje ne možemo da predvidimo, kao i da se može pristupiti direktno preko starijih pregledača. U isto vreme, prepoznato je da je nemoguće obezbediti isti kvalitet izgleda takvim korisnicima bez nepotrebnog izbegavanja funkcija koje bi koristile korisnicima sa sposobnijim pretraživačima. Kao takve, ne smeju se koristiti funkcije koje bi prouzrokovale sakrivanje ili oštećenje sadržaja kada CSS ili JavaScript nisu dostupni. Imajte na umu da mobilne verzije web sajtova ne podržavaju sažimanje, tako da će sav sadržaj koji se može sklopiti automatski biti otvoren.

Da biste udovoljili ovim razmatranjima, testirajte sve potencijalno ometajuće promene sa onemogućenim JavaScript ili CSS U Firefox-u ili Chrome-u, ovo se može lako uraditi sa ekstenzijom Web Developer; JavaScript se može onemogućiti u drugim pregledačima na ekranu „Opcije“. Budite posebno oprezni sa ugrađenim CSS efektima, koje ne podržava nekoliko pretraživača, medija i KSHTML verzija.

U 2016, oko 7% posetilaca Wikipedije nije zahtevalo JavaScript resurse.[18]

Napomene[uredi | uredi kod]

  1. Prethodna verzija, WCAG 2.0, je takođe ISO standard — ISO/IEC 40500:2012.
  2. Uopšteno, infokutije i navigacione kutije prikazuju tekst na 88% veličine koja je uobičajena. Veličina u referencama je na 90% veličine. Ostale vrednosti se mogu pronaći na MediaWiki:Common.css.
  3. Više detalja je dostupno na dokumentaciji šablona {{Jez}}.
  4. HTML liste opisa su se ranije zvale liste defnicija i liste asocijacija. Struktura koda je ista, samo se ime promenilo između verzija HTML-a.

Reference[uredi | uredi kod]

  1. „F26: Failure of Success Criterion 1.3.3 due to using a graphical symbol alone to convey information”. Techniques for WCAG 2.0. World Wide Web Consortium. Pristupljeno 1. 1. 2011. 
  2. https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-small-element
  3. H58: Using language attributes to identify changes in the human language, Techniques for WCAG 2.0, W3C, accessibility level: AA.
  4. „G91: Providing link text that describes the purpose of a link”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  5. „F84: Failure of Success Criterion 2.4.9 due to using a non-specific link such as "click here" or "more" without a mechanism to change the link text to specific text”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  6. „Markup Validation Service: Check the markup (HTML, XHTML, …) of Web documents”. World Wide Web Consortium. 2017. Pristupljeno December 13, 2017.  The validator failure reported is "Error: Element dl is missing a required child element."
  7. H39: Using caption elements to associate data table captions with data tables, A accessibility level.
  8. „H51: Using table markup to present tabular information”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  9. „Table cells: The TH and TD elements”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  10. „Tables with JAWS”. Freedom Scientific. Pristupljeno 18 February 2021. 
  11. „H63: Using the scope attribute to associate header cells and data cells in data tables”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  12. „Setting animated gif images to stop blinking after n cycles (within 5 seconds)”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  13. „Allowing the content to be paused and restarted from where it was paused”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  14. „Guideline 2.3 Seizures: Do not design content in a way that is known to cause seizures.”. World Wide Web Consortium. 11 December 2008. Pristupljeno 28 May 2015. 
  15. „Providing an alternative for time based media”. W3C. Pristupljeno 1 January 2011. 
  16. Please see: A quick and basic reference for closed captions, a detailed reference (PDF) and a list of best practices for closed captions.
  17. „Providing an alternative for time-based media for audio-only content”. World Wide Web Consortium. Pristupljeno 1 January 2011. 
  18. File:Browsers, Geography, and JavaScript Support on Wikipedija Portal.pdf and File:Analysis of Wikipedija Portal Traffic and JavaScript Support.pdf.