20% Off My Easy-Peasy Proposal with the Coupon Code 20OFF (Now - April 30th)

Accessibility Weekly

Indicating Language Changes



Amber Hinds

Equalize Digital

Amber Hinds is the CEO of Equalize Digital, Inc., a Certified B Corp specializing in WordPress accessibility, maker of the Accessibility Checker plugin, and lead organizer of the WordPress Accessibility Meetup and WP Accessibility Day conference.

Week 21

When building websites, it is crucial to declare the language used on the page or for any parts of pages when the language changes throughout the content. This declaration, using a lang attribute, helps to ensure accessibility for blind and visually impaired users and can help to ensure the fonts on the website are correctly formatted for sighted users.

How Language Attributes Support Accessibility

Lang Attributes Help People With Disabilities

Screen readers heavily rely on language attributes to accurately read the content of a page. Without these attributes, screen readers may struggle to determine the language of the page or post, resulting in missed sections of text or incorrect pronunciation to the listener.

For people utilizing braille keyboards and refreshable braille displays (typically people who are Deaf-blind), language attributes enable substituting control codes for accented characters, ensuring that words, phrases, and text sections are correctly translated into Braille.

Speech synthesizers that support multiple languages also require language attributes to orient themselves and utilize correct pronunciations and syntax. Without proper language attribution, a speech synthesizer may mispronounce the text, leading to difficulties in understanding for the user.

Lang Attributes Help Language Learners

Language attributes not only benefit individuals with disabilities but also assist those who speak different languages or who are translating your website. Some translation tools required the language to be declared in order to be able to accurately translate the page. 

Adding a language attribute will help to ensure that special characters are formatted appropriately for the language, which makes them easier for sighted people to read.

Here is an example of a post title written in Korean that is missing the language attribute:

Korean characters that are very boxy and have evenly stroked lines with minimal spacing between them.

Compare that to this image of the same title with the lang attribute defined:

Korean characters that appear to be painted with a brush and are more widely spaced.

Adding the lang attribute tells the browser that these are Korean characters and allows it to display the characters with proper font styling: showing brushstrokes, varied weight on the characters, and wider spacing. This makes the Korean characters easier to read for someone who is a native Korean speaker or someone who is just learning Korean.

Bonus: Lang Attributes Help SEO

Search engines utilize language attributes to understand the content on the page. Proper use of lang attributes can help improve search ranking, especially for searches in that language, and may bring more speakers of that language to the page. 

How to Declare the Language in HTML

In HTML, you can declare the language of a page by using the “lang” attribute. There are two places that you might need to declare language: on the entire page itself and for any sections of text where the language changes within the page.

Setting a Lang Attribute for the Entire Page

To declare the language of the entire page, a lang attribute should be applied to the opening HTML tag, indicating the primary language used throughout the document.

In WordPress, this should be handled by the theme, and most modern themes do this for you. However, if the theme author has failed to define the language, you may see a Missing Language Declaration error in accessibility testing tools like Equalize Digital Accessibility Checker or WAVE.

Here’s an example of how the lang attribute can be set for the entire page on the HTML tag at the start of the page. Note that this should be before the <head> tag, not in it.

<!DOCTYPE html>

<html lang=”en-US”>


    <meta charset=”UTF-8″>

    <title>Website Title</title>



    <!– website content goes here –>



In the example above, the “lang” attribute is set to “en-US” to indicate that the primary language of the page is United States English. If you’re using a different language, you would replace “en-US” with the appropriate language code, such as “fr” for French or “es” for Spanish.

Setting a Lang Attribute for Parts of a Page

You should also specify the language for specific elements within the page if the language changes for a particular part of the page, for example, if you’re including a quote from another language or providing a translation on the same page. 

Here’s an example of a page that mixes English and Korean and also includes a sentence in Spanish.

Web page with the navigation and many headings in English, but the H1 and body content in Korean. There are two sentences in Spanish in the left sidebar.

To set the language for a part of a page, you can add the “lang” attribute to any HTML element. For example, here’s how it is added to the alternate language lists shown in the left sidebar of the image above:

<ul class=”resource-alternate-language-posts”>

<li>This resource has an English version. <a href=”https://resourcesharingproject.org/[…]”>Click here to view it in English.</a></li>

<li lang=”es”>Este recurso tiene una versión en español. <a href=”https://resourcesharingproject.org/resources/[…]”>Haga clic aquí para verlo en español.</a></li>


In the example above, the page language is set to English, so nothing needs to be declared on the first list item, but the second list item is in Spanish, so it has lang=”es” on it to indicate the language is changing to Spanish.

Lang Attributes in WordPress

In the aria-hidden article, we discussed some ways attributes can be added to elements in various builders – without having to flip to the edit HTML view. In much the same way, you can add the lang attribute to declare the section of the page. 

Bricks, Elementor Pro, and Oxygen support adding custom attributes out of the box. Here are the instructions for each one:

Other builders require the addition of plugins to be able to set language attributes.

If you are using the WordPress block editor (a.k.a Gutenberg), you can add attributes with either the Attributes for Blocks plugin, which allows you to add any attributes within the editor, or the Lang Attribute for the Block Editor plugin. Both are free.

If you’re doing lots of language switching within elements (such as words in a paragraph), Lang Attribute for the Block Editor is a better plugin to use because it gives you the ability to include the attribute on parts of a block, whereas the Attributes for Blocks plugin will add it on the entire block.  

If you’re coding a page template that includes language changes, don’t forget to include the language declaration in your template. By correctly declaring the language of your HTML pages, you enhance accessibility for assistive technologies, aid in accurate translations, and enable search engines to understand and better rank your content.

Additional Resources

Join the Conversation!

There's a dedicated thread on this post inside of The Admin Bar community. Join in on the conversation, ask questions, and learn more!

Group Thread

Amber Hinds

Equalize Digital

Amber Hinds is the CEO of Equalize Digital, Inc., a Certified B Corp specializing in WordPress accessibility, maker of the Accessibility Checker plugin, and lead organizer of the WordPress Accessibility Meetup and WP Accessibility Day conference.

Through her work at Equalize Digital, Amber is striving to create a world where all people have equal access to information and tools on the internet, regardless of ability. Since 2010, she has led teams building websites and web applications for nonprofits, K-12 and higher education institutions, government agencies, and businesses of all sizes. Through this journey, she learned about the importance of making websites accessible to everyone, and it has been her passion to bring awareness to accessibility and make website accessibility easier, ever since. 

Brought to you by:

Make your WordPress website accessible and ensure all people have equal access to your products or services, regardless of ability. Reach more customers, reduce liability, and increase conversions.

Come Join Us!

Join the #1 WordPress Community and dive into conversations covering every aspect of running an agency!

Kyle Van Deusen

Community Manager

More from Accessibility Weekly

Week 51

How Accessible is “Accessible Enough”

In an ideal world where clients have unlimited budgets and everything is custom, every website would …

Week 50

How to Sell Accessibility in New Builds

Creating websites that prioritize accessibility is no longer just a best practice—it’s a business must, especially …

Week 49

Accessibility in Web Development Contracts

Whether you’re running an agency or freelancing, having a clear contract for your web development and …