Earlier this week, I wrote about how I’m building a UI library for people who love HTML. I also published a YouTube video about it.
I got a lot of excited responses and comments about it, but also a noteworthy handful asking something along the lines of this…
People should not be prioritizing no-JS users. No one turns off JavaScript.
Today, I wanted to talk about why that’s wrong, and why you should care about the no-JS experience.
Not necessarily, unfortunately. (Though I guess technically it’s easier to throw up barriers using JS, but it’s not an inherent quality, and leaving it out doesn’t automatically make it good.)
I’m curious what parts would be challenging to use with a screen reader? If a site just has basic links and no JS, I can’t really think of anything unless the tab layout is somehow completely shuffled due CSS.
A comprehensive answer is out of scope and probably best given by a true accessibility specialist, but for example, if you only use
<div>
tags for everything, a lot of the screen reader’s affordances for navigating are unusable. Images that carry information but not in their alt text are another simple example.And then there are parts where JS could actively help. For example, if you have a tabbed interface, but clicking a tab results in a full page refresh, the screen reader loses all context.
Also keep in mind that there’s more to assistive technology than just screen readers, e.g. sufficient colour contrast and keyboard navigability are important to many people. Too many websites still get those basics wrong.
Thanks for responding. I’m not really a web dev, so I haven’t thought about it much.
The tab layout and
<div>
examples were definitely not things I was thinking about. I guess that’s a good incentive to use tags like<section>
and <article>` instead of divs with CSS classes.I’m actually a bit color blind myself, so I appreciate sites being high contrast and not relying on color alone for indicators. A surprising number of sites completely break when trying to zoom in and make text bigger too, which is often due to bad floating layouts. Especially if it’s resized with JS…