Jens Oliver Meiert

Comparing Page Language Declaration Setups in Screen Readers

Post from September 28, 2021 (↻ October 18, 2021), filed under .

One best practice in web development is to declare the document language via the lang attribute, on the html start tag. That is useful, as it aims to ensure that user agents can present, including read, each document correctly. It’s also controversial, because using the Content-Language HTTP header is more efficient and because language detection software has become more and more effective—perhaps more effective than authors and editors are in marking up language.

To survey our situation with respect to language declaration, I set up a test page, in German so as not to be supported accidentally by all the screen readers developed in English-speaking countries. That test page knows five conditions: no language declared; language declared correctly through the lang attribute; language declared correctly through the Content-Language HTTP header; language declared correctly through both; and language declared incorrectly through both, with conflicting values.

This page I tested in four of the most popular screen readers; I ran the VoiceOver test on my own machine, and the NVDA, JAWS, and Narrator tests with Assistiv Labs. Big thanks to Assistiv Labs here, not only for their generally great product, but also their kind support after I struggled finding help with JAWS testing.

Here are the findings:

Test NVDA JAWS VoiceOver Narrator
No Language Declared English * English * English * English *
lang Attribute German ✅ German ✅ German ✅ German ✅
Content-Language HTTP Header German ✅ German ✅ German ✅ German ✅
lang and HTTP Header German ✅ German ✅ German ✅ German ✅
Conflicting lang and HTTP Header Values English *? Russian (following lang) Russian (following lang) Russian (following lang), English *

What does this mean?

First, I’m still cautious around the findings as I don’t regularly test with screen readers, and as all the software was recent. Maybe I missed something an experienced accessibility tester would know, and perhaps older tooling would produce different results.

But then, what do you think the results mean? An HTML minimalist, I’ve already been vocal sharing my take on the topic. Here I simply like to provide a few data points to validate. The topic of whether and how to declare page language is going to stay with us for longer, so we’ll probably see it covered again.

Many thanks to Thomas Steiner for reviewing this post.

* As all screen reader installations were in English, this is likely to mean that the fallback is the language of the screen reader, rather than that the fallback is always going to be English.

Tweet this? (If it changed your life, you delight me with a coffee.)

About Me

Jens Oliver Meiert, on April 29, 2020.

I’m Jens Oliver Meiert, and I’m an engineering manager and author. I’ve worked as a technical lead for Google, I’m close to the W3C and the WHATWG, and I write and review books for O’Reilly. Other than that, I love trying things, sometimes including philosophy, art, and adventure. Here on meiert.com I share some of my views and experiences.

If you have questions or suggestions about what I write, please leave a comment (if available) or a message.

Read More

Have a look at the most popular posts, possibly including:

Looking for a way to comment? Comments have been disabled, unfortunately.

Cover: The Web Development Glossary.

Perhaps my most comprehensive book: The Web Development Glossary (2020). With explanations and definitions for literally thousands of terms from Web Development and related fields, building on Wikipedia as well as the MDN Web Docs. Available at Apple Books, Kobo, Google Play Books, and Leanpub.

Stay up-to-date? Follow me by feed or on Twitter.

Found a mistake? Email me, jens@meiert.com.

You are here: HomeArchive2021 → Comparing Page Language Declaration Setups in Screen Readers

Last update: October 18, 2021

Professional frontend developers produce valid HTML and CSS.