How to Link to Specific Points on a Page

While this certainly isn’t an advanced tip, it is one that can go a long way toward making a document or website more user friendly. Surprisingly, I’ve known several webmasters that were unfamiliar with the process. It deals with linking to specific points on a page (either the same page or another page on the same site). It’s especially handy when you want to provide a link to just a particular paragraph of another page, rather than to the top of the page, making your reader search for the part you’re referencing.

Site Navigation

Basically, we’re going to set specific destination points via html tags and link to those tags from other points. You’ve undoubtedly seen this done with a table of contents that linked to particular pages or a listing of headings in a lengthy document.

Let’s say that I want to show you a paragraph later on this page. I name that paragraph by placing  a destination tag immediately before the section I want to link to. That tag would be in this format:

<a name=”one”></a>

Then, I build my link to that point, in this format:

<a href=”#one”>Referenced sub header1</a>

Which to the reader, obviously, would appear as Referenced sub header1.

So when the reader clicks on the link, he’s taken down-page to the referenced paragraph. Now, if you want to ensure a user-friendly experience, you should place another link at the end of the Referenced sub header1, perhaps something like <a href=”home1″></a>, and a corresponding destination tag (<a name=”home1″></a>) right before the point from which you directed the reader to the referenced sub header1. Maybe you would just use the anchor text of Return.

If you want to do this between different pages of your site, it’s just as simple. Just use absolute URLs in the links, regardless of what your normal URL convention is. Go ahead and try these examples:

Paragraph1

Paragraph2

Paragraph3

Treasure Map

If you’re using WordPress, do not try to write these tags in MS Word and then paste them into your WP editor using the Paste from Word feature. You’ll need to do this in the html editor, as the quotation marks in MS Word are not recognized as code delineators.

A word of caution: These links are seen by the bots, so if you link out to a page that has no other inbound links and no outbound links, you can create a dangling node.

 

1Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus semper, sem vitae faucibus imperdiet, lacus nibh ullamcorper orci, a tempus mauris turpis vel massa. Nulla libero nulla, molestie ac condimentum sed, placerat ac est. In pellentesque tellus nec nulla lacinia non volutpat ipsum dapibus. Duis egestas malesuada nisi, non egestas nisl semper ac. Cras lectus dui, lobortis sit amet ullamcorper eu, pulvinar quis sapien. Maecenas elementum blandit nulla quis tristique. Aenean et metus id enim feugiat fermentum. Etiam porta sodales eros ut varius. Aenean sagittis interdum mauris elementum congue. Return

 

2Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus semper, sem vitae faucibus imperdiet, lacus nibh ullamcorper orci, a tempus mauris turpis vel massa. Nulla libero nulla, molestie ac condimentum sed, placerat ac est. In pellentesque tellus nec nulla lacinia non volutpat ipsum dapibus. Duis egestas malesuada nisi, non egestas nisl semper ac. Cras lectus dui, lobortis sit amet ullamcorper eu, pulvinar quis sapien. Maecenas elementum blandit nulla quis tristique. Aenean et metus id enim feugiat fermentum. Etiam porta sodales eros ut varius. Aenean sagittis interdum mauris elementum congue. Return

 

3Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus semper, sem vitae faucibus imperdiet, lacus nibh ullamcorper orci, a tempus mauris turpis vel massa. Nulla libero nulla, molestie ac condimentum sed, placerat ac est. In pellentesque tellus nec nulla lacinia non volutpat ipsum dapibus. Duis egestas malesuada nisi, non egestas nisl semper ac. Cras lectus dui, lobortis sit amet ullamcorper eu, pulvinar quis sapien. Maecenas elementum blandit nulla quis tristique. Aenean et metus id enim feugiat fermentum. Etiam porta sodales eros ut varius. Aenean sagittis interdum mauris elementum congue. Return

You can see how this makes things a lot easier for your visitors, when you want to reference material that’s relevant to the point being discussed. If you’re not already using this technique, maybe you should be.

Leave a Reply

Your email address will not be published. Required fields are marked *