Web Accessibility as an Opportunity, Part 2: A Solid Technical Foundation
Web accessibility will become a legal requirement in the EU as of June 28, 2025. In Austria, it is regulated by the Barrierefreiheitsgesetz (BaFG)
Digital accessibility reduces maintenance costs and improves the search engine ranking of websites.
Digital accessibility promotes long-term maintainability and reduces maintenance costs. Additionally, accessibility for humans also improves the readability of your content for machines: digital accessibility enhances search engine optimization (SEO).
Accessibility According to the BaFG
For those who haven't read the previous posts in our series, we'll start with a brief definition: an online service is considered accessible according to the BaFG if it meets the AA criteria of the Web Content Accessibility Guidelines (WCAG) from Version 2.1 onwards. The WCAG defines a structured list of requirements, known as Success Criteria or "SC," for accessibility.
Semantic Data Structure as the Foundation of a Website
In the early days of the internet, websites were defined solely by their HyperText Markup Language (HTML). HTML declares the meaning of data on a website by wrapping it in "tags." For example, the tag <h1>Lorem Ipsum</h1> designates the words "Lorem Ipsum" as a first-order heading. Early websites, with their purist HTML structure, were easy to parse for machines and left the graphical presentation of information entirely to the browser. However, for most human readers, the first documents on the web were visually unappealing
Cascading Style Sheets (CSS) were introduced to improve the bland appearance of early websites, enabling the visual presentation of HTML ("styling"). Later, JavaScript entered the scene to dynamically modify HTML and CSS, allowing websites to respond flexibly to user actions. These three components form the core of the modern internet.
Following the original idea of the World Wide Web, the HTML of a website is responsible for the structure of data. HTML gives the elements on a page a machine-readable semantic meaning that is independent of their visual presentation. This semantic meaning is universal and standardized
Clean and standards-compliant HTML thus forms the foundation of a website or online service. All functionality ultimately builds upon this foundation. The quality of this foundation has significant impacts — not only on accessibility but also on many other technical and economic factors.
Impacts of a Poor Website Foundation on Accessibility
Improper HTML can undermine the foundation of a website in two ways:
- Through syntactic errors, where the HTML code itself is flawed (comparable to spelling or grammar errors in natural language).
- Through semantic errors, where the HTML code does not correctly structure and declare the content of a website.
While syntactic errors can sometimes lead to immediate rendering issues, semantic errors are often not immediately noticeable. For example, a semantic error occurs when a heading is not designated as such. Instead, an inexperienced developer might simply enlarge the text to visually promote it to a heading. Many visitors won't notice because we are trained to interpret large text as headings. However, neither browsers nor most search engines can recognize the supposed heading.
This is problematic with regards to accessibility because it severely limits the possible ways content can be presented. Many users rely on browser support to consume websites. For them, non-standard HTML that lacks semantic information poses a significant barrier.
A non-standard HTML foundation that lacks semantic information makes a website unusable for many users.
This group of users includes:
- People with visual impairments who use screen readers to have the website read aloud. If the site is only visually structured or not according to HTML standards, the information may be presented in the wrong order.
- People with motor impairments who use the keyboard to navigate the site. Without clean HTML declarations, this is, at best, very cumbersome and, at worst, impossible.
- Users who employ browser extensions to make the structure and content of a page more understandable or readable. These tools also do not work on poorly structured pages.
The WCAG as a Benchmark for a Standards-Compliant, Semantic Website Foundation
The importance of a semantic, standards-compliant data structure for accessibility is also reflected in the WCAG and its criteria. Many of these criteria can best (or exclusively) be met through a solid HTML foundation defined according to the HTML standard. Examples for such criteria include:
- SC 1.3.1 requires that the structure of content be understandable to as many people as possible (even if the presentation format changes), making it the essential criterion for a strong website foundation.
- SC 1.3.2 requires that the sequence of information on a website be understandable to as many people as possible, which necessitates well-structured HTML since the position of information in the code structure is crucial.
- SC 4.1.2 is met when elements on a page clearly communicate their state, which requires the conformant use of standardized HTML elements or custom components supporting standardized interfaces.
Besides these examples, where the connection between a clean HTML structure and accessibility is apparent, many other WCAG criteria benefit from it. In other words, the easiest path to accessibility is a strong foundation of semantic and standards-compliant HTML code. The WCAG thus promotes a stable foundation for websites.
Economic and Technological Advantages of Semantic Structure as the Basis for Websites
A website with a strong foundation of standards-compliant, semantic HTML structure also has economic and technological advantages beyond accessibility.
Search Engine Optimization
The easier information is to access, the greater its reach — this applies not only to humans, but also to machines. A semantic HTML foundation turns data into information that can be automatically processed more easily and correctly. This improves the quality of the site for search engines — and higher quality means better ranking.
Increased Compatibility
Adhering to the HTML standard improves a site's compatibility with the diverse range of devices and browsers on the market. This also increases its reach and potential audience.
Legibile Code
For developers, semantic and standards-compliant HTML code is easier to read. A twelve-level nested element without semantic differentiation is hard to decipher. Semantic HTML code saves time and nerves during development and makes the overall structure easier to maintain.
Longevity and Stability
The HTML standard is long-lasting. The current version 5 of the specification has been a "living standard" for over ten years
Tools and Resources
If we have convinced you that a strong foundation is important for websites and online services, we recommend two further resources:
- The World Wide Web Consortium (W3C) offers an online check to test the validity of HTML on websites. This allows you to quickly and easily get a first impression of the state of your site: https://validator.w3.org/
- For those technically interested in what makes HTML semantic, we recommend the following article: https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Accessibility/HTML.
Conclusion
The easiest way to make a website as accessible as possible is to build it on a strong foundation of standards-compliant, semantic structure through HTML. This not only reduces barriers for your audience but also increases the reach and longevity of your content. If you go through the trouble of creating content for the web, you should also honor it with appropriate packaging!
With this post, we conclude our series on "Web Accessibility." We hope to have given you a good overview of the topic and look forward to seeing you again for the next article. Until then!