Skip to content

Instantly share code, notes, and snippets.

@nicolasdao
Last active September 7, 2023 12:33
Show Gist options
  • Save nicolasdao/639236706f4638efe1f51b9ef73cc55d to your computer and use it in GitHub Desktop.
Save nicolasdao/639236706f4638efe1f51b9ef73cc55d to your computer and use it in GitHub Desktop.
HTML guide. Keywords: performances performance perf fast quick html js css javascript

HTML GUIDE

Table of contents

HTML

Preload

https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/preload

<a> tag aka links

rel attribute

Example:

<a href="https://event-more-dangerous-website.com" target="_blank" rel="noopener"/>

In a nutshell:

  • Don't use the rel attribute on internal links.
  • Always use rel="noopener" on external links to protect from Tabnapping.
  • Use rel="noreferrer" on all external links except when you wish to get the attention of the external website owner (e.g., you want a link sharing partnership with the website).
  • Use rel="nofollow" on all external links except when you endorse the external links. When you endorse an external link, they get some of your SEO juice. That's only good for them. You gain nothing from this except maybe nurturing a future partnership with them.
  • Make sure to sanitize all user-generated content's links by adding to them rel="ugc". To be totally safe, the recommendation is to use rel="ugc noopener noreferrer nofollow"
  • To mark content as sponsored, use rel="sponsored". It is equivalent to rel="nofollow" but adds more context. To be totally safe, the recommendation is to use rel="sponsored noopener nofollow"

FAQ

Does <meta name="robots" conflicts with <a href="..." rel="nofollow"?

Yes and no. The Google bot follows the most contraining rule. For example, with

<meta name="robots" content="nofollow">

The Google bot will not follow any links in that page, even if some are configured to be followed. However, with:

<meta name="robots" content="follow">

Links configured with the rel="nofollow" are not followed while those without are followed.

Does robots.txt conflicts with meta name="robots"?

No, but inconsistencies will make it hard to reason about your website. Use one or the other, or make sure that they are aligned.

Annexes

References

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment