Why You Should Optimize For HTML Anchor Links (And Get More Traffic)

What is the most overlooked (and ridiculously) basic SEO best practice?

Hint: Have you heard about anchor tag links?

This is also one of the easiest SEO tasks to implement, and in the following post, I’ll explain just how scalable it can be.

TL;DR

I have decided to write this post following my last tweet:

The good news is that consolidating your website traffic on canonical URLs haven’t changed the way we can monitor anchor links with Google performance report – April 10, 2019

This is the graph for all the URLs that contain #:

As you can see, the impressions are still counted specifically for anchor links.

So, what exactly are anchor links and how and why you should optimize them?

Let us dig in >>

Contents

What is an anchor link?

Why should you optimize for anchor links?

Best practices for using HTML anchor tag links

How do I create an anchor link in HTML (jump to anchor)?

HTML anchor links are links to sections within the same page. This HTML link allows users to jump and navigate to a specific section on the same article.

The best and most famous example is Wikipedia, and they execute it beautifully.

For example, this is the table of contents (and anchor links) for the musical Hamilton:

Clicking on any of the links will take you directly to the specific section on the same page.

Monitoring and analyzing – as mentioned above, with Google Search Console’s performance report, you can see all the impressions and clicks not only by page but also by anchor.

In case we have a huge 5,000 words post, it can be somewhat challenging to monitor all the different keywords and most important – to understand the user-intent and to find which section to optimize for.

For example, if we have an F.A.Q page (which is a must for branded searches), we can easily track and analyze specific on-page sections.

Also, it is always interesting to see and investigate not only which pages, but also which areas of the pages had the most visibility and interest.

Using “Heatmaps” to understand user behavior – back to the last example:

it can greatly serve us not only to understand what are the most visited organic pages but also to have an even deeper understanding of where exactly users were scrolling on the page.

I call this a heatmap, while it doesn’t always display like this:

It can still serve the same purpose, in a way.

Improving your CTR – Think about it, it is well documented that long content performs way better than short content.

The problem with long content is that if you don’t construct it properly, it can be very difficult for users to navigate through, especially if they are looking for a specific piece of information, and are not interested in reading the entire article.

For example, if you want to read about Matt Cutts’ career:

Why read his entire life story, when you can simply jump to the juicy section?

For users who search for “Matt Cutts career”, this certainly stands out and naturally, there are more chances that they will click this link.

Improve your user engagement – lower bounce rate, higher average time on page – do we need to ask for more?

Why?

Because, it is highly probable that users who can easily find exactly what they were looking for (jump right to the answer), will stay on the page longer.

Also, remember that both user engagement and better CTR can improve your organic rankings in the almighty user-friendly eyes of Google.

Diversify your internal links’ anchor text – internal links are highly important (no less than external links). They are important for navigational purposes, improving user engagement (once again) and for setting a clear logical site hierarchy, for both search engine crawlers and the users.

In addition, by optimizing for onsite internal links, we are also passing link juice to the most important pages (if conducted wisely, of course).

Can we link to anchor on another page?? Yes, we can!

For example, linking from a page about transportation (general) > to a page about transportation in Barcelona, but to the specific section about trams in Barcelona:

In this case, do HTML anchor links pass any link juice?

Yes, they pass link juice, but only to the main page. As Google do not count anchor links as different URL’s, only the main target URL will receive the link equity, no matter the anchor links.

It is as simple as it gets, but let us go over some basic best practices:

1. Optimize the URLs for your anchor links– Like with regular URLs, be sure to optimize your link URLs to make sense, and try to be as be descriptive as possible:

Bad: example.com/seo#1
Good: example.com/seo#links
Best: example.com/seo#broken-links

2. Anchor links are not equal to JS links – there is still a lot of confusion, so I will just add that in both cases, URLs with hashtags only will not be indexed (not to confuse with hash fragment).

3. Redirects – In case of a site migration, there is no need to include 301 redirects to the anchor URLs because as you remember, they are not indexed.

Just make sure to redirect the main URL, you can recreate the anchors later, with no need for specific redirects for them.

4. Single page applications (SPA) – in general, SPA’s are not considered a proper use for anchor links. Even for a small product, try to avoid having a long scrolling page with all the data.

Instead, I strongly recommended having a separate page (with indexed URLs of course) for the basic stuff – pricing page, contact us page and about us page.

These are the most common pages, and users tend to search specifically for them sometimes. Using one page for all of that info will be a bad idea –both from the user experience angle, and for us site owners, losing the ability to monitor what our audience is searching for in Google Analytics and Search Console.

The 2 most common methods for creating anchor links are:

1.If you run a WordPress site, you can do it with plugins such as an easy table of contents

In this way, you will not need to get your hands dirty with any coding.

2. By conducting easy and simple changes to the code – you DON’T need to be a developer to do this. Honestly, it’s super-simple. Click here for the full explanation on how to make manual changes to the HTML code.

So, what about you? Do you optimize for anchor links?

Paul Trillo GIF - Find & Share on GIPHY

Posted by Roey Skif

Leave a Reply