10 nástrojů pro zlepšení přístupnosti webových stránek
Není pochyb o tom, že chápete, že je třeba, aby váš web byl přístupný pro co nejvíce uživatelů. Ale čtení všech pokynů a standardů může být trochu ohromující. Zde naleznete nejnovější doporučení W3C, ale potřebujete znát každé slovo a řídit se všemi pokyny?
Dnes se pokusíme o trochu jednodušší pomocí některých nástrojů a zdrojů, které vám pomohou zlepšit přístupnost webových stránek (a možná dokonce i některé kontroly, aby se zvážilo, že nebyly na vašem radaru!).
Ať už chcete zajistit dostatečný vizuální kontrast, web, který je přístupný pro čtečky obrazovky, nebo dokonce vytvářet přístupné e-maily, máme vás na něž se vztahuje!
1. Barva bezpečná
Color Safe vám pomůže kontrolovat (a dokonce vytvářet) přístupné barevné palety na základě WCAG pokynů pro kontrast barev textu a pozadí. Nástroj a standardy používají k určení barevných kombinací, které mohou všichni přečíst, poměr založený na poměru.
Pokyny WCAG doporučují kontrastní poměr 4, 5 pro malý text (tělo) a 3 pro velký text (cokoli přes 24 bodů).
Stačí zadat barvy - na základě HEX kódu - výběr a velikost písma a vygenerovat paletu. Získáte okamžitý poměr ke kontrole proti a uvidíte další podobné barvy. Zkontrolujte, zda by něco podobného nebylo lepší volbou na základě vašeho písma a velikosti.
2. NoCoffee
NoCoffee je rozšíření prohlížeče Google Chrome, které vám umožňuje vizualizovat svůj design stejným způsobem, jak jej může vidět někdo, kdo má zrak. (Nic nezdůrazňuje důležitost dostupnosti, jako když ji vidíte tímto způsobem.)
Může zkontrolovat a ukázat následující:
- Nízká ostrost s malým textem nebo cíli na kliknutí
- Problémy s nízkým kontrastem s prvky textu a pozadí
- Barvoslepost
- Vizuální sníh, oslnění, přízraky a šedý zákal
- Nystagmus, což je rychlý nedobrovolný pohyb očí
- Zablokovaná zorná pole
3. Kontrola kontrastu
Kontrola kontrastu vám umožňuje zadávat barvy pozadí a popředí na obrazovce a získat okamžitou kontrolu podle několika vizuálních standardů s okamžitým, barevně označeným průchodem / selháním.
K pěkným funkcím nástroje patří možnost přepínat mezi barvami a šedými barvami, sdílet vzorky vašich šeků a stahovat barvy z obrázků. Můžete také uložit vzorek PDF. Je to snadný nástroj se spoustou funkcí, které může kdokoli rychle použít.
Poskytuje také barevný poměr, jak je uvedeno v pokynech WCAG.
4. Tota11y
Tota11y je soubor JavaScript, který umístí malé tlačítko do dolního rohu dokumentů. Rozšiřuje se o panel nástrojů, který obsahuje více pluginů pro různé kontroly přístupnosti.
- Porušení nadpisů a pořadí nadpisů
- Kontrast (nebo jeho nedostatek)
- Odkaz text, který chybí nebo matoucí
- Štítky, které ze vstupů chybí
- Obrázky bez alt-textu
- Štítky jsou orientační body ARIA
- Čtečka obrazovky „hůlka“, takže můžete „číst“ web stejně jako čtečka obrazovky
5. WAVE
WAVE, nebo nástroj pro vyhodnocení přístupnosti webu, je robustní sbírka kontrol na jednom místě.
Nástroj používá vizuální překryv ikon, které se vztahují k informacím na postranním panelu, a poskytuje podrobnosti o všem, od barevného kontrastu po nadbytečné tituly až po odkazy na HTML a strukturální prvky.
Bezplatná kontrola vám poskytuje téměř cokoli, co potřebujete vědět o jedné stránce, ale WAVE také zahrnuje placené nástroje na podnikové úrovni pro majitele více stránek nebo uživatele, kteří chtějí více než jednu stránku najednou. Zahrnuje také rozšíření prohlížeče Chrome a Firefox, která mohou kontrolovat intranet, chráněné heslem, dynamicky generované nebo citlivé webové stránky v soukromém prostředí.
6. 508 Kontrola
Kontrola 508 testuje adresy URL, aby určila, zda web splňuje pokyny pro dodržování předpisů USA 508, což je ze zákona vyžadováno pro všechny organizace, které dostávají federální financování.
I když je tento nástroj zdarma, musíte se zaregistrovat, abyste mohli zobrazit úplné výsledky kontroly.
Stránka obsahuje také další nástroje a zdroje, včetně kvízu, který organizacím pomůže zjistit, zda se na ně vztahují požadavky na dodržování předpisů a specifické zdroje pro vysokoškolské vzdělávání, neziskové organizace a vládní orgány.
7. HTML_CodeSniffer
HTML_CodeSniffer je skript na straně klienta, který kontroluje zdrojový kód a hledá porušení definovaných standardů. Kontroluje jak Pokyny pro přístupnost webového obsahu 2.0, tak USA oddíl 508.
Vložte kód přímo na web pro kontrolu nebo použijte bookmarklet.
Snadno se používá a můžete si vybrat, jaký typ informací se má zobrazit - chyby, varování nebo upozornění a zobrazit zprávu podrobně popisující jakékoli obavy z kontroly.
8. Přístupný e-mail
Přístupný e-mail je online dáma a editor HTML, který vám pomůže vylepšit kód e-mailového zpravodaje před jeho odesláním. (Můžete také zkontrolovat minulé / odeslané kampaně.)
S tolika digitální komunikací a generováním potenciálů, které pocházejí z e-mailu, by to neměl být jeden z zapomenutých prvků webové stránky, pokud jde o přístupnost, ale často je. Stejná pravidla pro přístupnost na webu platí i pro odesílání e-mailů.
Tento nástroj je zdarma k použití a je navržen tak, aby podporoval dostupnost a použitelnost e-mailového marketingu.
9. Amara
Amara je nástroj pro vytváření titulků a skrytých titulků pro video.
Poskytnutí způsobu, jak se připojit bez zvuku nebo v jiném jazyce, může otevřít vaše prvky návrhu více lidem, zejména pokud je klíčovým prvkem designu video.
Tento nástroj zahrnuje bezplatné a podnikové možnosti, které usnadňují umisťování jazyka na obrazovku ve čitelném formátu, který funguje na webových stránkách a platformách pro streamování videa, jako je YouTube.
10. MobiReady
MobiReady poskytuje test mobilní přístupnosti ve vizuálním formátu a se zprávou o výsledcích, abyste viděli, kde by váš web mohl na těch nejmenších zařízeních zaostat.
Své stránky můžete porovnat s Alexa 1000, žebříčkem nejlepších webových stránek na světě; získejte podrobné technické výsledky s doporučeními a podívejte se na vykreslování svých webových stránek na různých obrazovkách, včetně zařízení vyšší, střední a nižší úrovně.
Jednou z nejlepších částí tohoto testu je, že je hodnocen v desítkách oblastí a existují návrhy na zlepšení s jakýmkoli „selháním“.
Závěr
Pokud jde o přístupnost webových stránek, je důležité zvážit použitelnost a čitelnost pro všechny typy uživatelů. Přemýšlejte o barvě, velikosti a umístění prvků, titulků a titulků, vhodném HTML a struktuře a dokonce e-mailu, abyste poskytli co nejlepší zážitek co největšímu počtu lidí.
Je také důležité zkontrolovat jakákoli regionální nebo národní pravidla shody, která by se mohla vztahovat na vaše projekty, jako jsou výše uvedené 508 standardy shody.
A v případě pochybností je lepší se mýlit na straně dostupnosti. Je to v pořádku vyladit barvu z palety nebo narovnat velikost písma, aby více lidí mohlo snadno pochopit, co je na obrazovce.
