Revise the `lang` attribute problem #1542

alrra · 2014-05-10T11:45:19Z

Problem Overview

Developers often forgot to change the value of the lang attribute, so we decided to remove it from <html>.

The change isn't quite good enough as some users:

won't read the docs, and thus, they will find the absence of lang attribute confusing, or won't even know that they should be adding it
won't even notice the absence of the lang attribute, and thus will forget to add it anyway (maybe expecting it to be there)

Specification and Browsers

From http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#attr-lang:

To determine the language of a node, user agents must look at the nearest ancestor element (including the element itself if the node is an element) that has a lang attribute in the XML namespace set or is an HTML element and has a lang in no namespace attribute set. That attribute specifies the language of the node (regardless of its value).

If both the lang attribute in no namespace and the lang attribute in the XML namespace are set on an element, user agents must use the lang attribute in the XML namespace, and the lang attribute in no namespace must be ignored for the purposes of determining the element's language.

If neither the node nor any of the node's ancestors, including the root element, have either attribute set, but there is a pragma-set default language set, then that is the language of the node. If there is no pragma-set default language set, then language information from a higher-level protocol (such as HTTP), if any, must be used as the final fallback language instead. In the absence of any such language information, and in cases where the higher-level protocol reports multiple languages, the language of the node is unknown, and the corresponding language tag is the empty string.

If the resulting value is not a recognized language tag, then it must be treated as an unknown language having the given language tag, distinct from all other languages.

So, it turns out that not specifying the lang attribute is the same as specifying it with the value of "", in both case the language being treated as unknown.

From what I've tested, browser respect the empty string rule (if you find one that doesn't, please let us know).

Solution?

Having the language being treated as unknown isn't really much better then lang="en" (e.g.: VoiceOver on iOS seems to be defaulting to English when the language is unknown, no matter what the default language is).

So, I think we should make it more obvious to the user that they need to specify the lang attribute, by maybe:

Adding lang=""

<!doctype html>
<html class="no-js" lang="">

Adding a comment

<!doctype html>
<!-- Specify the language of your content by adding the `lang` attribute to <html> -->
<html class="no-js">

Adding lang="" and a comment

<!doctype html>
<!-- Specify the language of your content by providing a value for the `lang` attribute -->
<html class="no-js" lang="">

1. Other (Which?)

Thoughts?

The text was updated successfully, but these errors were encountered:

reynaert1250 · 2014-05-10T12:14:24Z

I think number 3 is the best solution.

ugogo · 2014-05-10T12:38:01Z

The third option seems the best to me.

mathiasbynens · 2014-05-10T12:38:55Z

I like number 3 too, but it would mean we’d partially revert our previous removal of all comments from the example HTML in favor of the docs.

If people don’t remove the comment, they add bloat to the <head> which is terrible for performance as described in the docs.

TheDutchCoder · 2014-05-10T12:53:38Z

I'm in favor of either 1 or 3. Not the biggest fan of putting in comments everywhere, but it might be justified in this case.

alrra · 2014-05-10T18:10:43Z

but it would mean we’d partially revert our previous removal of all comments from the example HTML in favor of the docs.

If people don’t remove the comment, they add bloat to the <head> which is terrible for performance as described in the docs.

@mathiasbynens yeah, but like with the GA tracking code, we should also make this somehow obvious. However, If I think more about it, providing just lang="" could also be ok, as the empty string can be a good indication that something is missing.

peterblazejewicz · 2014-05-10T19:34:33Z

+1 for option 3
+1 for option 1 if there is a checklist before going to production (I think there is no on yet for this project)

set language attribute of your page
change UA-XXXXX-X to be your site's ID.
...

roblarsen · 2014-05-10T19:43:51Z

Option 3, for sure. The empty lang attribute value would be glossed over by a lot of people, I think. This is a tricky situation in which we're providing something that isn't quite ready for prime time so adding a comment is more than justified.

roblarsen · 2014-05-10T19:50:01Z

As an aside, I just looked back through a couple of projects I've spun up over the past few months and I had no lang attribute at all in them. This wasn't production code (unless you count book code samples,) so I might have caught it eventually, but removing the attribute tripped me up and I know better.

mathiasbynens · 2014-05-12T07:05:50Z

Option 3, for sure. The empty lang attribute value would be glossed over by a lot of people, I think. This is a tricky situation in which we're providing something that isn't quite ready for prime time so adding a comment is more than justified.

Well, the empty attribute value is not really problematic, even if you were to use this in production – you just wouldn’t have the benefits of having defined the language.

I’m starting to lean towards option 1, if only because it doesn’t cause any harm if it’s ignored (i.e. if people leave the attribute value empty).

QWp6t · 2014-05-12T14:22:26Z

👍 for (1) or (3)

JoshuaJones · 2014-05-12T17:01:38Z

Leaning more for option 1. My preference is to have as few comments in the boilerplate on the get go. We use to explain the meta charset="utf-8" with a comment but that got removed I believe.

alrra · 2014-05-13T20:06:25Z

