Why Web Developers Should Care More About Semantic HTML

Today I've been thinking about something I've thought about a lot: Semantic HTML. I know, kind of boring, but hear me out!

It has come up recently in conversations in digital spaces. Web developers are asking themselves, does HTML semantics really matter? I'd like to toss my reply in the ring: HTML semantics ABSOLUTELY matter. It is often the thing stopping users from being able to use your website.

I am so passionate about this because I have seen firsthand how users of assistive technology, which rely on reading HTML to give information to the user, are impacted. Imagine being unable to participate in daily living activities like using the web and its applications (where we spend a lot of our time and use for so many things) due to technical barriers.

Think about how frustrating it would be to pay your water/rent bill, or figure out what you're going to cook tonight because almost each recipe website is a jumble of words that takes 30 minutes to shift through.

For individuals with impairments who use devices like screen readers, your HTML is how they navigate your websites. If there are a bunch of divs with no markup that makes sense, they will not be able to understand what is on your page, what is important, or what should be clicked on.

Before I started my full-stack web development journey, I delivered occupational therapy services to patients using screen readers. They had difficulty on many sites due to the screen reader not being able to make sense of the context of information being spit out by the program (programs used included voiceover for mac, NVDA for windows, and JAWS). We assumed that it must be really complicated to code these websites and have them interact with the programs we were using.

Now that I've learned the basics of HTML, CSS, javascript, and a little backend, I have a new perspective. I realize a lot of developers just don't know how impactful the simple HTML code they write is. This makes sense, it is just not something we typically consider.

Able-bodied people typically interact with other able-bodied people. It is easy to forget the many neurotypical individuals and those living with low sight, low hearing, upper extremity weakness, mobility difficulties, and other silent disorders. They want to read/ hear memes, pay bills, and interact with loved ones on the internet just like us.

Accessibility and universal design do not seem to be taught as more than an afterthought in many school curriculums and coding boot camps. So it may be, at the end of the day, up to us to advocate for those who are unable to be in the room to advocate for themselves.

The best part is it will not completely derail what you're already doing or force you to learn anything too complicated. Accessibility just asks that you be mindful, considerate, and design for the good of ALL.

Remember, it's way easier to code with web accessibility in mind than it is to go back in and change a bunch of things so that everyone regardless of abilities can use your sites.

While this short article does not have a list of actionable steps you can take to make your websites more accessible (I'm working on this), I hope it gets you thinking about ways to be more inclusive.

Actually, I will leave you with one accessibility reminder that everyone knows but for some reason is often not added to basic pages: Please include alt text on your images. Every time. We appreciate your kind efforts!

Interested in learning more? A few days before this, I uploaded a video on different kinds of assistive technology and why it matters for developers, teachers, and healthcare workers.

Video: What is Assistive Technology?

Do you have any tips, questions or thoughts about accessibility to share or questions about assistive technology? Drop them in the comments and let's chat! #a11y #codenewbie #softwareengineer #100daysofcode