15

A SEO company suggested we change the order of our HTML meta tags so that <title> and <meta name="description"> are the first two. They say this is to ensure search engines can utilize these two tags. I've been under the impression that the order of tags inside the document's head is not significant. Have I been wrong? Are there really search engines that assume that the first two tags are always title and description and give up looking for them if they aren't?

15

You are correct. The order of those tags do not matter for SEO. They just need to be present. Whomever said that is obviously clueless (and of course running an SEO business. Sigh).

6

While for the purposes of SEO, it may be true that the order is not significant, it is not true when considering other things like security, content (character) display, or loading speed. It is a good idea to order your page’s head roughly thus (presuming HTML5 for syntax):

<head>

So far in the document, you should not have used any non-ASCII characters, so character encoding is not an issue yet. But the likelihood of using non-ASCII characters goes up markedly once you open that head tag. Accordingly (and assuming that you are not declaring your character encoding programmatically or at the server level), you should make the next statement your character-encoding declaration. This also satisfies parsers/browsers/agents that would be sniffing for character encoding statements:

  <meta charset="utf-8">

The following two (X-UA-Compatible and viewport) are recommended by the folks at Bootstrap (as recently as v3.3.4). While I am nearly positive that these recommendations are based on performance, most of what I would say would be speculative:

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

If you are thinking about device-agnostic design/development (inclusive of smaller, non-desktop user agents), you should include the following:

  <meta name="viewport" content="width=device-width, initial-scale=1">

Finally, the title:

  <title>Ingenious Page Title</title>

Next, you offer the CSS as soon after the title as possible (no ‘daylight’ between them):

  <link rel="stylesheet" href="stylesheet-1.css">
  <link rel="stylesheet" href="stylesheet-2.css">

If you are using page-level styles, they would go here. This is largely because of the ‘cascading’ nature of CSS: namely the last style declaration of identical levels of specificity (such as two statements that target a paragraph p). In order to make overriding external styles easier (i.e. without using greater specificity, or !important), you should put page-level styles after external styles (<link>s). Also, it is generally inadvisable to use the @import directive in page-level styles, because it will impede the concurrent downloading of other style assets:

  <style>body{color:black;}</style>

This is the point where it seems most appropriate to put meta tags, favicons, and other cruft. It is arguable that favicons or similar assets (e.g. iOS app images) would be loaded before most meta tags, because it gets the downloading of those assets started marginally sooner.

  <link rel="shortcut icon" href="favicon.ico">
  <link rel="apple-touch-icon" href="apple-icon.png">
  <meta name="description" content="Some information that is descriptive of the content">
  <meta name="generator" content="Microsoft FrontPage 2002">

Because it blocks/delays rendering, if you intend to require scripts, load them as late as is reasonable. If they must be in the head, you might load them before the close of the head (</head>). If you can load them later, put them before the close of the body tag (</body>).

  <script src="script-1.js"></script>
  <script src="script-2.js"></script>
</head>

It seems unimportant in most cases to pay much attention to the order of meta tags for SEO purposes, given that indexing bots (i.e. search engine spiders) are going to consume the whole page. Otherwise, how would they index a page’s content, or update that index later?

It is notable to me that for all that we think we know, and all the recommendations that we find on the web (even from places like Google and Bing Webmaster Tools, etc.), sites like Amazon, Google and other folks who clearly care about such minuscule performance gains don’t follow these rules.

  • While X-UA-Compatible, viewport and Apple touch icons were still (relatively) new in 2010, all were in use. HTML5 only affected the charset declaration's length. CSS, JS and image pipelining was a concern back then, as well as the (re-)rendering of pages subsequent to the application of CSS and JS. Notwithstanding that, I couldn’t find this information in one place (outside of the heads of html documents), and after stumbling across this question, it seemed good to do it here. – David Eldridge May 20 '15 at 9:54
  • Good answer @DavidEldridge. But would you mind updating your answer to include application/ld+json scripts for structured data? For speed purposes. Where would it be best to put it? Should we treat it as external JavaScript files? – Brendan Vogt Jan 10 '17 at 8:30
2

From a functionality point of view the following from Bootstrap seems to be the better order of the meta tags:

    1) <meta charset="utf-8">
    2) <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    3) <title></title>
    4) <meta name="description" content="">
    5) <meta name="viewport" content="width=device-width, initial-scale=1">

According to the people at Google, what matters for SEO is

  1. being mobile friendly
  2. title and description
  3. unique and worthwhile content

If your site is not mobile friendly they do not even look at 2) or 3). If it is mobile friendly they may use the title and description when they list your site. No guarantees on that. They may decide to come up with their own description based on what they find on your site.

If your content is plagiarized or repetitious and if you try to stuff it full of keywords or use other 'BlackHat' techniques, those things will hurt you and possibly ban you.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.