Dakle, čuli ste puno priča o nečemu što se zove pristupačnost. Možda ste čak čuli za ljude koji tuže velike tvrtke zbog pružanja nedostupnih usluga. Ali znate li točno što znači pristupačnost?
Na sreću, pristupačnost nije preteška za razumjeti ili implementirati, nakon što joj se posvetite. Nakon što naučite što je pristupačnost, tu teoriju možete primijeniti u praksi pisanjem pristupačnih Vue.js aplikacija.
Što je pristupačnost?
Pristupačnost je popularna riječ na webu, ali što točno znači? Ispada da je ime prilično opisno. Pristupačnost je jednostavno mjera koliko je web aplikacija upotrebljiva za sve vrste ljudi.
Ne doživljavaju svi web na isti način. Neki ljudi imaju oštećenja koja mogu utjecati na njihov sluh ili vid. Neki ne mogu pristupiti modernom hardveru ili brzom internetu, a ljudi često moraju koristiti internet u uvjetima koji nisu idealni. Pristupačnost znači osigurati da svi ti ljudi i dalje mogu koristiti web-aplikaciju što je lakše moguće.
Zašto je pristupačnost važna?
Pristupačnost je važna jer kada je aplikacija vrlo dostupna, može poslužiti što većem broju ljudi. Kada netko pruža uslugu ili informacije na web stranici, cilj im je da drugi ljudi koriste tu uslugu ili čitaju te informacije.
Optimizacija za pristupačnost osigurava da što manje ljudi ne može koristiti web-aplikaciju. Nadalje, pristupačnije web aplikacije općenito su bolje rangirane u rezultatima pretraživanja. To omogućuje još većem broju ljudi da pronađu i koriste pristupačnije web aplikacije.
Uobičajene greške programera koje štete pristupačnosti
Mnoge su web aplikacije manje dostupne nego što bi mogle biti. To je obično rezultat pogrešaka onih koji su ih izgradili. Neke uobičajene pogreške pristupačnosti koje programeri čine prilikom izrade aplikacija su:
Korištenje nedostupnih knjižnica
Možete se osloniti na biblioteke trećih strana kako biste uštedjeli vrijeme i trud kada razvijate svoje aplikacije. Nažalost, ne shvaćaju sve knjižnice pristupačnost ozbiljno, a može biti teško identificirati one dobre. Lako je na kraju slučajno smanjiti dostupnost svojih aplikacija na ovaj način.
Zanemarivanje semantičkog HTML-a pri izgradnji komponenti
Semantički HTML je HTML čije je značenje kao i njegova struktura ispravna. Svaka HTML oznaka ima inherentnu svrhu koju pomoćna tehnologija koristi da zaključi značenje njezinog sadržaja. Na primjer, oznaka zaglavlja označava zaglavlje web-mjesta. Čitač zaslona trebao bi moći najaviti da je sve unutar oznake zaglavlja zaglavlje web-mjesta.
Nažalost, ništa vas ne sprječava da koristite oznaku u pogrešnu svrhu. Drugi uobičajen primjer je korištenje oznake gumba da djeluje kao veza ili obrnuto.
Pisanje HTML-a na ovaj način šteti pristupačnosti, jer pomoćna tehnologija više ne može biti sigurna u svrhu bilo kojeg HTML elementa. To može na kraju proizvesti zbunjujuće ili frustrirajuće rezultate za korisnike tehnologije. Za maksimalnu dostupnost, uvijek biste trebali napisati semantički HTML, čak i ako to znači malo više posla.
Ne testira se pristupačnost
Izrada web aplikacije često može biti težak zadatak sa zahtjevnim rokovima. Između žurbe da se dovrše značajke i tereta testiranja drugih aspekata softvera, testiranje pristupačnosti zauzima pozadinu. Možda ćete biti u iskušenju da implementirate aplikaciju u proizvodnju prije nego što je testirate na probleme s pristupačnošću.
Zašto? Testiranje zahtijeva vrijeme i može zahtijevati opsežne promjene koda aplikacije. Ali testiranje web aplikacije neizostavan je dio procesa razvoja. Pristupačnost svoje aplikacije trebali biste testirati jednako rigorozno kao i svaki drugi aspekt.
Srećom, postoje alati koji pomažu u rješavanju ovih problema. Sljedećih pet alata može vam pomoći da napišete pristupačnije Vue.js aplikacije:
WAVE je zbirka alata koji razvojnim programerima pomaže da automatski testiraju svoje aplikacije na probleme pristupačnosti. Iako WAVE nije zamjena za testiranje krajnjeg korisnika, ipak vam može pomoći u otkrivanju mnogih problema s pristupačnošću.
WAVE na svojoj web stranici nudi alat za online testiranje. Također nudi proširenja preglednika i nekoliko drugih alata za pomoć pri testiranju pristupačnosti za mnoge vrste web-aplikacija.
Mnogi znakovi koje web-aplikacije koriste za komuniciranje aktivnosti, kao što su trake napretka i indikatori učitavanja, isključivo su vizualni. Osobe s oštećenjem vida ili osobe koje koriste čitače zaslona ne mogu ih uočiti.
Vue-announcer je knjižnica koja vam omogućuje da najavite promjene u vašim Vue.js aplikacijama na način kojem svi mogu pristupiti.
Vue-skip-to je knjižnica stvorena kako bi omogućila ljudima koji koriste čitač zaslona da preskoče izravno na glavni sadržaj Vue.js aplikacije. To je korisno jer mnoge web-aplikacije imaju veze za navigaciju i druge elemente prije glavnog sadržaja. Neki korisnici ih lako mogu preskočiti, ali mogu biti problematični i frustrirajući za korištenje s čitačem zaslona.
ESLint je alat koji vam pomaže da napišete bolji JavaScript analizirajući vaš kod i provjeravajući ga na greške.
Ovaj alat je dodatak ESLint koji vam pomaže osigurati da struktura vaših Vue.js komponenti odgovara pravilima pristupačnosti.
Kada je instaliran, ovaj dodatak analizira sve Vue.js datoteke i ukazuje na problematičan kod. Tada možete maksimalno povećati pristupačnost dok pišete svoje aplikacije, umjesto da morate mijenjati kôd nakon faze testiranja.
Veliki izvor problema s pristupačnošću u aplikacijama je korištenje nedostupnih biblioteka komponenti. Vuetensils je biblioteka komponenti Vue.js.
Ove su komponente optimizirane za minimalnu veličinu, maksimalnu pristupačnost, jednostavnu upotrebu i jednostavno oblikovanje. Možete uštedjeti vrijeme i koristiti ove unaprijed izgrađene komponente bez narušavanja pristupačnosti vaših aplikacija.
Pristupačnost u Vue.js je jednostavna
Pristupačnost znači osigurati da svatko može koristiti vašu aplikaciju u bilo kojem kontekstu. Povećanje pristupačnosti važno je kako bi se osiguralo da aplikaciju može koristiti što više ljudi.
Programeri često rade uobičajene, ali moguće spriječiti pogreške u pristupačnosti prilikom izrade svojih aplikacija. Uobičajeni problemi uključuju netestiranje i pisanje nesemantičkog HTML-a. Ali uz pomoć nekoliko alata, lakše je pisati vrlo pristupačne Vue.js aplikacije.