Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Meta tag order in <head> #269

Open
adam314315 opened this issue May 23, 2021 · 3 comments
Open

Meta tag order in <head> #269

adam314315 opened this issue May 23, 2021 · 3 comments

Comments

@adam314315
Copy link

Is there any official source(s) defining meta tag orders in <head> tag such as reported below or is it a best practice / recommandation?

<meta name="viewport" content="width=device-width, initial-scale=1">
<!--
  The above 2 meta tags *must* come first in the <head>
  to consistently ensure proper document rendering.
  Any other head element should come *after* these tags.
 -->
@rhymeswithmogul
Copy link

rhymeswithmogul commented May 23, 2021 •
edited

The HTML5 spec says <meta charset> and <title> must be first and second, respectively. Other than that, it's however you want it.

fmarier added a commit to fmarier/fmarier.org that referenced this issue May 23, 2021
@fmarier
Put charset first to match HTML spec.
c3da16c 
joshbuchea/HEAD#269 (comment)
@adam314315
Copy link
Author

@rhymeswithmogul Thanks. I actually cannot find this rule in the HTML5 spec: https://www.w3.org/TR/html50/

@rhymeswithmogul
Copy link

@rhymeswithmogul Thanks. I actually cannot find this rule in the HTML5 spec: https://www.w3.org/TR/html50/

Well, I must have mis-remembered! The only thing I could find out is that the <meta charset> tag must appear within the first 1024 bytes of the document. In theory, if a user agent encounters the charset declaration late and it guessed incorrectly, it may have to "reload" and re-interpret the page, slowing down the user experience.

As far as the <title> tag, I found nothing about ordering, other than it's a required sub-element if <head> is present.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@rhymeswithmogul @adam314315