Correct Canonical and AMP Link Tags for a Full AMP Website

If you want your entire website to be AMP-only (meaning every page will be AMP, with no separate non-AMP version), you need to set up your Canonical Tags properly. Let’s understand clearly: Correct Canonical and AMP Link Tags for a Full AMP Website

When Your Whole Website Is Built with AMP

Every page must follow the AMP HTML structure.
You still must use a canonical tag.
But this time, the canonical link should point to the same page itself (self-referencing).

Correct HTML Structure for a Fully AMP Website

Inside the <head> section of every page, you should add the following:

<head>
  <meta charset="utf-8">
  <title>Your Page Title</title>

  <!-- Canonical link pointing to itself -->
  <link rel="canonical" href="https://www.yourwebsite.com/this-page.html">

  <!-- AMP required scripts -->
  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
  <script async src="https://cdn.ampproject.org/v0.js"></script>
  <link rel="stylesheet" href="https://cdn.ampproject.org/v0.css">

  <!-- Your custom AMP CSS -->
  <style amp-custom>
    /* Your AMP CSS goes here */
  </style>
</head>

Important Rules

The Canonical Tag must point to the page’s own URL (self-referencing).
Every page must use <html amp> or <html > syntax at the beginning of the HTML file, like:

<html amp>

<html >

Your AMP page must pass AMP Validation with no critical errors.

Quick Summary Table

Situation	Correct Canonical Setup
If you have both AMP and Non-AMP versions	AMP page ➔ Canonical ➔ Non-AMP version
If your entire site is AMP-only	Canonical ➔ Point to same page (self-link)

Bonus Tip

If your whole website is AMP-only, you do not need to add <link rel="amphtml"> separately.
Just setting the canonical link pointing to itself is enough.

Correct Canonical and AMP Link Tags for a Full AMP Website- Example for a Fully AMP Page

Suppose your page URL is:
https://www.mysite.com/about.html

Then your <head> the section should look like this:

<head>
  <meta charset="utf-8">
  <title>About Us - MySite</title>

  <link rel="canonical" href="https://www.mysite.com/about.html">

  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
  <script async src="https://cdn.ampproject.org/v0.js"></script>
  <link rel="stylesheet" href="https://cdn.ampproject.org/v0.css">

  <style amp-custom>
    /* Your custom CSS for AMP */
  </style>
</head>

Final Conclusion

For a full AMP website, always use a self-referencing canonical tag.
No need for a separate rel="amphtml" link.
Follow all AMP HTML rules (no custom JavaScript, limited CSS, no third-party scripts unless approved).

Would you also like me to create a ready-to-use AMP full homepage and blog post template for you?
If so, just tell me your website topic, and I will prepare it based on your needs!

Would you like me to continue with that?