odkaz na přístupnost

Tato stránka je komplexním odkazem na funkce usnadnění přístupu v prohlížeči Chrome DevTools.It je určen pro webové vývojáře, kteří:

• mají základní znalosti o DevTools, například jak ji otevřít.
• jsou obeznámeni s principy přístupnosti a osvědčenými postupy.

účelem tohoto odkazu je pomoci vám objevit všechny dostupné nástroje inDevTools, které vám mohou pomoci prozkoumat Přístupnost stránky.

viz navigace Chrome DevTools s asistivní Technologiípokud hledáte pomoc při navigaci DevTools s asistivní technologií, jako je Čtečka obrazovky.

Přehled funkcí usnadnění v Chrome DevTools

tato část vysvětluje, jak DevTools zapadá do vaší celkové sady nástrojů pro usnadnění přístupu.

při určování, zda je stránka přístupná, musíte mít na paměti 2 obecné otázky:

1. mohu procházet stránku pomocí klávesnice nebo čtečky obrazovky?
2. jsou prvky stránky správně označeny pro čtečky obrazovky?

obecně vám DevTools může pomoci opravit chyby související s otázkou #2, protože tyto chyby jsousnadno detekovat automatizovaným způsobem. Otázka č. 1 je stejně důležitá, ale bohužel DevToolscan ‚ t pomoci tam. Jediný způsob, jak najít chyby související s otázkou č. 1, je zkusit použít stránkus klávesnicí nebo čtečkou obrazovky sami. Podívejte se, jak provést přehled Přístupnostinaučit se více.

Audit přístupnosti stránky

obecně použijte panel auditů k určení, zda:

• stránka je správně označena pro čtečky obrazovky.
• textové prvky na stránce mají dostatečné kontrastní poměry. Viz také zobrazit kontrastní poměr textového prvku ve sběrači barev.

Chcete-li provést audit stránky:

1. přejděte na adresu URL, kterou chcete auditovat.

2. v DevTools klikněte na kartu audity. DevTools zobrazuje různé možnosti konfigurace.

   

3. u zařízení vyberte možnost Mobilní, pokud chcete simulovat mobilní zařízení. Tato volba změníjinak řetězec uživatelského agenta a změní velikost výřezu. Pokud je mobilní verze stránkyzobrazuje se jinak než verze pro stolní počítače, tato možnost by mohla mít významný vliv navýsledky vašeho auditu.

4. v části audity se ujistěte, že je Přístupnost povolena. Zakažte dalšíkategorie, pokud je chcete vyloučit ze sestavy. Nechte je povolené, pokud chceteobjevte další způsoby, jak zlepšit kvalitu vaší stránky.

5. sekce škrticí umožňuje škrticí síť a CPU, což je užitečné při analyzovánívýkon zatížení. Tato možnost by měla být irelevantní pro vaše skóre přístupnosti, takže můžete použítco chcete.

6. zaškrtávací políčko Vymazat úložiště umožňuje vymazat všechna úložiště před načtením stránky nebo zachovat uložení mezi načtením stránky. Tato možnost je také pravděpodobně irelevantní pro vaše skóre přístupnosti, takže můžete použít, co chcete.

7. Klikněte Na Spustit Audity. Po 10 na 30 sekundy, DevTools poskytuje zprávu.Vaše zpráva vám poskytne různé tipy, jak zlepšit přístupnost stránky.

   

8. kliknutím na audit se o něm dozvíte více.

   

9. kliknutím na další informace zobrazíte dokumentaci k auditu.

   

Viz také: rozšíření sekery

můžete raději použít rozšíření sekery než Panel auditů.Obecně poskytují stejné informace, protože aXe je základním motorem, který pohání panel auditů. Rozšíření aXe má jiné uživatelské rozhraní a popisuje audity trochu jinak.Jednou z výhod, které má rozšíření aXe oproti panelu auditů, je to, že vám umožňuje kontrolovat a zvýrazňovat selhání uzlů.

podokno usnadnění

podokno usnadnění je místo, kde můžete zobrazit strom usnadnění přístupu, atributy ARIA a Složené vlastnosti přístupnosti uzlů DOM.

pro otevření podokna usnadnění přístupu:

1. klikněte na kartu prvky.
2. ve stromu DOM vyberte prvek, který chcete zkontrolovat.
3. klikněte na kartu usnadnění přístupu. Tato karta může být skryta za tlačítkem více karet.

zobrazení pozice prvku ve stromu přístupnosti

strom přístupnosti je podmnožinou stromu DOM. Obsahuje pouze prvky z Dom stromu, které jsou relevantní a užitečné pro zobrazení obsahu stránky v čtečce obrazovky.

zkontrolujte polohu prvku ve stromu přístupnosti z podokna Přístupnost.

zobrazení atributů Aria prvku

atributy ARIA zajišťují, že čtenáři obrazovky mají všechny informace, které potřebují, aby správně reprezentovali obsah stránky.

zobrazení atributů ARIA prvku v podokně usnadnění přístupu.

zobrazení vypočtených vlastností přístupnosti prvku

některé vlastnosti přístupnosti jsou dynamicky vypočteny prohlížečem. Tyto vlastnosti lze zobrazit v části vypočtené vlastnosti podokna usnadnění přístupu.

zobrazení vypočtených vlastností přístupnosti prvku v podokně přístupnosti.

zobrazení kontrastního poměru textového prvku v nástroji pro výběr barvy

někteří lidé se slabým zrakem nevidí oblasti jako velmi světlé nebo velmi tmavé. Všechno má tendenci se objevit přibližně ve stejném jasu, což ztěžuje rozlišení obrysů a hran.Kontrastní poměr měří rozdíl v jasu mezi popředí a pozadímtextu. Pokud má váš text nízký kontrastní poměr, mohou tito uživatelé s nízkým zrakem doslova zažít váš web jako prázdnou obrazovku.

výběr barvy vám pomůže zajistit, aby váš text splňoval doporučený poměr kontrastu:

1. klikněte na kartu prvky.

2. ve stromu DOM vyberte textový prvek, který chcete zkontrolovat.

   

3. v podokně Styly klikněte na barevný čtverec vedle hodnoty color prvku.

   

4. zkontrolujte část kontrastní poměr výběru barvy. Jedno zaškrtnutí znamená, žeprvek splňuje minimální doporučení.Dvě zaškrtnutí znamená, že splňuje rozšířené doporučení.

   

5. kliknutím na sekci kontrastní poměr zobrazíte další informace. V horní části sběrače barev se zobrazí řádek vizuálnípicker. Pokud aktuální barva splňuje doporučení, pakco na stejné straně linky také splňuje doporučení. Pokud aktuální barva nesplňuje doporučení, pak nic na stejné straně také nesplňuje doporučení.

   

zpětná vazba