How to fix html lang on Headless / Custom (I build in code)
Add a lang attribute to your site's <html> tag that matches the primary language of your store's content.
Steps for Headless / Custom (I build in code)
- Open your root layout component or HTML shell template (e.g., app/root.jsx in Remix/Hydrogen, pages/_document.js in Next.js, app.html in SvelteKit, index.html in a static build).
- Add the lang attribute to the <html> element: <html lang="en"> (hardcoded) or dynamically bound to a locale variable for multi-language apps.
- For Next.js, set i18n.defaultLocale in next.config.js — Next.js automatically adds lang to <html> based on the active locale.
- For Nuxt.js with @nuxtjs/i18n, the module sets the lang attribute automatically from the active locale.
- Verify with browser DevTools → Elements panel that the rendered <html> tag carries the correct lang value.
What is html lang?
Every web page starts with an opening `<html>` tag. Adding a `lang` attribute to it — for example, `<html lang="en">` for English — tells browsers, screen readers, and search engines what human language the page is written in. It is a one-line change in your theme or template, and it is one of the most foundational requirements of modern web standards. The value uses a standard two-letter (or extended) language code such as `en`, `fr`, `de`, `es`, `ja`, or `zh-Hans`.
Screen readers used by visually impaired shoppers rely on the `lang` attribute to choose the correct pronunciation engine — without it, your content may be read aloud in the wrong language, making your store inaccessible. Accessibility laws in many jurisdictions (ADA in the US, EN 301 549 in the EU, AODA in Canada) treat a missing `lang` attribute as a conformance failure, creating real legal exposure. Search engines also use this signal to understand which market a page targets, which influences how and where your pages appear in regional search results. Fixing it is a quick win that simultaneously reduces legal risk, improves usability for millions of shoppers with disabilities, and reinforces your international SEO targeting.
See the complete Html lang guide for every platform and the full background.
Not sure if your Headless / Custom (I build in code) store has this?
Run a free SEOLZ scan — we’ll find html lang and every other issue across your whole site.
Scan my site free