Skip to main content
SlapMyWeb
Slap a site

Accessibility fix

How to Fix a Missing Lang Attribute

Declare the page's language so assistive technology pronounces it correctly.

Difficulty
Easy
Impact
Medium
Time
5 min

Before

<html>

After

<html lang="en-GB">
Before and after code for: How to Fix a Missing Lang Attribute

A missing lang attribute means the html element does not declare what language the page is written in. Screen readers then apply the wrong pronunciation rules to the entire document, which makes it hard to follow. It is one attribute, it is a WCAG requirement, and roughly one in six audited sites is missing it.

Why it matters

Without it, a screen reader may read English with Spanish phonetics, or vice versa. It is also a supporting signal for search engines deciding which audience a page serves.

How to fix it

  1. Add lang to the html element

    Use a BCP 47 tag: en, en-GB, ur, pt-BR. Include the region only when it changes spelling or pronunciation.

  2. Mark passages in another language

    A quotation or phrase in a different language takes its own lang attribute on the surrounding element.

  3. Set dir for right-to-left languages

    Arabic, Hebrew, Urdu and Farsi also need dir="rtl" so the layout direction is correct.

  4. Check every template

    The attribute is usually set once in a root layout, so a missing one often means an error page or an embed is rendered from a different template.

The code

Beforehtml
<html>
Afterhtml
<html lang="en-GB">

On your platform

WordPress

Themes should output language_attributes() in the html tag. A hardcoded html tag is the usual cause.

Next.js

Set it on the html element in the root layout; it does not appear by default.

Sources

More fixes

Accessibility

How to Fix Low Color Contrast

Make text meet the WCAG 4.5:1 contrast ratio so it's readable for everyone.

Accessibility

How to Add Labels to Form Inputs

Associate a visible label with every input so screen-reader users can fill your forms.

Accessibility

How to Fix Tap Targets That Are Too Small

Make buttons and links big enough and far enough apart to hit on a phone.

Fixed that one.
Now find the rest.

A free audit ranks every issue on your site by the score points it costs, and links each one straight to its guide.

Run a free audit
Free foreverNo signupLive scan progress