DEV Community

Cover image for 5 things to know about developing accessible websites

5 things to know about developing accessible websites

Emma Train
Full stack software engineer in-training enrolled in coding bootcamp
Updated on ・3 min read

The web is empowering but some people are unable to access huge chunks of it in the same way as others, or even at all.

Creating accessible applications is vitally important, but is often low down the list of priorities. However, the law is starting to catch up with the worst offenders - with big brands Beyoncé and Domino's recently sued for a lack of accessibility on their websites.

A few weeks ago I attended a lecture by Aimée Wyld from Mayden as part of the coding bootcamp I am doing with IO Academy. Aimée inspired me to think about accessibility in a way I hadn't before, speaking passionately about the power improved accessibility can have.

I summed up her key points below.

Blind person using a screen reader

1) Lots of disabilities are ignored

We often think of screen readers when we think about accessibility - it's long been best practice to add alt tags to images so that they can be described accurately but accessibility on the web goes much wider than that. As well as visual, auditory or physical impairment we shouldn't forget about cognitive or neurological disabilities. Similarly, those with mental health issues or learning difficulties such as dyslexia will have other needs - for example, they may need the content itself to be written in a certain way and displayed in a clear, concise format.

2) You never know when you might need the web to be accessible

Broken arm. Lost your voice. Laser eye surgery. Driving and can't use your hands. You never know when you may need to benefit from a website or application's accessibility features yourself.

Accessible code is also well-written, well-structured code. As a developer, any one else working on your code in the future will also thank you.

3) Accessible code is semantic code

HTML5 introduced increased options for structuring your page. Using the semantic elements <main>, <article>, <header>, <nav>, <footer>, <aside> and <section> to divide your content (instead of <div> and <span>) means that assistive technology such as screen readers can use this extra information to better do its job. For example, listing all the headings on a page in advance, or telling a user how many items are about to appear in a table or list.

4) Testing accessibility is not easy

Sure, you can put your code through an automated service that checks that some accessibility guidelines are met. However, many parts of having a fully accessible website are not easily verified with a 'yes/no' answer. Although it is a good place to start, a website could pass one of these tests and still have significant barriers to accessibility. Get to know the Web Content Accessibility Guidelines (WCAG), and make sure you're ticking off as many as you can.

5) Improved accessibility has a load of beneficial side effects

As well as rewarding those who really need it, if your website is built with accessibility in mind there are a whole host of other benefits. It will load faster, will be ranked higher by Google, is more compatible across a greater number of browsers and some evidence has shown it can even increase conversion rates. What's not to like?

Discussion (2)

lelepg profile image
Leticia Pegoraro Garcez

You have brougth some really intetesting topics. I'm not actually a developer, but lately i've been thinking a lot about accessibility and how it would be for me to use the internet and other devices if I had any disabilities. And congratulations on an article well written.

emma_train profile image
Emma Train Author

Thanks for the comment and kind words Leticia, it's definitely something worth thinking about because the internet touches so many parts of our lives.