Articles Tutorials Work at Home Entrepreneurs, Webmasters, Small Business Owners
Articles Tutorials Work at Home Entrepreneurs, Webmasters, Small Business Owners
Articles & Tutorials for Work at Home Entrepreneurs
Webmasters and Small Business Owners
Get More >

Newest Articles 
Search Engine Marketing
Internet Marketing
Affiliate Marketing
Email Marketing
Viral Marketing
Webmaster Resources
Business Resources
Make More Money
CSS
Web Design
Graphic Design
Color Theory
Product Reviews
Time Management
Business Ethics
Promotional Strategies
Glossary of Terms
Direct Mail Marketing
Telemarketing
Product Sourcing



Link to Us!

Web Design
Email this article  :  Printer friendly page

When and How to Hyperlink To an Area On the Same Page

You know how to create a standard hyperlink, right? If not, here is a quick review:

Relative Path:
<a href="mypage.html">My Page</a>

Absolute Path:
<a href="http://www.yoursite.com/mypage.html">My Page</a>

But what do you do if you wanted to link to a specific spot on the same page? And in what cases would you want to?

I'll answer the latter first, because when I tell you how to do it, it will make more sense if you knew under what circumstances you might want to use this feature.

Why would you want to link to an area on the same page (called an anchor tag)? If you want to link to a specific location going from mypage.html to anotherpage.html. Rather than send your visitors to the top of anotherpage.html, you can be specific as to exactly where you want their browser to direct them on the page where you send them.

If your pages are long, you can break up the long-scroll problem by using the anchor tag. Place your section names at the top hyperlinked to the anchors you placed within specific areas in your source code. This helps your visitors get to the areas of a l-o-n-g page quickly.

When you want to link to a specific area on a page, you need to do two things.

State the exact location of the specific area in your HTML source code and name it. We named this location "gohere", but you can name it whatever you like that makes sense to you:

<a name="gohere"></a>

Then hyperlink to the area you called "gohere" by using the code below. Note that we used a # tag before the name of the specific location. This # character is called an anchor. This takes the place of a standard page name as shown in the absolute and relative path examples at the beginning of this article when link to a location on the same page.

<a href="#gohere">Go Here</a>

What if you want to link to a specific area on a different page? That's easy. Combine the two techniques. Your hyperlink code will look like this:

Relative Path:
<a href="anotherpage.html#gohere">Go Here</a>

Absolute Path:
<a href="http://yoursite.com/page2.html#gohere">Go Here</a>

Related Article: The Cure for L-O-N-G Web Pages

Copyright © 1994-2006 by BasicTips.com, a division of BasicTemplates.com, CSS HTML Web Site Templates with Exernal CSS and Removable Graphics. If you found our articles helpful, subscribe to our newsletter and get articles like this delivered to your inbox - FREE.

Order soon and get up to 5 FREE domains & more!
Host 6 Domains on 1 Account
5000MB and 400GB for $6.95 a month!

 

Page copy protected against web site content infringement by Copyscape
All articles are originally authored by BasicTemplates.com. Reprints in whole or in part are not permitted. See Copyright Notice

Copyright © 1994-2006 BasicTips.com, a division of BasicTemplates.com, Web Site Templates with External CSS
The Internet's #1 Choice for HTML CSS Web Templates via a Membership. Designed using External CSS and Removable, Swap-Out Graphics.
Basic Web Templates | Website Templates | HTML CSS Templates | Web Design Templates | Web Site Templates