How using headings improves accessibility?

Every website creator knows how important it is to prepare a site where users enjoy spending time and, in many cases, return to it willingly. Of course, content is crucial, but the way it is presented also matters greatly.

Not every user navigates a website in the same way. Therefore, it’s essential to provide different ways of accessing various parts of the site. For example, assistive software for blind or motor-impaired individuals uses certain elements of a website to expedite navigation. Properly designed headings can play a role in this.
How to create a website template with a heading system that is friendly to assistive software? Here are some thoughts that may serve as useful guidelines.

Exposure of content and logic go hand in hand

Most assistive software organizes web page content from top to bottom and then follows the default writing direction. So, if our main content is not in the first logical column, it’s advisable to give it a higher level of headings. Let’s explain this with an example:

Imagine a webpage consisting of a banner and a main menu at the top. Narrow columns are on the sides, and a wider one contains the main content in the middle of the page. At the bottom, there’s typically a footer.

Suppose the main content is an interesting article on the company’s blog or a featured category of products for an online store customer. It would be logical for the title of that category or article to receive a first-level, top-level heading.

What’s my approach? The perspective of a blind person

When I read blog posts that interest me as a user of assistive software, my first instinct is to check if I can navigate to the content I’m interested in by using headings. In subsequent steps, I also explore other sections of the website. My priority is always to reach the content I’m interested in. And if I can’t do that within a few minutes, I simply give up. I go back to the search results and visit another website.

I approach browsing products in online stores the same way. If, after finding the product category, I can’t navigate using headings, I quickly leave the website of such a seller. Ordinary scrolling through content is impossible for a blind person, so why waste time?

You might ask at this point, “But why don’t you navigate products using links?” The answer is simple. Often, next to the product name, there is also a separate link with an image and a link to the subpage of the same product. Visually, it’s clear that they refer to the same item, but for blind individuals, the situation is not so obvious. Assistive software reads each of these links separately., so the content may be duplicated . The time needed to familiarize oneself with the available assortment significantly increases. Add to this lack of alt text for image files and the process is even more time-consuming. The screen-reader faithfully reads such a content and it gets annoying quickly.

Style and logic can be separate

If you design websites, you know that you can assign various styles to elements, providing plenty of room for creativity when designing websites with accessibility in mind. After all, no one prohibits you from using the same heading level in different places with different style classes.

For less significant content, let the logic of the page structure dictate how to navigate it, and let styles support this process to visually enhance the effect, not the other way around. This is particularly important if you want to reach 100 percent of your audience. Even though some of them may not be impressed by your visualizations, they can still visit your designed website because you care about them.

Not every customer abandons their online shopping cart because they found a better offer or a more user-friendly payment method. It is estimated that about 10 to 15 percent of consumers require some form of digital space accessibility to use it comfortably.

Simple attention to logic and structure may seem like a minor detail, but it can help you create a friendly place for your customers. I hope that these observations will help you build better websites, allowing you to reach an even broader audience who will eventually become your loyal customers. And it’s always worth taking care of them.