Kisegítő lehetőségek referencia

ez az oldal a Chrome kisegítő lehetőségeinek átfogó hivatkozása DevTools.It olyan webfejlesztők számára készült, akik:

• van egy alapvető megértése DevTools, mint például, hogyan kell megnyitni.
• ismerik az akadálymentesítési elveket és a legjobb gyakorlatokat.

ennek a hivatkozásnak az a célja, hogy segítsen felfedezni az összes rendelkezésre álló eszközt az eszközökben, amelyek segítenek megvizsgálni az oldal akadálymentességét.

lásd: Navigálás a Chrome DevTools-ban Kisegítő Technológiávalha segítséget keres a DevTools-ban való navigáláshoz olyan kisegítő technológiával, mint egy képernyőolvasó.

a Chrome devtools kisegítő lehetőségeinek áttekintése

ez a szakasz ismerteti, hogy a DevTools hogyan illeszkedik az Általános Kisegítő lehetőségek eszközkészletébe.

annak meghatározásakor, hogy egy oldal elérhető-e, 2 általános kérdést kell szem előtt tartania:

1. navigálhatok az oldalon billentyűzettel vagy képernyőolvasóval?
2. megfelelően vannak-e megjelölve az oldal elemei a képernyőolvasók számára?

Általánosságban elmondható, hogy a DevTools segíthet a 2.kérdéssel kapcsolatos hibák kijavításában, mivel ezeket a hibákat könnyű felismerni automatizált módon. Az 1. kérdés ugyanolyan fontos, de sajnos a Devtoolsnem tud segíteni ott. Az 1.kérdéssel kapcsolatos hibák megtalálásának egyetlen módja az, ha megpróbál egy oldalt használnibillentyűzettel vagy képernyőolvasóval. Lásd: hogyan kell elvégezni a Kisegítő lehetőségek Áttekintéséttöbbet megtudni.

az oldal akadálymentességének ellenőrzése

általánosságban az auditok panel segítségével állapítható meg, hogy:

• az oldal megfelelően van megjelölve a képernyőolvasók számára.
• az oldal szövegelemeinek megfelelő kontrasztaránya van. Lásd még a szövegelem kontrasztarányának megtekintése a színválasztóban.

egy oldal ellenőrzése:

1. nyissa meg az ellenőrizni kívánt URL-t.

2. a DevTools alkalmazásban kattintson az auditok fülre. DevTools megmutatja a különböző konfigurációs lehetőségeket.

   

3. az eszköz mezőben válassza a mobil lehetőséget, ha mobileszközt szeretne szimulálni. Ez az opció megváltoztatja a felhasználói ügynök karakterláncát, és átméretezi a nézetablakot. Ha az oldal mobil verziójamásképp jelenik meg, mint az asztali verzió, ez az opció jelentős hatással lehetaz ellenőrzés eredményeire.

4. az ellenőrzések szakaszban ellenőrizze, hogy a Kisegítő lehetőségek engedélyezve vannak-e. Tiltsa le az egyéb kategóriákat, ha ki akarja zárni őket a jelentésből. Hagyja őket engedélyezve, ha akarjataláljon más módszereket az oldal minőségének javítására.

5. a fojtás szakasz lehetővé teszi a hálózat és a CPU fojtását, ami hasznos a terhelés teljesítményének elemzésekor. Ennek az opciónak irrelevánsnak kell lennie az akadálymentességi pontszám szempontjából, így használhatjabármit is szeretne.

6. a tárolás törlése jelölőnégyzet lehetővé teszi az összes tárhely törlését az oldal betöltése előtt, vagy az oldalbetöltések közötti tárolást. Ez a lehetőség valószínűleg irreleváns az akadálymentességi pontszám szempontjából is, így bármit használhat, amit csak akar.

7. Kettyenés Auditok Futtatása. 10-30 másodperc elteltével a DevTools jelentést készít.A jelentés számos tippet ad az oldal hozzáférhetőségének javításához.

   

8. kattintson egy auditra, ha többet szeretne megtudni róla.

   

9. kattintson a További információ gombra az audit dokumentációjának megtekintéséhez.

   

