Chapter 1 Chapter 2 Chapter 3 Chapter 4

Hyperlinks ~ Chapter 2


What Are Hyperlinks? | Types of Links | Web Site Structure | Formatting and Stylizing | Review

What Are Hyperlinks?

quoteThe real point of the Web, of course, is that documents can be linked to each other, or to other types of files such as movies or sound clips, through the use of hyperlinks. These links allow authors to link documents together in intuitive ways, as opposed to traditional linear texts such as books, articles, or almost anything else printed.

Hyperlinks are embedded instructions within a text file that call another location in the file or a separate file when the link is accessed, usually by a click of a mouse.

Tim Berners-Lee of MIT invented HTML with colleagues from CERN (the European Particle Physics Laboratory) as a means of distributing linear text, called hypertext, to multiple points across the Internet.



Types of Hyperlinks

There are four types of links that you will be working with:

The simplest possible anchor starts with <a> and ends with </a>. However, you will never ever use the <a> tag by itself, because it doesn't do anything. You'll need to enhance the <a> tag with attributes like...

Using the id attribute, you can invisibly mark certain points of a document as places that can be jumped to directly, instead of loading the document and then scrolling around to find what you're after.

href is another valuable attribute of the <a> tag. href stands for Hypertext REFerence, which is another way of saying, "The location of the file I want to load."

Basic Format for Linking Internet Objects

There is a basic format for linking to Internet objects that includes the communication protocol, the separator, and the location of the Internet object.

example of web link

example of an email link

Download the Linking Other Internet Objects document to see examples of other types of Internet objects such as FTP servers and newsgroups.

Web Site Structure

Linear Structure

With a linear structure, each page is linked to the next and to previous pages in an ordered chain of pages. This is similar to the pages of a book.

linear Web site structure

With the linear structure, page 1 and page 2 are not linked together. The chain is straight and it does not create a loop.

Hierarchy Structure

With the hierarchical structure, general topic links to pages with specific topics and nonrelated specific topics are not linked together. Uses a home page as the main page.

hierarchy Web site structure

This is the most popular structure for Web sites. Regardless of whether you are creating local or external links, these links do not require a separate anchor like an internal link does.

Ex: <a href=”filename”>linking text</a>

Formatting and Stylizing

Practice: Create a Tuesday File

Directions: Follow the directions in the picture below. Download the source file here:Tuesdaytxt.txt.

instructions for practice

Assignment: Question for Thought 1

Directions: Describe the difference between local, internal, external, and email links. Give an example of when you should use one as opposed to the others. Type your response directly in the itsLearning text box. Do not attach a separate document but be sure you proofread.


Creating Hyperlinks

And here is my third video from the Introduction to Digital Technology course:

Practice: Creating Hyperlinks

Directions: In this assignment you will practice being able to create local, internal, external, and email links. Follow the directions in the image below:

assignment with hyperlinks

Assignment: The Chem Class Part II

Directions: In this assignment you will be creating a class web site for Mr. Davis, a Chemistry teacher.

Download the assignment sheet here: Chem Class Part II.

Dowload the source files here:contact.txt and links.txt.

Assignment: Leonhard Euler Biography

Directions: Professor Donna Coral of the Mathematics Department at Costal University in Beachside, Connecticut is preparing material for her course on the history of Mathematics. As part of her course, she has written short profiles of famous mathematicians. Donna would like you to use content she has already written to create several Web pages to be placed on the university’s Web server.

Download the assignment sheet here: Leonhard Euler Biography.

Download the source files here: euler.txt and euler.jpg.

Resources

If you are having problems viewing this page, opening videos, or accessing the URLs, the direct links are posted below. All assignments are submitted in itsLearning. If you have having problems, contact Mrs. Rush through the itsLearning email client.

HTML5 Tutorial Part 3: https://youtu.be/CGSdK7FI9MY

Mrs. Rush HTML 3: https://youtu.be/J-ECUOPLNHw


Credits

Man: http://vectorcharacters.net/


Transcript of this lesson