Many organizations, when confronted with the idea that their digital content is not accessible to individuals with disabilities, are confused as to how to resolve this concern. Web accessibility, while gaining traction in certain industries, is still largely a topic assigned to the “nice to have” column rather than a “must-have” in many companies’ digital plans.
But luckily for the millions of people with disabilities, there are a significant number of firms that choose to prioritize accessible content. The reasons they do this are varied. Fear of lawsuits and desire to mitigate risk are certainly factors, along with increasing the size of their target market and generating positive PR in the marketplace. But in order to even start to make their digital content accessible, organizations need to understand how accessible their digital content is. This is where accessibility testing comes in.
Accessibility testing for websites
You would be hard-pressed to find a business today without a web presence. Even mom-and-pop businesses owned by people with very little digital knowledge use Facebook as an alternative to creating their own websites. Given the omnipresence of a digital footprint, users with disabilities are at a severe disadvantage when it comes to accessing content that others take for granted. Accessibility testing is one way to see where your website stands and figure out the next steps towards making it more accessible.
But how do you conduct accessibility testing if you have virtually no idea where to start? Happily, there are some very basic tests that can be performed by anyone with even a modicum of digital knowledge.
Easy accessibility testing tip #1: is your HTML formatted correctly?
Some of the most basic accessibility best practices rely on well-formatted HTML. HTML is a simple programming language that forms the foundation of many websites. There are elements of HTML called “tags,” and, when used effectively, can help users of all kinds easily navigate a web page. One example of a tag is called the H1 tag. The H stands for “header,” and this tag should be the first piece of information on the web page and give the user an idea of what the page is about. An H2 tag is used for sub-headers. The H1 and H2 tags are usually easily distinguishable by sighted users as they are generally different from the body copy by virtue of size, font, or color.
This enables sighted users to achieve a variety of things. First, they can immediately determine what the page is about by reading just the header title and subheaders. Second, if they are looking for a particular piece of information that is called out in a sub-header, they can skip right to that content. Now, isn’t that a better experience than having to slog through a wall of text?
Users with low vision or who are blind will not be able to differentiate using visual cues. They use a tool called a screen reader that literally reads everything on a web page. If the content is correctly tagged with H1 and H2s, the screen reader user, much like one relying on visual cues, will be able to skim the header and subheaders to get an idea of the content of the page and skip right to content they find most valuable. Just like someone who can read the page without assistance, they find a wall of text to be onerous and overwhelming.
First in your arsenal of accessibility testing tricks should be to check that your HTML correctly includes H1, H2 tags, and even H3, H4, etc.
Easy accessibility testing tip #2: is your color contrast sufficient?
There are certain color pairs that are pleasing to the eye and others that are quite unappealing. That is obvious to anyone who has witnessed a colleague or acquaintance wearing a questionable color combination that elicits a subconscious internal grimace. What may not be obvious is that certain color combinations may render both colors indistinguishable from one another for many people due to disabilities like color blindness and low vision.
But fear not, you there’s an easy solution to avoid this common pitfall. TPGi has a free tool, the Colour Contrast Analyser, that will help you choose color combinations that will ensure that individuals with low vision and color blindness are able to read your digital content with ease. Not only that, but the color contrast check is an accessibility test that can be used on printed content as well
Easy accessibility testing tip #3: do your images have alternative text?
As mentioned earlier, blind people and those with low vision use screen readers to access digital content. But a screen reader will only read what information is provided; it cannot describe an image. The solution? Alternative text. Also known as “alt text,” alternative text is HTML code that describes what an image is portraying. While there are many opinions on how to write optimal alt text, a good rule of thumb is to be as succinct as possible while communicating what a person would understand if they could see it. For example, alt text of a picture of a dog holding a bone could be “dog holding a bone in its mouth.” You may be tempted to write something more descriptive like, “mid-sized german shepherd wearing rhinestone collar holding a femur bone in its mouth,” but unless details like this are critical to understanding the message of the content, it’s best to leave them out. This is an accessibility test that will help you understand the challenges screen readers face in understanding content that may be like a puzzle with missing pieces.
These tips are just the tip of the accessibility testing iceberg. There are many more web accessibility tests that you can do on your digital content to assess accessibility, but some require more skills and knowledge than others. Our experts are here to help you conduct in-depth accessibility tests on your website or mobile app. Contact us today to learn what accessibility tests will enable you to best serve your customers!