Lásd még: aXe extension

előfordulhat, hogy az Axe extension-t szeretné használni az Audit panel helyett.Általában ugyanazokat az információkat szolgáltatják, mivel az aXe a mögöttes motor, amely az ellenőrzési testületet működteti. Az aXe kiterjesztés eltérő felhasználói felülettel rendelkezik, és kissé eltérően írja le az ellenőrzéseket.Az aXe kiterjesztés egyik előnye az Audit panellel szemben az, hogy lehetővé teszi a hibás csomópontok ellenőrzését éskiemelését.

a Kisegítő lehetőségek ablaktábla

a Kisegítő lehetőségek ablaktábla az a hely, ahol megtekintheti a Kisegítő lehetőségek fáját, az ARIA attribútumokat és a DOM csomópontok Kisegítő lehetőségek számítási tulajdonságait.

a Kisegítő lehetőségek ablaktábla megnyitása:

1. kattintson az elemek fülre.
2. a DOM fában válassza ki azt az elemet, amelyet ellenőrizni szeretne.
3. kattintson a Kisegítő lehetőségek fülre. Lehet, hogy ez a lap a további lapok Gomb mögött van elrejtve.

elem helyzetének megtekintése a Kisegítő lehetőségek fájában

a Kisegítő lehetőségek fája a DOM fa részhalmaza. Csak olyan elemeket tartalmaz a DOM fáról, amelyek relevánsak és hasznosak az oldal tartalmának képernyőolvasóban történő megjelenítéséhez.

ellenőrizze egy elem helyzetét a Kisegítő lehetőségek fájában a Kisegítő lehetőségek ablaktábláján.

Kisegítő lehetőségek fa szakasz egy elem ARIA attribútumainak megtekintése

ARIA attribútumok biztosítják, hogy a képernyőolvasók rendelkezzenek minden olyan információval, amelyre szükségük van az oldal tartalmának megfelelő megjelenítéséhez.

elem ARIA attribútumainak megtekintése a Kisegítő lehetőségek panelen.

elem számított akadálymentességi tulajdonságainak megtekintése

egyes akadálymentességi tulajdonságokat a böngésző dinamikusan számít ki. Ezek a tulajdonságok a Kisegítő lehetőségek ablaktábla számított tulajdonságok szakaszában tekinthetők meg.

egy elem számított Kisegítő lehetőségek tulajdonságainak megtekintése a Kisegítő lehetőségek panelen.

egy szövegelem kontrasztarányának megtekintése a színválasztóban

néhány gyengén látó ember nem látja a területeket nagyon világosnak vagy nagyon sötétnek. Minden általában ugyanolyan fényerővel jelenik meg, ami megnehezíti a körvonalak és az élek megkülönböztetését.A kontrasztarány az előtér és a szöveg háttere közötti fényerő-különbséget méri. Ha a szövegnek alacsony a kontrasztaránya, akkor ezek a gyengénlátó felhasználók szó szerinttapasztalja meg webhelyét üres képernyőként.

a színválasztó segítségével ellenőrizheti, hogy a szöveg megfelel-e az ajánlott kontrasztarány-szinteknek:

1. kattintson az elemek fülre.

2. a DOM fában válassza ki a ellenőrizni kívánt szövegelemet.

   

3. a stílusok ablaktáblában kattintson az elem color értéke melletti színes négyzetre.

   

4. ellenőrizze a színválasztó kontrasztarány szakaszát. Egy pipa azt jelentiaz elem megfelel a minimális ajánlásnak.Két pipa azt jelenti, hogy megfelel a továbbfejlesztett ajánlásnak.

   

5. kattintson a kontrasztarány szakaszra további információk megtekintéséhez. Egy sor jelenik meg a Visualpickerben a színválasztó tetején. Ha az aktuális szín megfelel az ajánlásoknak, akkorbármi a vonal ugyanazon oldalán is megfelel az ajánlásoknak. Ha az aktuális szín nemnem felel meg az ajánlásoknak, akkor ugyanazon az oldalon semmi sem felel meg az ajánlásoknak.

   

visszajelzés