DEV Community


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

jmau111 profile image
Julien Maury

In my case a11y helped me improve my skills. I'm a rich stack developer, but I originally come from the system/backend part. I had good knowledge of HTML, CSS and JS, but I needed to go far further.

Both the code and the look and feel are better now with accessibility (a11y) in mind. That's my point when I talk about a11y. You can do better apps for everyone, not just some polish for people with impairements.

However, while I agree with you that it's not so complicated, it is not that easy. I've seen and tested many "a11y enhancements" that are sadly worse for a11y.

Even the w3c validator makes suggestions that are sometimes not the right thing to do, so it's not just basic knowledge, and you need to keep it simple.

The biggest mistake could be to think a11y after making the app or in the very end of the process. That's is why people always say it's expensive.

inhuofficial profile image
InHuOfficial Author • Edited

I agree with every single word of this. 💪

When I said it was easy what I meant was once you understand each element and attribute and why it is relevant you can put stuff together in a few key strokes.

I admit I think I did underplay the "knowledge" part - but that is I suppose my point. When starting out you don't need more than the basic knowledge of those 5 points, what you really need is a resource that goes "trying to make a custom select, here are 3 skeletons you can copy paste and here is what you can and can't do with them". I mean, I know it would still result in some mistakes but I think it solves the "overwhelm" that puts so many developers off.

Some of the comments here have made me realise that perhaps we are heading in the wrong direction because there are now more and more frameworks. I could give you a React example of how to do something but if you are new you aren't going to understand how to implement that in Vue or Angular.

The final nugget of wisdom you said there was "keep it simple" - the amount of times people start using ARIA to add role="navigation" to a <div> instead of just <nav> it any wonder people "switch off" to accessibility! Not sure if over use of WAI-ARIA is HTML 4 legacy or just that there is so much erroneous information out there!

riobrewster profile image

There is that much erroneous information in the WCAG/WAI documentation. I found a thread on github where they have been arguing about whether a navigation menu is a real menu since 2017!
They all pretty much agree that navigation is not a menu - BUT THEN SHOW ME THE CODE that JAWS will read AND works with the keyboard AND creates an intuitive menu for sighted users on different devices.

Are any of these people developers with actual work to do and actual projects with actual deadlines?

I mean I want to make my (internal) site inclusive - but make it easy so I can actually do it.

jmau111 profile image
Julien Maury • Edited

if you are new you aren't going to understand how to implement that in Vue or Angular

For that, I consider it's part of the job. The developer must have learning skills, and that includes not reading tutorials and blog posts at face value.

The IT Business is often all about getting the job done, so you see copy/paste and stuff. We need better education and information, for sure, but as a developer, you have to teach yourself, and that is not so simple.

The good news is that it's a good investment.

Some of the comments here have made me realise that perhaps we are heading in the wrong direction because there are now more and more frameworks

It's a critical point. I see many people learning frameworks before the language itself. Big mistake. That's why you have online projects with way too much dependencies that loads kilobytes of code for almost nothing.

It's unlikely they care about a11y, not because they are bad persons, but because the priority is to get the job done by delivering the fuc*in feature.

Thread Thread
inhuofficial profile image
InHuOfficial Author

Don't get me started on the kb of dependencies for simple projects thing, I will have to get my soap box out and start preaching if we go down that route 🤣🤣🤣

Learning the fundamentals is indeed essential. But if everyone did that we wouldn't have thousands of frameworks to choose from!

But hey, what do I know, I am one of the tailwind "haters" so maybe I am just old and out-dated!

Yet again the big issue summed up in one nice sentence:

" We need better education and information, for sure, but as a developer, you have to teach yourself, and that is not so simple."

It is so difficult to teach yourself about accessibility due to the amount of rubbish information.

I mean there was a post a couple of weeks ago singing the virtues of "Fully accessible Menu components"....I found 5 issues in 2 minutes so how can anyone know who to believe?

Preword: this comment is not a reflection on your article, it is really well written and thought out, this is just a warning on believing things are accessible when they may not be!

"Fully Accessible"....the accessibility of this is questionable at best.

Why aren't they using an <ul> and <li> for the list of buttons so that screen readers that don't support role="menu" still get a count of options?

Why are they using role="none" on a div, when it has no role in the first place.

Why do they stop you tabbing out of the menu when it is open, that is not expected behaviour?

You should be able to cycle through all items that start with a letter (so if you press d it should go to "duplicate", pressing d again should go to "delete"), which it does not do, it stops at the first item (which can be very confusing).

Similarly if you are on the first menu item pressing up arrow should go to the last menu item. If the focus is on the last menu item pressing down arrow should move to the first menu item.

Anyway - there are probably other issues, by the time I found all of the above I had seen enough!

Oh and WAI-ARIA is your last resort, support is not as great as you may think, even for basic WAI-ARIA attributes, which is why semantics such as <ul> are so important!

Then the "good" information is unreadable and difficult to understand and....we are back to my rant! 🤣🤣

Thread Thread
jmau111 profile image
Julien Maury

You certainly have a point, I call it "the noise", and with blog posts and tutorials, we're part of it, somehow.

However, it's not all about the technical "truth". You can inspire and help people even if you're not accurate enough.

Besides, as long as there are people to post meaningful comments, rubbish information will go where it belongs, in the trash. I don't want people to be afraid of publishing, even if they need to level up.

In your example, how did the author react? Did he update his post? If that so, then no problem.

Thread Thread
inhuofficial profile image
InHuOfficial Author

Sorry I always forget the comment doesn't link to the article (which is really strange!)

No they didn't respond, but it wasn't there fault as someone pointed out, they were just reciting what the devs who built it said. But that is what I mean, people build echo chambers very easily that spread incorrect information and it just escalates.

Oh I agree, I don't want to put people off posting, the more people talking about accessibility the better!

The problem is I often get comments deleted when I try to help (perhaps it is just my writing style is quite "direct" so comes off as attacking and harsh 😋).

Plus there are loads of sites where I can't comment so how can I and others "warn" people that the information is incorrect.

Thread Thread
jmau111 profile image
Julien Maury

Yee comments can be tough sometimes, but most people do that in good faith. That does not mean you have to accept everything but you can learn a lot with a meaningful comment.

Perhaps you can use their contact form if you don't find any comment form ^^

Thread Thread
inhuofficial profile image
InHuOfficial Author

True contact form could be the way to go!

As for the comments I am actually thinking I might suggest a tag "#comeAtMeBro" which lets people know you are open to criticism in the comments 🤣 (I am kind of serious but a different tag might see a side post on that later now I think about it!!!)

Forem Open with the Forem app