Posted on

Document language missing – example

Summary: Real world example on the Document language missing Error.

You can review what this means technically and the impact inside of our Icon dictionary. Today I am only looking at this from the perspective of a common Document language missing found on a higher ed website from our Higher Ed in 4k project.

Example

In this example found on a University bookstore there is no document language defined in the html. WAVE adds the error at the top of the website in the section that applies to the entire page.

The opening <html> before we make any changes:

<html xmlns="http://www.w3.org/1999/xhtml">

WAVE has flagged this an accessibility error of Document language missing because the their is no defined language for the the web page. When a screen reader reads a page how it reads it changes significantly depending on the language. If it read this blog post in German for example it would read it as is with German pronunciation and would be impossible to understand. Identifying the language can also help with the automatic translation.

This can be easily missed but is a very easy fix.

Solution

If our page is in English as this University website is the proper attribute value would be lang=”en”.

html:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

With this change this is no longer flagged by WAVE or Pope Tech as an error and the page will be read in the proper language.

You can add the lang attribute to other elements as well but you must add it to the <html>. For some examples on this you can review the NC State article on defining the language of a document.