• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Lesson 3. Creating Links

Lesson 3. Creating Links

The power of HTML comes from its capability to connect regions of text and images with other documents. The browser may highlight these regions (usually with color or underlines) to indicate that they are hypertext links—links that are not required to be sequential or linear, often called hyperlinks or links. A link in HTML has two parts: the name (or URL—Uniform Resource Locator) of the file to which you want to link; and the text or graphic that serves as the clickable area, called the hotspot, on the page. When the user points to the hotspot and clicks it, the browser uses the path of the link to jump to the linked document. In some browsers, the path of the link is displayed in the status area of the browser window (bottom left part of the window) when the pointer is positioned over the link.

In this project, you will create text and graphic links to pages within this site as well as to other Web sites.

In this lesson, you will create text and image links on a Web page, add hotspots to an image to make it an image map, and link to named anchors within a page.

To see an example of the finished pages, open Lesson_03_Links/Completed/intro.html for the text and graphic links, profiles.html for the named anchors, and ca_lights_map.html for the image map.

WHAT YOU WILL LEARN

In this lesson, you will:

  • Specify link colors according to the link type

  • Create text and graphic links

  • Create email links automatically and manually

  • Use anchors to jump to different parts of the page

  • Create image maps to provide multiple links in the same image

APPROXIMATE TIME

This lesson should take about one hour to complete.

LESSON FILES

Media Files:

Lesson_03_Links/Images/light_resources.gif

Lesson_03_Links/Images/more_lights.gif

Lesson_03_Links/Images/CAmap_full.gif

Starting Files:

Lesson_03_Links/intro.html

Lesson_03_Links/profiles.html

Lesson_03_Links/ca_lights_map.html

Completed Project:

Lesson_03_Links/Completed/intro.html

Lesson_03_Links/Completed/profiles.html

Lesson_03_Links/Completed/ca_lights_map.html


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint