DEV Community

Discussion on: 🤷‍♂️ W1y d2s a11y h2e to be so b4y c9d a1d i10e? 👿

Collapse
 
aminnairi profile image
Amin

So in the mean time I suppose what I am asking is: what would you like to see / do you need that would make it easier for you to learn/implement accessibility?

I think this is great that there is a Lighthouse plugin that can assess the accessibility level of our websites but I feel like this is not enough.

Either we need a tool that is cross-browser (a plugin that can integrate not only with Chrome but also Firefox and Edge and in term every browser) or something that is part of the standard and that can opt-in be enabled to check that our page is accessibility ready, with some tips and links to web pages that explain the why and how.

I am by no mean an accessibility expert, but I would not mind at all having some tool that tells me that I didn't put an alt on my img tags or something like that, like a linter but standardized so that it is easily discoverable.

Not sure if I'm being clear here but that is what I think accessibility tools should look like.

Collapse
 
grahamthedev profile image
GrahamTheDev • Edited

You see there are loads of plugins that catch about 40% of accessibility errors, but you have to know to look for them in the first place!

There is also the "accessibility" tab when you are in developer tools inspecting elements but that looks quite scary when you don't understand it (but yet again it is actually really easy to use).

Also you may not know but if you right-click and inspect some text in Chrome it will often show whether there is enough contrast if you click on the colour picker next to the colour of the text.

As you can see there are loads of tools to help....still the same problem though, you need to know about them and understand the basics!

Plugins

One plugin that I love is Accessibility Insights for Web from....(* drumroll * Microsoft of all people!)

It is, however, quite complicated at first but it covers things like a test for "logical Focus Order".

Another one that is good is the deque Axe plugin, not quite as in depth but easier to use. This is what Lighthouse uses to assess the accessibility of the site (but they do leave a couple of tests out) but the way you can inspect elements, highlight them etc. is much easier in the Axe plugin. The down side is that when there is an error the explanations of what is wrong can be complex and often point you to WCAG - which is where most people give up!

The main problem with plugins

The main problem though is what I said in the first sentence.

Plugins only catch about 40% of errors. This is why the resource / education part is the bit I think needs work as accessibility is a subject that is "shallow but wide", nothing is complicated in of itself but the amount you need to know is too much for most people.

What do I suggest for beginners and professionals alike?

If you really want the best and easiest way to test accessibility and learn quickly why it is important - learn to use a screen reader. (NVDA is free for PC users or on Mac you have VoiceOver built in!)

It might take you an hour to learn the controls (much less for the basics!) but then you can just fire a page up and use it, that is the real "eye opener" for a lot of people and is still the way I recommend testing.

Collapse
 
aminnairi profile image
Amin

Thank you for your answer. That look scary indeed! A screen reader might be my best bet.

Do you happen to know any good one on Linux for instance?

Thread Thread
 
grahamthedev profile image
GrahamTheDev

Actually I don’t I am afraid.

I know Orca used to be the go to Linux one but nowadays I am not sure if there are better options.