The people who spend time on your website take in and understand information in a wide variety of ways.
The goal of web accessibility is to ensure that all websites, web apps, and online services deliver the best user experience for everyone, including people with permanent and situational disabilities, and are optimized for any tools and adaptive technologies people may use to understand content.
In this article:
- Why should a website be accessible?
- What makes a website accessible?
- What makes a website inaccessible?
- Who is responsible for website accessibility?
- When to start making your website accessible
- How to think creatively as a team about accessibility
- How to advocate for accessibility
- How much is this going to cost me?
- Five ways to optimize for website accessibility today
- Intro to a series on website accessibility
Why should a website be accessible?
Typically, a website is built with the idea that people will visit it, understand its purpose, read the content, and take some sort of action. It doesn’t make sense to build a website that only some people can find or one that is so painful to use that it infuriates a large percentage of the people trying to navigate it. Similar to how you wouldn’t build a brick-and-mortar store, turn on your “Come on in, we’re open!” sign, and then lock the front doors.
We are making accessibility a priority by making it an essential part of our website, design, content development, and SEO processes. People need to get information in different ways and we believe that everyone should have equitable access to that information. Everyone’s experience matters. It also makes ‘good business sense’ to make your website an easy place for people to do what you want them to do so you can make more money. Plus, it’s either already a legal issue or will be soon.
What makes a website accessible?
There are a lot of elements, from code to content, that all work together to make a website accessible. When everyone and everything works together, you will get a website with a purpose that is easy to understand, simple to navigate, and easy to perform actions on. For everyone!
Website accessibility is a huge topic. Describing all of the elements that go into optimizing for accessibility would require one very long blog post, so this post is an introduction to a series of posts we are working on as we learn more and more about accessibility. Everyone involved in developing a website, including designers, web developers, SEO specialists, and marketing folks, can contribute to optimizing for accessibility. Here’s a quick list of what a designer has to consider when designing for accessibility: colour contrast, font size, styles for interactive elements, grouping related content, different viewport sizes, and much more!
Another quick example of one element that contributes to website accessibility is the jump or anchor links at the top of this blog post. These are handy for a person to see what content is on the page right away, without having to scan and scroll. Jump links also help someone who uses a screen reader quickly navigate to the information they are looking for. Without jump links or anchor links, the visitor has to listen to the entire page being read out, or manually tab through the headings from the top to the bottom of the page to see if it contains the information they are looking for. Which sounds like a tedious exercise, and wouldn’t inspire warm feelings towards a website, particularly a content-heavy one.
For context, here’s a video of someone using a screen reader:
What makes a website inaccessible?
A website is inaccessible when it is designed and built without the experience of the user in mind. Or, maybe a website is built with the experience of a user in mind, but not all users.
Sometimes it can be hard to think outside of your own experience. For instance, if you watch a video without closed captioning, and you don’t need closed captioning, then you might not notice the absence. But for someone who depends on closed captioning to understand the content of a video, the absence would noticeably detract from the experience. Another important thing to note is that accessibility can be situational. Just because you don’t use captions on a video one day doesn’t mean that you might not need to use them another day, like if you had a baby or a grumpy cat napping on your chest.
If you’re looking for some more examples of inaccessibility, check out this article: 5 Most Annoying Website Features I Face as a Blind Person Every Single Day.
When accessibility is an afterthought, it can cause usability issues. Instead, we should think about accessibility as an essential part of website development and maintenance, until it’s a natural part of the process, like choosing a font.
Who is responsible for website accessibility?
Only you can prevent bad user experiences! As mentioned earlier in this post, accessibility can be optimized in every element of a website, from code to content. The best web designs happen when everyone who touches or thinks about a website is in the loop with accessibility.
Here is a list of people who can contribute to web accessibility:
- Web developer
- SEO specialist
- Website owner
- Business owner
You get the idea! If everyone is familiar with accessibility concerns within their area of expertise, then when everyone comes together to work on a website it means accessibility is baked into every plan and process.
For us right now, if we want to make the colours on a site as accessible as possible, we can call upon Sarah’s expertise (she absolutely loves when one of us sends her a brand colour palette that features pumpkin orange or lime green)! And we can flag Leanne if we have questions about accessible code. Liz approaches website work (and life) through an SEO lens, and as it turns out, web accessibility can have a positive impact on SEO because search engines benefit from the effort that goes into setting up websites to be read by screen readers as well.
When to start making your website accessible
If you have a website, are building a website, or you work on other people’s websites, now is the time to start learning about accessibility and how to implement it.
If you are about to build a website, start talking about accessibility from the very beginning. All of the different people involved in a website build can contribute to accessibility in their respective areas of expertise. Once you start including accessibility in your project planning, it will become an automatic part of your process.
If you already have a website and aren’t at the beginning of a new build, have no fear. While it’s probably easier to optimize for accessibility before your website is built, it’s also not something that is ever complete. You can’t set it and forget it — our understanding of accessibility is always growing and changing. What we thought was an accessible page a few months ago might not be anymore. As long as you are always learning, and paying attention, there will be room to optimize your website.
Here are some great tools and resources that will help you get started with actionable items:
- Checklist to test your Web Content Accessibility Guidelines (WCAG) compliance
- A free introduction to web accessibility course
- The ultimate guide to writing alt text
- A guide to designing accessible focus indicators
- How to design accessible forms
- An introduction to accessibility for developers
How to advocate for accessibility
It can be difficult to advocate for accessibility to someone who hasn’t encountered issues with inaccessibility firsthand before. You may be in a position where you are dealing with a culture, board, or management that doesn’t understand the value of accessibility. Maybe they think it’s extra work that only benefits a few people, and therefore isn’t a priority for their organization. Or maybe they think that because it’s not legislated, they don’t have to worry about it.
Website accessibility benefits everyone
Optimizing your website for accessibility doesn’t have to (and shouldn’t) be something that you only do when forced by legislation. Nor is it really an altruistic act, because website accessibility benefits everyone.
If we really boil down what accessibility is, it’s making a website as user-friendly and easy to use as possible. For example, maybe you don’t have an issue reading smaller font sizes. Making the font bigger so everyone has an easier time reading it won’t make it harder for you to read. It will probably make it easier and more accessible.
This is a good time to reiterate that accessibility can be temporary or situational. For someone recovering from cataract surgery, accessible colours on a website will be easier to read. Or maybe you are a) in a loud place and can’t hear a video on your phone, or b) in a quiet place and can’t have the sound on. Closed captions are handy for everyone in those situations.
We are not talking about just a small group of people who will benefit from accommodations that make browsing the web comfortable and easy. There are 6 million Canadians with permanent disabilities who deserve to be able to navigate a website with ease. Considering temporary and situational disabilities, and the fact that any optimizing you do only makes a website easier for everyone to use, there are no drawbacks to making accessibility a top priority for any business.
Accessibility promotes positive brand reputation
Optimizing for accessibility on your website, apps, and social media, means more people will have a positive interaction with your brand. If a large portion of visitors to your website can’t use it effectively, then the result is a lot of people who are annoyed and alienated. Why would you want the perception of your business to be anything but positive?
It’s important for brand reputation to consider all online services that your business engages with. If you make sure that you are following accessibility best practices on Twitter, like using image descriptions for pictures that you tweet, that can create positivity towards your brand. But if someone clicks on your website link from Twitter, and your images aren’t using alt text there, then any trust you’ve built can be lost. Accessibility should not be performative — it has to actually improve a user’s experience.
This is another reason why it helps if everyone in your organization is familiar with accessibility best practices, since you will likely have many different people involved with different areas of your online presence.
When you’re advocating for accessibility, explaining how overall brand perception can be affected by inaccessibility is a good way to show the value of accessibility and why it should be a priority.
How much is this going to cost me?
A frequent hurdle people encounter when advocating for accessibility (or anything really) at their organization is budget.
There will be costs associated with optimizing your website. If you’re at the beginning of a website build, then ensuring the final product is up to accessibility standards shouldn’t affect your budget in a big way. You are already choosing colours, fonts, writing content, developing code, etc. Just ensure when you are making those decisions that you are considering accessibility. There are a variety of tools and information available that can guide you with choosing the right colour contrast, font size, how to use accessible language, and how to write accessible code.
If you have a website and you need to improve its accessibility, then there will be expenses depending on what areas need optimizing and any outsourcing you need to do, like working with web developers and designers. Whether you are building or fixing up your website, you may want to invest in web accessibility software like Monsido, which is what we use.
It’s important to note despite some up-front costs, making your website accessible is an investment in your business. When you improve accessibility, you improve the user experience for everyone. A good user experience means happy website visitors. Happy web visitors have warm, satisfied thoughts about your organization. If you are looking for some more concrete facts, this article lays out the math about the ROI of web accessibility.
It could end up costing you a lot more if you don’t make your website accessible. While there isn’t currently web accessibility legislation in Alberta (where most of our team is located), it is becoming increasingly common. In Ontario, the Accessibility for Ontarians with Disabilities Act (AODA) requires that organizations ensure their web content is accessible or you can face a $100,000 fine.
It’s not unlikely that a similar regulation could come to your state or province (or country!), if something doesn’t exist already. And when that happens, you don’t want to be left scrambling trying to fix your website. Especially because making your website accessible isn’t a one-and-done task. There is nothing to stop someone, or multiple people, from suing your business for failing to comply with accessibility standards. Even if you’re in the middle of trying to make it accessible.
How to think creatively about accessibility
What does it look like when accessibility is part of your processes, and not something that is added later?
We knew that we wanted our website (and the websites we work on) to have a great user experience for everyone. While we have optimized our current website to meet accessibility standards, we are also working on a brand new web design, and accessibility is a key part of our website plan!
Let’s take a look at the website headings we developed for a clients’ websites to see one way in which we planned for accessibility. The question: How can our headings be accessible, be optimized for SEO, but also have room for our brand voice and compelling marketing messaging? This is where everyone having accessibility knowledge and communicating about it from the beginning pays off.
After a meeting with designers, developers, and writers (who love SEO), we landed here: what if the H1 on a website wasn’t the BIGGEST heading? It would still contain the clear information that tells visitors, screen readers, and Google exactly what the page is about. It would still be the most important of the headings. It just wouldn’t look like the most important message.
See the H1? It has clear information about what is on the web page. And then the larger bold text below is not a heading, it is a branded message. You don’t actually need the second, larger heading to understand what is on the page. The H1 satisfies our SEOs and is useful for screen readers to quickly understand the content of the page.
It can be easy to get used to things a certain way, and many of us are conditioned to thinking of H1s as the biggest, baddest text in town. It’s the main heading! It should look like the main heading. But it doesn’t have to.
Accessibility doesn’t need to be complicated or expensive. You can see that a whole team of designers, developers, SEOs, and brand strategists who are empowered to think about accessibility together will come up with solutions that make sense for accessibility and marketing harmoniously.
Five ways to optimize for website accessibility today
There are many great tools and resources out there to get started on your accessibility journey, some of which we shared earlier in this post. However, if you are eager to get started and looking for some quick wins you can implement today, check out this post on our Instagram for five changes you can make right now to help your site be more accessible.
Intro to a series on website accessibility
We are all learning so much about accessibility and we plan to share our knowledge along the way. Stay tuned for more posts on a variety of accessibility topics including:
- How to write accessible code
- How to design an accessible brand kit
- How to make accessible designs that look good
- How accessibility and SEO work together
- Ten quick fixes to optimize your website for accessibility today
- How to build accessible forms
- Why you should use alt text on all non-text elements
- How to optimize your social accounts for accessibility
If you’re planning a new website project or curious about how your current site holds up to accessibility standards, please get in touch!