Lesson 6: Linking



Your home page

Creating Websites home

   Introduction to the Web
   Introducing HTML
   Marking up text
   Setting Up
   FTP and FileZilla
   Links and anchors
   Getting some style

Intermediate topics
   Style sheets
   Testing and debugging
   Images and maps
   Audio and video
   Intro to JavaScript
   The DOM and scripting
   Logic and Arrays
   Functions and document.write
   Forms and INPUT
   Other controls
   Misc. topics
   HTML tables
   Structuring tables
   Scripting w/ tables
   Inline frames
   Loose ends

Another rich lesson, covering the fundamentals of linking within and between pages, on your site and other sites.

Along the way we find we can set up to send emails from a web page.

The following video lesson covers:


Note: I strongly suggest you view all our videos in full screen mode: click the icon in the lower right corner of the video area (it shows four arrows pointing to the corners of the screen). When you are done, the Esc ("escape") key returns you to regular mode.


Lesson 6: Links and anchors

Click here for the video transcript


Supplemental materials

    A cumulative summary of the contents of the course so far: Click here


Hands on exercise

For those who want to practice using what we cover in this class, the exercise for this lesson focuses on linking using the <a> element and displaying an icon by using the <link> element.

In your index.html, add a paragraph with a link (A element) to point to unirpt2.html. Test that the link works.

In your MyWebFiles directory are two files, roomdate.html and dateroom.html. Add links to these documents from your index.html file, something like this:

To schedule a room, either choose a room and find an available date or choose a date and find an available room

The first link should take you to roomdate.html and the second should take you to dateroom.html. Test these links work.

Add fragments to roomdate.html and dateroom.html as follows:

In dateroom.html include a fragment named top above the first line of the list, and a fragment named next_day above the second day's listing.

At the bottom of the document add a link to To top of page that points to the top fragment, and another link that points to the next_day fragment.

In roomdate.html include a fragment named top above the first line of the list and at the bottom of the page add a link to top.
In your index.html, add a link (<a>) that sets up an email to yourself and test it.

Exercise stretch 1 (time and interest permitting): add a link (<a>) that points to the file comingsoon.gif; this is an image file and the point is just to see how linking behaves when the target is not a document.

Exercise stretch 2 (time and interest permitting): add a link element to barney.ico and see how your browser uses it (if at all).


 Lesson navigation 




Email us if you would like additional information. We would love to see your comments and recommendations for our site.