Download Handling Hyperlinks

Hyperlinks
Tech Tuesday
November 27, 2001
Lausanne Collegiate School
What is a hyperlink?
In a book, we
turn the pages
with our fingers.
 On the web, we
click on a word,
picture, or a
graphic to turn to
another page.
 Hyperlinks are
these pageturners!

Examples of Hyperlinks (in
red):
More Examples (in red):
Even pics
can be hyperlinks!
Why use hyperlinks?



Makes navigating
your page easier!
Helps your students
and parents focus on
what’s important to
them!
Allows you to put
more info, pics, etc.
on your pages!
Prerequisites to Hyperlinks
You have made a teacher web page
before
 You have created a main page in Word (do
not save as a web page yet)
 You have created a second page you want
linked to the main page
 You might have several pages to link to
the main page

Tricky Part:
Before you begin, make sure all your
pages EXCEPT THE MAIN PAGE are
already saved as web pages (with
.html at the end of their titles)
 Can name all these pages anything
(ducky.html, Octoberletter.html)
 Make sure your main page is NOT
saved as a web page but as a Word
Document!

To Begin:
This is the page you make every week. Just don’t sav
Index.html yet!!
Your Main Page
(December.doc)
Holidaypics.html
Illnessalert.html
Volunteerhelp.html
These are your new pages you want to link.
They ARE saved as web pages (see the .html).
Creating Hyperlinks
Open your main page in Word
(remember: it cannot already be
saved as index.html)
 Scroll to the bottom or where ever
you want the hyperlink.
 Type the word or phrase you want as
your hyperlink (ex.: Click Here for
Holiday Pics)

Creating Hyperlinks
Highlight the phrase or word you just
typed.
 Go to Insert>Hyperlink at the menu
bar up top.
 Click “Browse for File” and scroll
through your folders until you find
the file you need (ex. Holiday
Photo1.html)
 When you find the right file, click OK.

Creating Hyperlinks
On your main web page, you will see
that your word or phrase are now
underlined and in a different color.
 This tells you it has been
hyperlinked.
 Repeat this process for all your
pages!

Creating Hyperlinks
Once you’ve put all your hyperlinks
in your main page, save that main
page as index.html as usual.
 Open up First Class
 Open up Home Page Folder
 Delete anything in Home Page Folder
 Drag over your new index.html and
all other files you linked to it

Creating Hyperlinks
Your computer sometimes creates
folders (such as index_files) for all
linked pages
 You can create a folder inside Home
Page Folder (File>Folder>New
Folder)
 Put all your pages except index.html
in this folder
 Right-click on the folder, left-click on
Properties, type “index_files” as the
name), close the window, and save.

Check Your Work!
Go to your page on Lausanne’s web
site and click on every link to make
sure it works.
 If a link doesn’t work, go back to the
Word document and highlight the
non-working link
 Go to Insert>Hyperlink and make
sure the phrase links to the right file.

Did You Know?
All web page addresses must only have
numbers and letters in them.
 When naming your files, don’t add spaces
or punctuation (except for the underline
symbol).

Hot Tip:
Link to Your E-Mail!
Type your e-mail address on your
main page
 Highlight your address
 Go to Insert>Hyperlink
 Type this phrase in the blank
mailto:[email protected]
(be sure to put your first initial and
last name in place of mine!)

Hot Tip:
Help People Navigate Your
Pages
Once someone has clicked on your
second or eighth page, it can be
confusing as to how to return to your
main web page.
 Put a phrase, picture, etc. at the
bottom of each secondary page and
link it back to your main page (type
the address for your main page in
the blank under Insert>Hyperlink)

Hot Tip:
Link Cool Web Sites
My Quia Link


Do you use Funbrain, Quia, or other sites?
Type a phrase or picture and link it by typing the
web site’s address in Insert>Hyperlink.
Hot Tip:
Link With Pics or Graphics
Got a cool picture of your class, a
seasonal icon, or lynx mascot picture.
Use it as a link!
 Place the picture, click on it (little boxes
around the picture tell you it’s
highlighted), and insert the hyperlink.
 Notice that a hand replaces your cursor
arrow whenever you’re over a hyperlink!
Sounds like a test question to me!

Excellent Work!