The internet has been called "the great equalizer". People all over the world have access to information that was once limited only to those who could afford it. Now you can get a college quality education online for free. There is still more that we as web developers can to make the internet world even more of a level playing field. It involves accessibility for the people with disabilities.
Accessibility
Web accessibility focuses on making the internet usable for everyone regardless of any disabilities they have. For example, some people are blind or have a really hard time seeing your website so they use screen readers or other devices. The effectiveness of some of these devices rely heavily upon he way a web page is laid out.
There are standards for web accessibility out there. The official one comes from the people at the W3C https://www.w3.org/WAI/standards-guidelines/wcag/. The standards aren't particularly complicated, it's just that a lot of developers don't know about them or they have inherited older projects.
How to make an accessible website
Making your web pages accessible is relatively easy to do. Most of it boils down to using the common best practices and paying attention to semantics. Since the HTML5 update, semantics have become more important in the role of accessibility. Elements such as main, section, and article are all interpreted differently on assistive devices.
These devices look for particular tags to identify the important content on the page , to decide where they should look for content, and how to present the content to the user. So if you are using multiple h1 tags on a page for formatting purposes, stop it. That's another element that assistive devices use to help figure out what the content of the page is about. It's also goes against the best practices.
Another really easy change to make is to add alternative text to all of your images and video and anything else that you need to physically see. If someone blind comes to your website and none of the images have alternative text, they miss out on some important information because a screen reader can't pronounce a picture. Add a few words that really describe the point of the picture or video so they can get a good idea of what the picture describes.
That leads to something else you can do for accessibility. Add captions or a transcript for any videos on your site. There are also hearing impaired people who would miss most of the value in a video if it doesn't have some kind of accompanying text.
Something else to consider is updating your website's navigation to use nav tags. This is helps disabled users find what they are looking for. Make sure your navigation makes sense by relating any subpages to the parent page. This helps users get some context for where they are on your website. It also helps assistive devices know where they should go once a user has finished a page.
A big thing you can do is build really good forms. Use labels, group inputs together if you need to. Make sure that people can tab through the inputs or that they can submit the form by pushing the enter key. The goal is to make it easier for people to be able to use regardless of what kind of device they are on.
Why you should bother with accessibility
A hard truth is that a lot of web developers work under tight time constraints and most companies don't factor in time for semantic work. Including web accessibility in your design is going to take a little extra time, but it's not hard to do. Instead of using divs everywhere (which I’m guilty of sometimes too), go ahead and use the real semantic elements. It's what they were made for.
It is harder to update an older website to follow all of the accessibility standards, but make the changes when and where you can. For new websites though, you can start with the standards in mind. You'll need to account for accessibility in your design so that when it's time to write the code you aren't really surprised.
You spending the extra couple of hours on making your website more accessible could be the difference between thousands of people being able to find information they need. It sounds trivial at first, but imagine if you were running a business and it attracted a lot of visually impaired users. If your website isn't accessible, you just lost a potentially huge pool of customers.
On top of everything else, making your website accessible could make the difference between a kid learning about engineering options for college or deciding they can't do it. Web accessibility isn't just something web developers need to do. Web accessibility is what we need to make sure that the internet really can be the leveling field that will make a lot of lives better or at least slightly more entertaining.
I used to think that web accessibility updates took a lot of time until I started looking at the standards for myself. The standards really just force us to be more disciplined when we create websites and that's a good thing. It reinforces all of the best practices and it helps us think about how people will use the website.
Do you have any particular stories about web accessibility and how it changed the way you code?
Hey! You should follow me on Twitter because reasons: https://twitter.com/FlippedCoding
Top comments (5)
Hi this is a great article far too many people see accessibility as an extra. We design for it from the start. Colour contrast checking the design from the start is another good tip, as is check how well the site works on zoom. Also test your site with a screen reader. Chrome comes with some handy plugins for testing the accessibility of a site too.
Love this article! I'm just starting in the coding world myself, so articles like yours are super helpful! I'm aiming to be an awesome frontend developer, so I'm open to all helpful suggestions and advice 😎
I am working for an agency and I'd only bother with accessibility testing if the client is paying for it. Usually they don't. It only ever happens for government projects and very specific products.
In over 10 years of web development experience I never had a simple complaint about the website not being accessible. I doubt the demand for it is as big as you'd expect from the numerous accessibility-related articles.
I'd argue that not every website has to be accessible and as frontend devs we shouldn't obsess with it.
Hey friend, I love to listen to music and nowadays I have been reading about the interesting stuff online. Actually, I listen to music when I do my work with the writing essays and today I found sciencetimes.com/articles/27774/20... website while doing some research about this. Thanks for this.
Thank you for this post! Web Accessibility does not get enough coverage in CS or Web Dev courses, but it makes a huge difference for a lot of users online.
Some comments may only be visible to logged-in visitors. Sign in to view all comments.