Page 1 | Page 2 | Page 3 | Page 4 | Page 5 | Page 6
Now for "Linking"
Linking is when you click something... and it takes you to another page. You might click on text or an image. I will first show you who to create a text link.
Here is an example of a text link:
Notice that it is a different color than the text here. That is to tell your viewers that it is a clickable link.
When coding a link you add another color tag to your body tag like this:
<BODY BACKGROUND="http://YOUR_WEBPAGE_URL_HERE/myfile.jpg TEXT="pick a color" LINK="pick a color">
(I put the new part of the code that I wanted you to notice in red. When you code the link... it will be black like the rest of your code.)
Also, when coding a link you need to tell it what color you want the visited link to look like. Have you noticed while surfing the net that when you clicked a link on someones page and then went back and seen that it knew that you clicked on a link and changed the color? This is called Visited Link. If you click on the above example of a text link then hit the back button on your browser you will see that it has changed to purple! Try it... But get right back here! hehehe
To get the code to do that you need to add another component to the body tag like this:
<BODY BACKGROUND="http://YOUR_WEBPAGE_URL_HERE/myfile.jpg TEXT="pick a color" LINK="pick a color" VLINK="pick a color">
(Remember to select a hexidecimal color from the chat to put in the part that I typed in "pick a color")
Now you have a color for your link and your visited link. Now we will create the code in the HTML that tells the viewer where you want them to go.
This code is an example of a link to Disney:
<A HREF="http://www.disney.com/"> Disney Online</A>
Where you see the URL there to Disney... is where you would put the URL that you want your viewers to go to. Then where you see Disney Online, you would put the title of the link you want your viewer to see. And last but not least, do not forget to close the link tag with the </A>
The A stands for Anchor and the HREF stands for Hypertext REFerence.
Here ya go... another lesson to try out!
Untitled - Notepad |
File Edit Search Help |
<HTML> <HEAD> <TITLE>Using images</TITLE> </HEAD> <BODY BACKGROUND="http://YOUR_WEBPAGE_URL_HERE/myfile.jpg TEXT="pick a color" LINK="pick a color" VLINK="pick a color"> <H1>I can link you to another page on the net!</H1> <A HREF="URL of site you want to go to here"> Title of that site here!</A> <P ALIGN=center> Type in a little text here </P> </BODY> </HTML> |
Are we having FUN or what???? hehehe Well, let's try this!! How about a graphic to have
your viewers click on to take them to another place?
Yup! Thought you were shaking your head yes on that one!!
Well here we go!
To Create a Clickable Graphic you have to code your HTML to tell the browser to let a user click the graphic to send them on to your next page.. or back to your first page... or to your favorite pages!!
Here is an example of a "Linked or clickable Graphic"
<A HREF="http://www.disney.com"><IMAGE SRC="http://www.geocities.com/EnchantedForest/disney.jpg" ALT="Take me to Disney" ALIGN=center BORDER="0"></a>
*NOTE* See the BORDER="0" that tells the browser not to put a border on it. If you leave that part out, your link will still work.. but you will have a blue border on it... and if that is ok with you then leave that part out. Here are examples of 2 graphics linked to Disney, one with the BORDER="0" and one without. See for yourself which suits you. They are both clickable linked graphics.
Note that the first one has a blue border on it?Unless you been to Disney.com then it is purple. That is because I left off the BORDER="0" on this linked graphic tag. (In my opinion this looks just as good either way.. but there are graphics that a blue border like that would look terrible!)
The other linked graphic has the component BORDER="0" in the linked graphic tag that is why there is no border on it. I said 0 (zero) you can play with that BORDER number and add all kinds of neat borders to graphics, even those that are not linked!! Experiment!!
(Note!! You should get in the habit of looking at your page on other browsers other than
just yours... Netscape and MSIE read code differently and your pages may not look the way
you want them too... so check and tweak the codes until you are satisfied.. if you do not
have another browser to test them in... then send the page, once you load it to the net,
to someone that has a differenet browser than you have and ask them to check it out for
you.)