Replace Named Anchors With IDs

Replace Named Anchors With IDs

I just found out a simpler way to have named anchors for browser to jump to a particular location on a web page. It is not a new way, but it is a way that some developers might not be aware of.

[generic]
This one’s dead simple, but it’s something I still see developers who have been writing HTML for a long time get wrong. If you want to provide links to particular spots within a page (e.g. http://www.sitepoint.com/#news), you don’t need to fill your HTML code with tags – just use the id attribute on the elements you already do have!

In the past, if you wanted to provide a link to the ‘News’ section of your page, you’d have to do something like this:

News

These days, all browsers support in-page links based on the id attribute as well as the old-fashioned tag. So instead of the above, you can just do this:

News

A link to “#news” in this page will find either of the above example headings, but the second one is a lot neater, and also gives you the ability to apply styles to to heading based on its unique identifier if you need to.
[/generic]

Leave a Reply

Your email address will not be published.

My new Snowflake Blog is now live. I will not be updating this blog anymore but will continue with new contents in the Snowflake world!