![Cover image for Headless-UI "Fully Accessible" - it's not your fault you believe the 💩 BS 💩 [accessibility rants]](https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1gml0ogqkipjlzgrk40w.jpg)
In case you haven't read one of these posts before, the anger is just for fun, the message is really important, I am not actually angry! 😁
On a si...
For further actions, you may consider blocking this person and/or reporting abuse
You are a brave one linking to projects after I just ranted about someone else's 😉🤣 (your nav examples should be in an
<nav><ul><li><a>pattern, your headers should not go<h2><h1>, instead you should wrap two spans in a<h1>and style the spans to achieve the small text big text effect, your alerts need aria etc. Sorry I couldn't resist 😋)Always great to have more people getting interested in accessibility, keep going, it just takes time to learn, just follow the golden rule - if an HTML element exists that serves your needs then start with that! Follow that one thing and you will be 90% of the way there!
And if you get stuck on something after you learn about something new you need to adjust, just shout, more than happy to help! Good luck with the project(s)!
Yeah sorry to the 55 people who saw this yesterday before it was ready, that damned publish button is too easy to press! 🤦♂️
Anyway, I hope you enjoy this latest instalment in my angry rants, be sure to give it some ❤🦄 and leave a comment as I am a narcissist and it helps feed my problem! 😋🤣
Being serious for a second, if you have any questions on any of the points raised (as a rant doesn't always cover things in a very understandable way) let me know, I am happy to help.
Speaking of "angry rants", would be fun if you made a video channel with that "angry" persona. Think Gordon Ramsey / Hells Kitchen but for web a11y.
Sadly I can’t pull it off, I am not intimidating enough!
It is the beauty of the written word, you can imagine me as some buff bearded dude who would make great angry rant content....instead of a chubby middle aged guy! 😜🤣
With that being said if I can find the right person...nah you profile pic tells me you are too nice also! 😜🤣
Just write the scripts and call David Mitchell to delivery 😉
Oh yes, David Mitchell's sarcastic angry humour would be absolutely perfect, he rants so naturally!
Life goal updated now, get David Mitchell to voice my angry rants!
OK so here's my accessibility rant.
I work for a government agency so I have been in the trenches on this for awhile. I'm also a UI/UX designer. I also work closely with a non-dev designer. I have been an advocate for accessibility.
I totally agree that if you use html semantics, add alt tags, validate your code and watch for contrast issues.
But lately I have been increasingly frustrated with the "requirements" for accessibility. Previously there was an understanding that there was the letter of the law and the spirit of the law. Often there are gray areas.
But now the definition of disability has been expanded to include cognitive disabilities and the standard has become that ALL users have to experience every feature the same way. Plus everyone needs to use the site on any device.
I would argue that these definitions are so broad and so vague that it is becoming impossible to provide an optimal experience for anybody! In the mean time, the code base has grown bloated and hard to manage because of all the aria junk we're told is necessary.
Why do all users need to be able to experience every aspect of the UI the same way?
I have a site where, on mobile, the navigation is basically a table of contents using links and lists. Simple. Semantic. Even works without javascript. On desktop, we provide a typical dropdown menu.
This passed accessibility muster two years ago and there is now a robust website built on that codebase.
But a year later, the mobile version isn't enough for people using a screen reader. Even though every page can still be accessed by everyone, the screen reader user apparently needs to know when the menu is open or closed.
If the semantics are done properly that's irrelevant. The user can still decide whether or not they want to enter the nested list of options. They can still get to every page on the site.
But OK - accessibility is important. So down the rabbit hole of WCAG and Aria we go. I totally agree that aria should not be used to override semantics.
So why does WAI tell me that a list item has role=none?
It has to do with whether or not navigation menus are really menus. I. DON'T. CARE. Just tell what will work.
I could go on but I have a meeting where we will discuss the difference between WCAG requirements and coding best practices. Should be fun.
fanito? I think you mean finito (italian)... can't imagine you meant the portuguese "little temple" word.
Loving the series, accessibility is still one of my weak points and a big goal in my studies, but this is opening my eyes, the minimum I thought I was doing is waaaay less than acceptable for me now. Thanks for the rants.
I have corrected that, thank you so much for pointing out my terrible language skills! ❤
Glad you are enjoying the series and rants! Bullying people into thinking about accessibility seems to be my thing! 🤣
hehe, best sponsor ever...down side was I scratched my ear while using it and now I have one giant ear!
The fiddle that didn't work in the article:
I’m guessing so but it is such a long post I can’t see it! ❤️
Thanks a lot, glad you enjoyed it! ❤️
I think so, I don’t speak tailwind but it looks right based on the 2xl text property. Something like that inside a h1 would work!
Just want to drop this:
I laughed my ass off reading, really like your 'angry-head' + Interesting read.
Glad you liked the angry rants! 🤣
Put a live sample up when it is done, happy to look at that for you!