Where must an HTML canonical link be placed?

Definition: An HTML canonical link is a <link> element with rel="canonical" that indicates the preferred URL for duplicate or very similar pages. Google accepts this element only when it appears in the HTML <head> section and that section is valid HTML.

Key facts

• Google's canonical URL documentation says the rel="canonical" link element is accepted only in the HTML <head> section.
• Google recommends putting the element in the HTML source and making sure JavaScript does not change it.
• Google's valid page metadata guidance says an invalid element in <head> causes Google to ignore elements that follow it.
• The WHATWG HTML Standard defines <head> as a collection of document metadata and <link> as metadata content.
• Google recommends an absolute URL in the href attribute. Relative paths are supported, but Google does not recommend them.

Where does the element go?

Place the canonical element inside the page's HTML <head>, before the document's <body>. Google's documentation describes it as an element used in the HTML head and shows it on duplicate pages, pointing to the preferred page. The same page recommends adding a self-referential element to the canonical page itself.

<head>
  <title>Explore the world of dresses</title>
  <link rel="canonical" href="https://example.com/dresses/green-dresses" />
  <!-- other elements -->
</head>

The WHATWG HTML Standard describes <head> as a collection of metadata for the document. It defines the <link> element as metadata content that can be used where metadata content is expected. The HTML structure therefore places this element in the metadata section, rather than among the page content.

What makes the head valid for Google?

Google's valid page metadata guidance lists title, meta, link, script, style, base, noscript, and template as valid elements for <head>. It identifies iframe and img as common elements that make the section invalid.

Google also explains the practical consequence: once it detects an invalid element, it assumes the end of <head> and stops reading later elements in that section. A canonical link placed after such an element is therefore outside the part of the head Google says it reads. Keeping the canonical link among the valid metadata elements avoids that parsing boundary.

What should the link contain?

The required relationship is expressed with rel="canonical", and the target URL is supplied in href. Google's canonicalization documentation recommends an absolute path that includes the protocol and hostname, such as https://example.com/dresses/green-dresses. It says relative paths are supported by Google but can cause problems and are not recommended.

The same documentation treats rel="canonical" annotations as a strong signal for the specified URL. It recommends using the same self-referential link on the canonical page. The canonical link applies to HTML pages; Google documents a rel="canonical" HTTP response header for supported non-HTML documents such as PDF files.

How can you check the placement?

Inspect the HTML source delivered for the page and locate the <head> and the canonical <link>. Google recommends specifying the canonical URL in the HTML source, and it says JavaScript should not change the canonical link element. Check that the link appears before any invalid head element such as iframe or img, uses rel="canonical", and has an absolute href.

Related terms

• Canonical URL
• Semantic HTML
• Meta robots

FAQ

Can an HTML canonical link go in the body?

Google's documentation accepts the HTML rel="canonical" link only in the <head> section. The WHATWG Standard classifies <link> as metadata content, which is expected in the document head for this use.

What happens if an invalid element appears before the canonical link?

Google says it assumes the end of <head> when it detects an invalid element and stops reading later elements in that section. Its examples of common invalid head elements include iframe and img.

Does a relative canonical URL work?

Google says relative paths are supported, while recommending absolute URLs that include the protocol and hostname. The example in its canonicalization documentation uses https://example.com/dresses/green-dresses.

Can JavaScript add the canonical link?

Google recommends putting the canonical URL in the HTML source and making sure JavaScript does not change the canonical link element. Its documentation also provides separate guidance for injecting the element with JavaScript when that is necessary.

Sources

1. Google Search Central, "How to specify a canonical URL with rel="canonical" and other methods", 10 July 2026
2. Google Search Central, "Valid Page Metadata for Google Search", 10 December 2025
3. WHATWG, "HTML Standard", Living Standard

---

Check how a page reads to answer engines. Open the GEO score analyzer