Hreflang links outside the head

What it is

The page has hreflang links, <link rel="alternate" hreflang="...">, but none of them sits inside the <head>. Hreflang links tell search engines which URL serves which language or country. They usually land in the body because an element that does not belong in the head, such as an image, an iframe or a <div>, closed it early, or because they were added through a body code block.

Why it matters

Google requires hreflang links to sit inside a well-formed head , and stops reading the head at the first element that does not belong there. Links after that point are not used, so your language versions are not tied together, and searchers can be shown a version in the wrong language or for the wrong country. The same early break can hide the canonical and robots tags written after it.

How Asky checks it

Asky parses the page’s raw HTML the way a browser does and finds every <link rel="alternate"> with an hreflang attribute. The page is reported when there is at least one and none is inside the head; one link in the head is enough to pass. Links written between </head> and <body> are moved into the head by the parser and pass. Hreflang in an HTTP Link header or an XML sitemap is not read, and links added by JavaScript are not seen. Codes, x-default and duplicates are still checked wherever the links sit.

Reported as an error with high severity.

How to fix it

Open the page in the browser’s element inspector, which shows where the parser placed each tag, and compare it with the page source.
If the links are written inside the head in the source, look above them for the element that ended the head: an <img> tracking pixel, an <iframe>, a <div> from a widget, or text left by a broken tag.
Move that element into the <body>. If a vendor script insists on the head, place it after the meta and link tags.
If the links are written in the body, for example in an embed block, remove them there and output them in the head, through your CMS’s localization feature, a multilingual plugin or head custom code.
If your CMS cannot put them in the head, remove them from the page and list the language versions in your XML sitemap instead, which Google also supports. Asky then finds no hreflang links in the page to check.
Check the canonical and robots tags in the inspector too, since the same break moves them.

Example

On https://example.com/pricing, a tracking pixel closes the head before the language links:


<!-- Before -->
<head>
  <img src="https://example.org/pixel.gif" alt="">
  <link rel="alternate" hreflang="en" href="https://example.com/pricing">
  <link rel="alternate" hreflang="de" href="https://example.com/de/preise">
  <link rel="alternate" hreflang="x-default" href="https://example.com/pricing">
</head>
 
<!-- After: the pixel moves to the body -->
<head>
  <link rel="alternate" hreflang="en" href="https://example.com/pricing">
  <link rel="alternate" hreflang="de" href="https://example.com/de/preise">
  <link rel="alternate" hreflang="x-default" href="https://example.com/pricing">
</head>
<body>
  <img src="https://example.org/pixel.gif" alt="">
</body>

← Back to Hreflang