Home
Member List
Agenda
Educ Material
Free Services

Lesson 2

OBJECTIVE:
Use Links Outside and Inside of your Website and Email Links

Every Link needs the following 4 parts:
  1. Open the Anchor tag: <a>
  2. Spell out the Destination. This part will be invisible to the visitor: http://www.oocities.org/dotcom4webs/
  3. Spell out the text the visitor will see underlined: DotCom WebSite
  4. Close the Anchor tag: </a>
Example:
"This lesson can be found on the DotCom WebSite". Hover over the underlined text and read the link destination at the lower left corner of your screen.



Links outside and inside your website:
The only difference in the code between a link that resides outside vs. inside your website is in the amount of information that is needed on the destination part of the code.

  • Outside the website: If you link to a page that is outside your website, you will need the entire URL:
    e.g., http://www.oocities.org/dotcom4webs/ or http://www.yahoo.com/

  • Inside the website: If you link to a page that is inside your website and in the same folder as the page that displays the link, all you will need is the complete filename:
    e.g., lesson2.htm or index.html

  • Links in the same page: If you need to link to another part of the same page that displays the link, all you need is a pound sign followed by a word that marks the spot where you want to jump.
    Notice that the following code, Return to Top, sends you to the top of the page. Compare the code for the link (line 78) and the code for the target (line 22).
    On line 78 of the code (this is line 80), notice the pound sign and a label to mark the spot where we want to jump.

    The link and the target can be placed anywhere that you need them.
    Link that the visitor sees and clicks (code line 78):
    <a href="#top">Return to Top</a>
    Target that the visitor will jump to (code line 22) after clicking the link:
    <a name="top"></a>

    Let me show you an example of how great this is by illustrating a MENU.

    Sections of Lesson 2
  • Parts of every link
  • Explanation for an outside link
  • Explanation for an inside link

    You can see the same effect by clicking on the links on the "Objective" of this lesson.



Email Links:
  • Open and close the anchor tags as before
  • Destination must take the following format:
    <a href=mailto:csclark@calweb.com >
  • Underlined text should clearly indicate that it is an email address: csclark@calweb.com
Example:
Send your comments to the webmaster at csclark@calweb.com
Review the code to verify how simple this is.