Printable Version

What Is it? Target linking codes hyperlinks or "hotlinks" so that, when clicked, the change or "jump" is to a precise point on the same page where the link is located (internal target linking), or to a precise point on another page (external target linking). Whether jumping from one place to another on the same page (internal), or to a precise point on another page (external), two tags are used. The link tag is what we click to take us to the target point: <a href="#whatever">text or image</a> The target tag is like a bullseye hung on the precise point the link tag aims for: <a name="whatever">text or image</a> Internal Target Linking Clicking an internal target link jumps to a precise point elsewhere on the same page. That point must first be tagged with a target or "bullseye" for the link to aim for. For example, I have tagged the "External Target Linking" subhead below with the word "two": <a name="two">External Target Linking</a> Now that the section has been tagged, it can be jumped to from a link at any place on the same page...from here for example: <a href="#two">See External Linking Section</a> See External Linking Section Note that when internal linking, there is no need to use the entire page url with "#two" appended. Simply putting "#two" (or whatever the tag word is) in the <a href> code is sufficient. There is no limit to the number of internal links on a page. And they can be placed anywhere on a page and jump to anywhere on a page...up or down. They just must have unique tags. In this example, links are made to three image targets at the bottom of this page. And there are return links there to jump back up to this list. Image List Pic1 Pic2 Pic3 A common use of internal linking is to jump to alphabetical listings from an alphabet array of links at the top of the page. This page provides a demonstration. External Target Linking When we link to another page normally, the linked page opens at the top. The code for this standard linking looks like this: <a href="http://www.transload.net/~tyhart/ tytutes/bounce.html">Bounce</a> And the link works like this: Bounce My "Bounce" tute has a section about Bounce Bugs. To directly go to that part of the page, the Bounce Bugs section must be tagged...a bullseye must be hung on it for the link to aim for. The target tag word can be anything we choose. In this case I chose the word "bugs" and the target tag will be: <a name="bugs">link target here</a> So where exactly do we hang this target bullseye tag? We put it around text or an image that is at the top of the area of the page we want to go to. In my case, the page section has a subhead, Bounce Bugs, so I tagged the subhead with the target code: <a name="bugs">Bounce Bugs</a> Now that the section has been tagged, it can be precisely reached from a link on any remote page...this one for example...with a small addition to the normal page url. We simply add the target tag word, preceded by the # sign, to the end of the normal url for the page. Here's what it looks like. Click to see how it works: http://www.transload.net/~tyhart/ tytutes/bounce.html#bugs And to use the url in code to link to the section: <a href="http://www.transload.net/~tyhart/ tytutes/bounce.html#bugs">Bounce Bugs </a> And the link works like this: Bounce Bugs Back up to image list Or jump to Pic2 Back up to image list Or jump to Pic3 Back up to image list Please click to let me know you visited Send this web page to: Copyright � 1999 -   Ty_Tutes by Tyhart   All Rights Reserved