Part III: Hyperlinks

In the last class you learned some basic HTML: how to apply bold text and italic text to your posts and comments. In this lesson we stay with the subject of HTML.

But before I get going, the answer to last time's question, which was: how to get angle brackets (< >) to appear on screen without being interpreted at HTML tags. The answer is to use escape sequences. These are special characters in HTML of the form &something; i.e. an ampersand (&) followed by a symbolic name of some kind, followed by a semicolon. Here are some examples.

Escape Sequence... Produces...
&pound;
&copy;
&lt;
&gt;
&amp;

A pound sign: £
A copyright symbol: ©
A less than symbol: <
A greater than symbol: >
An ampersand: &

So to get the display "<p>", you would write "&lt;p&gt;".

Hyperlinks

Right, let's get something straight. Creating a hyperlink is not called embedding, as I've heard many bloggers refer to it. It is called a hyperlink or just link for short. Embedding is something Giles Danforth likes to do with a meat skewer into his victims. So unless you want to become D8.5, please stop calling it that. You have been warned.

To make a hyperlink, you use the <a> tag. The 'a' is for 'anchor'. There are many attributes of the anchor tag that you can use. Some of them are required for it to work properly. Others are optional and are used to add extra richness or functionality. Here are some of the attributes.

Attribute Description Example Values
href

The hyperlink's referral. This is the place the hyperlink will actually link to, when selected.

The href attribute is required. The link will not work if it is missing or incorrect.

http://cloud-base.blogspot.com
target

The intended target (window) frame for the new page to be loaded into.

If target is not specified, then the page will be loaded into the same window as the one containing the hyperlink.

menu Use frame whose name is "menu".
_top Use the outer-most frame for the current window.
_blank Special case: create a new window (or tab) for the page to be loaded into.
title Text to display when the user hovers over the hyperlink with the mouse. Visit the Captain's blog...
name Used to name a bookmark. The anchor tag can also be used to bookmark places on the page, as well as link to other pages. MyBookMark

Still with me? Well how about some examples.

Code: Produces the following:
This <a href="http://novelracers.blogspot.com/">link</a> will load the Novel Racers blog page into the same window. This link will load the Novel Racers blog page into the same window.
Here is <a target="_blank" href="http://bookersatz.blogspot.com">another hyperlink</a>, which will open the Bookersatz page into a new window. Here is another hyperlink, which will open the Bookersatz page into a new window.
Here's a <a title="This will take you to facebook (in a new window) but you really shouldn't waste all your time on there!" target="_blank" href="http://www.facebook.com">link with a title</a>. Try hovering over it. Here's a link with a title. Try hovering over it.