Welcome Back!
In Part 1 we discussed having an Accessibility Statement on your website. In Part 2 we covered making sure that images on your website have an appropriate ALT attribute. Just those two actions alone can greatly reduce the overall risk exposure of a legal complaint by a serial plaintiff. Next, we are going to cover an often-overlooked item that will further reduce legal risk exposure and help increase the overall accessibility of your website.
Language Attribute
In most cases the Language Attribute, or the “lang” attribute, is added by default through the website authoring tool. Because the language attribute is not typically configured manually, it is easy to forget about it when creating a web page. As a result, we sometimes find that the language attribute is omitted or incorrectly defined. This is a bad thing for a few reasons:
- It is easily flagged as an issue by most automated accessibility scanning tools which increases legal risk exposure
- It can prevent assistive technologies (AT), such as a screen reader, from properly rendering the content of a web page.
While our primary goal is to create accessible content, we must also be concerned about the professional plaintiffs and attorneys who are making a career out of filing legal complaints and seeking “damages” from site owners that have accessibility issues on their websites. Making sure our web pages are not generating any failures with the freely available scanning tools can go a long way to help avoid being a target of these types of lawsuits.
The language attribute is also critical for many AT software as the software must know what language it is working with in order to properly render the content in way that is understandable to the user.
What is the “lang” attribute?
As you may know, HTML is a markup programming language. Meaning it encapsulates, or “marks up” data within the HTML tags. This information is then used to define and describe the type of data along with its purpose on the webpage. This markup includes various attributes that can be used to accomplish this task.
For the purposes of accessibility, AT software will look for the “lang” attribute within the HTML tag to determine the default human language of the web page.
A page with content in English would have an HTML tag something like the following simple code snippet:
<html lang="en">
A page with content in the French language would have an HTML tag something like the following simple code snippet:
<html lang="fr">
The “lang” attribute and its proper use for accessible content is further explained in the WCAG Understanding Success Criterion 3.1.1 Language of Page technical resource. This is a Level A requirement in WCAG.
Why it Matters
From the aspect of accessible content, using a proper “lang” attribute may seem like a small detail. In most cases this may be true as the impact on AT software users, such as a screen reader user, may never cause a noticeable issue. This is because the AT software will usually default to the language of the Operating System (OS) when rendering the web page. For example, if using an English language-based operating system and navigating to a web page with content written in English, the screen reader software should have no issues reading out the content in English.
The issue starts when there is a mismatch between the default language of the OS and the web page content. For example, if using an English OS with a screen reader and accessing a web page in another language that is missing the “lang” attribute or a misconfigured “lang” attribute, the screen reader output becomes difficult or even impossible to understand…even if you speak the target language!
The following video will demonstrate this further. The video shows the JAWS screen reader on an English OS accessing English content. Then it shows the same JAWS and OS configuration accessing the same English content but this time with the “lang” attribute set to the French language instead of English.
Here is one more video that shows the impact a missing “lang” attribute can have on users. This time we are using the same JAWS screen reader on the same English OS. We are accessing a web page with French language content but have removed the “lang” attribute entirely, which means JAWS will default to the language of the operating system.
While the audio output in these situations can at times be comical, you likely agree it would be difficult if not impossible to understand the screen reader output when the “lang” attribute is missing or incorrectly defined. If you are relying on a screen reader to access the website, the humor is quickly lost, and you have also increased your risk of a legal complaint because some screen reader users may be blocked from accessing the content.
Ensuring that your web pages include a proper “lang” attribute on the HTML tag is an important part of creating accessible content and lowering your legal risk exposure. While it may seem like a small thing, it can have a huge impact on some users!
Coming Up
Thanks for reading! In my next post I will continue to focus on other common and basic accessibility issues that can present a barrier to users and expose your site to those drive-by legal complaints.
Want to See More Content Like This?
Want the latest blog posts, videos, white papers, and announcements? Sign up for our mailing list and stay in the loop!
We're Here to Help When You're Ready
Take a deep breath. Then feel free to reach out to our team when you're ready to discuss your accessibility needs.
0 comments on “First Steps to an Accessible Website (Part 3)”