Add lang attribute to html for better accessibility

[okonet]

Feature request

html tag accepts lang attribute that is, according to MDN, very important for accessibility and accessible technologies like screen readers.

Providing a lang attribute with a valid IETF identifying language tag on the element will help screen reading technology determine the proper language to announce.

Describe the solution you'd like

Add lang="en" by default and provide a simple way to configure the language for the whole project.

Describe alternatives you've considered

We've ended overriding the _document.js as of https://github.com/zeit/next.js#custom-document but not providing this by default contributes to even worse web accessibility situation.

Additional context

Google Chrome shows "Translate this page" dialog without the lang set.

[kachkaev]

IMHO setting lang="en" by default can make things worse for non-English Next.js websites. Setting it in _document.js seems to be the right way. This is what I do and I don't feel bothered 🤷‍♂️

[okonet]

I assume most next.js user don't bother overriding _document.js.

[timneutkens]

Assuming all pages are english would be wrong imo. For reference there's a large number of Next.js sites in basically every major language you can think of.

Making it easier to configure something like that would be interesting to pursue. cc @devknoll let's keep this in mind with the next/head deprecation.

[mi-na-bot]

Thinking more broadly, react-helmet provides a facility for supplying arbitrary attributes to html and body within its equivalent of Head on any page.

[timneutkens]

To come back to my earlier comment, RFC for deprecating next/head is here: #8981

[bionicles]

this fails on lighthouse CI with a default create-next-app and seems easy to fix

[ScottSmith95]

It would be nice to not have to override pages/_document.js and just add something to next’s config.

[razvangherghina]

+1 lang is important

[phattranky]

+1 it's important

[timneutkens]

Please don't spam the thread with +1. Use the GitHub emoji reaction system to add a 👍 on the initial issue.

[cereallarceny]

Perhaps this is a bit out of scope, but for multi-domain deployments (.com, .nl, .pt) it would also be kind of nice to add the lang tag without having to implement a custom server either.