For now, we'll be going with just adding lang="" (same as it is with <title></title>).

Thanks for the feedback everyone!

In the past we decided¹ to remove the `lang` attribute due to the fact that developers were often forgetting to update its value. This change turned out not to be the best solution because some of the users: * didn't read the documentation, and thus, they found the absence of the `lang` attribute confusing, or didn't even knew they had to add it * didn't notice the absence of the `lang` attribute, and thus, forgot to include it (expecting it to be there) To make things more clearer and to remind users that they need to specify the primary language of the document, this commit reintroduces the `lang` attribute, while leaving its value to `""`. Using `lang=""` has the exact same effect as not specifying the `lang` attribute at all, in both cases the language being treated as unknown². - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ¹ #1110 ² From WHATWG (http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#attr-lang): "To determine the language of a node, user agents must look at the nearest ancestor element (including the element itself if the node is an element) that has a lang attribute in the XML namespace set or is an HTML element and has a lang in no namespace attribute set. That attribute specifies the language of the node (regardless of its value). If both the lang attribute in no namespace and the lang attribute in the XML namespace are set on an element, user agents must use the lang attribute in the XML namespace, and the lang attribute in no namespace must be ignored for the purposes of determining the element's language. If neither the node nor any of the node's ancestors, including the root element, have either attribute set, but there is a pragma-set default language set, then that is the language of the node. If there is no pragma-set default language set, then language information from a higher-level protocol (such as HTTP), if any, must be used as the final fallback language instead. In the absence of any such language information, and in cases where the higher-level protocol reports multiple languages, the language of the node is unknown, and the corresponding language tag is the empty string. If the resulting value is not a recognized language tag, then it must be treated as an unknown language having the given language tag, distinct from all other languages." - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Close #1542.

drublic · 2014-05-14T11:15:57Z

is a decent solution and we should not add more documentation with HTML comments in index.html anymore I believe. Devs who look into changing lang="" will figure out to look into the docs.

In the past we decided¹ to remove the `lang` attribute due to the fact that developers were often forgetting to update its value. This change turned out not to be the best solution because some of the users: * didn't read the documentation, and thus, they found the absence of the `lang` attribute confusing, or didn't even knew they had to add it * didn't notice the absence of the `lang` attribute, and thus, forgot to include it (expecting it to be there) To make things more clearer and to remind users that they need to specify the primary language of the document, this commit reintroduces the `lang` attribute, while leaving its value to `""`. Using `lang=""` has the exact same effect as not specifying the `lang` attribute at all, in both cases the language being treated as unknown². - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ¹ h5bp/html5-boilerplate#1110 ² From WHATWG (http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#attr-lang): "To determine the language of a node, user agents must look at the nearest ancestor element (including the element itself if the node is an element) that has a lang attribute in the XML namespace set or is an HTML element and has a lang in no namespace attribute set. That attribute specifies the language of the node (regardless of its value). If both the lang attribute in no namespace and the lang attribute in the XML namespace are set on an element, user agents must use the lang attribute in the XML namespace, and the lang attribute in no namespace must be ignored for the purposes of determining the element's language. If neither the node nor any of the node's ancestors, including the root element, have either attribute set, but there is a pragma-set default language set, then that is the language of the node. If there is no pragma-set default language set, then language information from a higher-level protocol (such as HTTP), if any, must be used as the final fallback language instead. In the absence of any such language information, and in cases where the higher-level protocol reports multiple languages, the language of the node is unknown, and the corresponding language tag is the empty string. If the resulting value is not a recognized language tag, then it must be treated as an unknown language having the given language tag, distinct from all other languages." - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Ref: h5bp/html5-boilerplate#1542.

Signed-off-by: Bo-Yi Wu <[email protected]>

peterblazejewicz · 2015-01-28T20:18:58Z

active bug topic elsewhere:
Bug 26942 - why do these examples of lack the lang attribute?

See h5bp/html5-boilerplate#1542

In the past we decided¹ to remove the `lang` attribute due to the fact that developers were often forgetting to update its value. This change turned out not to be the best solution because some of the users: * didn't read the documentation, and thus, they found the absence of the `lang` attribute confusing, or didn't even knew they had to add it * didn't notice the absence of the `lang` attribute, and thus, forgot to include it (expecting it to be there) To make things more clearer and to remind users that they need to specify the primary language of the document, this commit reintroduces the `lang` attribute, while leaving its value to `""`. Using `lang=""` has the exact same effect as not specifying the `lang` attribute at all, in both cases the language being treated as unknown². - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ¹ h5bp/html5-boilerplate#1110 ² From WHATWG (http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#attr-lang): "To determine the language of a node, user agents must look at the nearest ancestor element (including the element itself if the node is an element) that has a lang attribute in the XML namespace set or is an HTML element and has a lang in no namespace attribute set. That attribute specifies the language of the node (regardless of its value). If both the lang attribute in no namespace and the lang attribute in the XML namespace are set on an element, user agents must use the lang attribute in the XML namespace, and the lang attribute in no namespace must be ignored for the purposes of determining the element's language. If neither the node nor any of the node's ancestors, including the root element, have either attribute set, but there is a pragma-set default language set, then that is the language of the node. If there is no pragma-set default language set, then language information from a higher-level protocol (such as HTTP), if any, must be used as the final fallback language instead. In the absence of any such language information, and in cases where the higher-level protocol reports multiple languages, the language of the node is unknown, and the corresponding language tag is the empty string. If the resulting value is not a recognized language tag, then it must be treated as an unknown language having the given language tag, distinct from all other languages." - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Close h5bp/html5-boilerplate#1542.

