Without links webpages are pretty pointless. "Links" as the name suggests, are used to link one page to another.
Links are very easy to create in HTML so lets get started.
Links are very easy to create in HTML so lets get started.
1. First of all we need something to link to. If you feel that you need more practice in HTML then you can create a new page from scratch.
If not just copy the page you have already created and give it a different name, eg. "Page1.html"
Remember that you still need to be saving everything into the same folder.
If not just copy the page you have already created and give it a different name, eg. "Page1.html"
Remember that you still need to be saving everything into the same folder.
2. The HTML code for a link looks like this:
<a href="name of your page here">Text that you want the user to see here</a>
If you are linking to another website on the WWW then your link would look like this:
<a href="http://www.elpassobooks.co.uk">Visit El Passo Books</a>
For now though we are going to link your "index.html" file to your "Page1.html" file.
This is the code that needs to be placed in your "index.html" file
This is the code that needs to be placed in your "index.html" file
<a href="Page1.html">Click Here to go to my next page</a>
Have a look at the full code below to see where you should insert it:
<html>
<head>
<head>
<title>My Own Home Page </title>
</head>
</head>
<body>
<body bgcolor= "yellow">
<font color="Red">
<H1> I am Your-Name and this is my web Page!</H1>
<img src="images/myimage.gif">
<body bgcolor= "yellow">
<font color="Red">
<H1> I am Your-Name and this is my web Page!</H1>
<img src="images/myimage.gif">
<a href="Page1.html">Click Here for my next page</a>
</font>
</body>
</body>
TIP: Notice I have changed the background colour to yellow, this is because the default colour for a link in internet explorer is blue, obviously with a blue background the link is invisible
Here is what your page should look like:
When you click on the link you should be taken to "Page1.html", now for some practice at linking, why not try and put a link in "Page1.html" back to "index.html"
When you are satisfied with that, lets go to chapter 6 - Using Pictures as links.
0 comments: