WyzGuys Computer Tutors

 Computer Instruction. Web Design Instruction,  and Web Hosting 

 

Adding Hyperlinks

 

Site Navigation

Home
Student Registration
Class Resources

Day One

Introduction
Student Sites
Web Structure
Computer Settings
Site & Pages
Explore FrontPage
Web Site Wizard
Shared Borders
Web Page Themes
Page Header
Adding Text
Homework 1
Web Hosting 101
Web Site Design
Home Page Design

Day Two

Introduction
Your Home Page
Adding Pages
About Us Content
Add More Pages
Deleting Pages
Navigation
Link Bars
Custom Link Bars
Hyperlinks
Adding Hyperlinks
Hyperlink Exercise
Publishing
Copy Your Site
Homework 2

Day Three

Introduction
Bullet List
Numbered List
Tables
Table Uses
Create Tables
Graphics Intro
Image Sizing
Photo Editing
Adding Graphics
Photogalleries
Gallery Tool
Saving Images
Adding Music

Day Four

Form Wizard
Custom Form
Form Exercise
Form Properties
Web Components
Add a Map
Add Search Box
Marquee
Buttons
Hit Counter
Split & Code View
On-Line Sales
PayPal Buttons
Building Traffic
Meta Tags
Search Engines
Appendix & FAQs
Adv Techniques
Interactive Web
Conclusion
Evaluation

We use and recommend

for your on-line transactions

Hands on Practice - Hyperlinks

Hyperlinks are the secret sauce of the Internet, and provide an easy way to move from page to page and site to site.  This web site contains about 6300 hyperlinks, if you can believe it.  Almost 600 links go to external sites, the other 5700 provide navigation within the site.  While total numbers are not important, this gives you an idea of the importance of hyperlinks to your web site.  Remember, the Navigation Bars we just designed are in fact a version of hyperlinks.

If you are linking to another web site, you don't want to lose your visitor.  Set up the link to open a New Window by using the Target Frame button.  This will cause a new instance of Internet Explorer to open to display the other web site.

Lets add some hyperlinks.

E-mail Hyperlink in the Page Footer

Lets return to the Page Footer and add an e-mail hyperlink to contact our webmaster.  This would be you, of course.

  • Place your insertion point in the bottom Shared Border, and click on the Centering button.

  • Type the words "Contact our webmaster about this site."

  • Highlight the word webmaster, right click, and select Hyperlink from the context menu.

  • When the Insert Hyperlink dialog opens, select E-mail Address from the left column.

  • Type your e-mail address in the E-mail address box. FrontPage will prepend your typing with the words mailto: There should be no space between mail and to.

  • If your e-mail address appears in the Recently used box, just click on it to insert it.

  • Add a Subject line. This populates the subject line of the visitor's e-mail.

  • Click OK.

Internal Hyperlink

Lets create a hyperlink to the Product page in our site.

  • Go to your Home Page.  Place your insertion point in the body area. 

  • Type something like "Check out our fine products."

  • Highlight the word products, right click, and select Hyperlink.

  • Select Existing File or Web Page from the left column.

  • Select your Products page from the list, and it will appear in the Address box.

  • Click OK.  This will create an internal link to your Products page.

Internal Hyperlink to a Bookmark with a ScreenTip

Here we go, something a little more complex.  If you have ever seen hyperlinks that return you to the top of the page, we are going to learn how to create them now.  We are also going to add a ScreenTip.  There is nothing to prevent you from creating a ScreenTip for all your hyperlinks, and it does create a little more interactive interest for your visitors.

 

  • Open your Home Page and select a word at the top of the main body.

  • Select Insert, Bookmark.

  • In the bookmark dialog, change the Bookmark name to Top.  FrontPage will not allow you to leave spaces in multi-word names, use the underscore or leave no spaces.

  • Other bookmarks, if you had them, would appear in the center section of the dialog.

  • Click OK.

 

  • Go to the bottom of your Home Page and type the words "Return to the Top."

  • Highlight the words you just typed, right click, and select Hyperlink from the context menu.

  • Select Place in This Document from the left column.

  • Select the bookmark named Top.

  • Click on the ScreenTip button.  The Set Hyperlink ScreenTip dialog opens.

  • Type Return to the top of the page, then click OK.

  • Click OK on the Insert Hyperlink dialog.

Change your view to Preview, and Scroll to the bottom of the page, and hover your cursor over the hyperlink.  The ScreenTip balloon will display.  When you click on the hyperlink, you will jump back to the top of the page.

External Hyperlink to Another Web Site

There will come a time when you will want to link to another site.  It may be the site of a manufacturer or supplier you work with, or it may be a link to an article about your company that appears on another web site.  We will add an external link now.

  • Go to the bottom Shared Border of your home page again, place your insertion point behind the existing text and press Enter to create a new line.

  • Type "Hosted by WyzHost.com."

  • Highlight what you just typed, right click, and select Hyperlink.

  • Select Existing File or Web Page from the left column.

  • Type http://www.wyzhost.com in the Address box.

  • Click on the Target Frame button.  The Target Frame dialog opens.

  • Select New Window from the options, and click OK.

  • Click OK in the Insert Hyperlink dialog.

This will create a hyperlink that opens a new instance of Internet Explorer before taking the visitor to the other web site.  The importance of this is:  you never want to lose your visitor by directing them away from your site.  Your site remains open in the other IE window, so your visitor can return easily.

 

Back To Exercise Next

 

Curriculum developed by WyzGuys Computer Tutors

All Rights Reserved - updated 12/07/2006

Hosted by WyzHost.com

contact support@wyzhost.com