Creating a hyperlink to a specific area in a webpage

You can specify a hyperlink to go to a specific area on a webpage (try it out). These types of links are often used on long pages when you want your user to quickly jump to another section on a webpage.

Create a target

you start by creating a destination for the jump link. Just like a normal hyperlink, you use the a tag. However, you use the name attribute not the HREF attribute.you should use a name that fairly simple and explanatory.

<a name="nextsection"></a>

This destination link should remain empty such as in the example above. If you wrap a tag around any text, the browser will render text that looks like a hyperlink. This will confuse your users and they will not understand why the link is not taking them anywhere.

Create the jump link

next, you create an actual hyperlink that points to your destination.  In your a  tag for the hyperlink you add the HREF attribute with a # and the destination name.

<a href="#nextsection">Go to the Next Section</a>

Jumping to a section on another page

you can also jump to a specific section on another page as long as there is a destination at that location. You simply create another hyperlink with the absolute URL and the #destination name appended to the end of the absolute URL.

<a href="http://en.wikipedia.org/wiki/Wikipedia:About#Contributing_to_Wikipedia">
How to contribute to Wikipedia</a>

Try it out here

Section jumping is a common tool on Wikipedia’s website to ease navigation around a long page.

jumplink
This entry was posted in Web Design and tagged . Bookmark the permalink. Follow any comments here with the RSS feed for this post. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">