Fixes #5945 `lang="en"` may be wrong to users, use empty string instead. See : h5bp/html5-boilerplate#1542

alrra closed this as completed in d916a72 May 13, 2014

appleboy added a commit to appleboy/html5-template-engine that referenced this issue Jun 7, 2014

ref: h5bp/html5-boilerplate#1542

3ed5780

Signed-off-by: Bo-Yi Wu <[email protected]>

alrra mentioned this issue Jun 19, 2014

Update template.hbs jlord/reporobot#12

Merged

alrra mentioned this issue Jul 10, 2014

Add lang attribute to <html> google/web-starter-kit#272

Closed

This was referenced Nov 1, 2014

Add lang indicator to <html> yeoman/generator-mobile#62

Merged

Add language indicator to <html> yeoman/generator-webapp#218

Merged

peterblazejewicz mentioned this issue Dec 30, 2014

Update html templates markup to follow h5bp. Closes #20 OmniSharp/generator-aspnet#28

Merged

alrra mentioned this issue Apr 17, 2015

Look into adding a web application manifest file #1629

Closed

10 tasks

mrmartineau added a commit to TryKickoff/kickoff that referenced this issue Sep 29, 2015

Revise the lang attribute

3b3eee1

See h5bp/html5-boilerplate#1542

roblarsen mentioned this issue Aug 17, 2016

Revisit lang attribute #1879

Closed

This was referenced Oct 22, 2020

Language attribute of <html> should not be set to English by default vuejs/vue-cli#5945

Closed

fix: using lang attribute with empty string in html template vuejs/vue-cli#5992

Merged

haoqunjiang pushed a commit to vuejs/vue-cli that referenced this issue Oct 26, 2020

fix: using lang attribute with empty string in html template (#5992)

2373df1

Fixes #5945 `lang="en"` may be wrong to users, use empty string instead. See : h5bp/html5-boilerplate#1542

haoqunjiang pushed a commit to vuejs/vue-cli that referenced this issue Jan 6, 2021

fix: using lang attribute with empty string in html template (#5992)

ed2cf22

Fixes #5945 `lang="en"` may be wrong to users, use empty string instead. See : h5bp/html5-boilerplate#1542

ZanderOlidan pushed a commit to ZanderOlidan/vue-cli-service-chalkfix that referenced this issue Feb 5, 2024

fix: using lang attribute with empty string in html template (#5992)

159e4a7

Fixes #5945 `lang="en"` may be wrong to users, use empty string instead. See : h5bp/html5-boilerplate#1542

ZanderOlidan pushed a commit to ZanderOlidan/vue-cli-service-chalkfix that referenced this issue Feb 5, 2024

fix: using lang attribute with empty string in html template (#5992)

1322afc

Fixes #5945 `lang="en"` may be wrong to users, use empty string instead. See : h5bp/html5-boilerplate#1542

oliverfoster mentioned this issue Feb 12, 2024

Setting language of course for Google Translate adaptlearning/adapt-contrib-core#499

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Revise the `lang` attribute problem #1542

Revise the `lang` attribute problem #1542

alrra commented May 10, 2014

reynaert1250 commented May 10, 2014

ugogo commented May 10, 2014

mathiasbynens commented May 10, 2014

TheDutchCoder commented May 10, 2014

alrra commented May 10, 2014

peterblazejewicz commented May 10, 2014

roblarsen commented May 10, 2014

roblarsen commented May 10, 2014

mathiasbynens commented May 12, 2014

QWp6t commented May 12, 2014

JoshuaJones commented May 12, 2014

alrra commented May 13, 2014

drublic commented May 14, 2014

peterblazejewicz commented Jan 28, 2015

Revise the lang attribute problem #1542

Revise the lang attribute problem #1542

Comments

alrra commented May 10, 2014

Problem Overview

Specification and Browsers

Solution?

reynaert1250 commented May 10, 2014

ugogo commented May 10, 2014

mathiasbynens commented May 10, 2014

TheDutchCoder commented May 10, 2014

alrra commented May 10, 2014

peterblazejewicz commented May 10, 2014

roblarsen commented May 10, 2014

roblarsen commented May 10, 2014

mathiasbynens commented May 12, 2014

QWp6t commented May 12, 2014

JoshuaJones commented May 12, 2014

alrra commented May 13, 2014

drublic commented May 14, 2014

peterblazejewicz commented Jan 28, 2015

Revise the `lang` attribute problem #1542

Revise the `lang` attribute problem #1542