Links
Video Summary
Adding links to a webpage is done with the anchor tag. The general form is <a href="pagename.html"> clickable text </a>, where href stands for hypertext reference and is the destination page. Anchor tags work like any other text tag we've used, such as <p>, it just has an attribute.
Relative Link
Relative links are very similar to relative images. Again, the other pages will need to be in the same folder in order for this to work. For example, we could make a link to our homepage as follows:
<a href="index.html" > Click here to win the grand prize </a>
Notice that whatever comes after the > of the opening anchor tag will become part of the link. If you ever forget to close the anchor tag after your link text, your entire website will become part of that link.
Absolute Links
Absolute links will look the same, but instead of a local page you will take the address of an online page. Again, this will only work for online pages - if you
take the address for a local page with the file pathing C:/.... it will not work properly when you upload it.
An example of an absolute link that goes to our lab home page is:
<a href="http://www2.cs.uregina.ca/~cs100/" > Click here for lab page </a>
Making An Image The Link
You can combine an anchor tag and an img tag to make the picture the clickable link instead of text. Simply replace the clickable text with an image tag. It would look like this:
<a href="index.html" > <img src="horse.gif" > </a>
Lab Exercise
Add a relative link to your "index.html" page, and an absolute link to any page on the internet.