Linking an Image

You have all heard the term 'link back' often I'm sure. You may be linking back to the site you got your backgrounds from, or a friends site who just sent you a beautiful card or an adoption.

Ok, now we want to tell the image where we want it to go when we click on it :)

Once we have inserted our image, checked to see that it is there and where on the page we want it, as well as its size, let's take it one step further.

This is my image...

Ex: <img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200"> Tip: if we put in the wrong size you will quickly know it. It will be grossly disfigured.

In front of the image code, we are going to put the link code in.

Place your cursor just to the left of your image, and put in the link.

Ex: <a href="http://karmaskorner.com/"><img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200">
If you check it, you will now see a funny border around your image. We don't want that so we add one more element to our image code. <img src="http://karmaskorner.com/misc/bears.gif" width="300" height="300" border=0> When we give this attribute to the image border=0 it tells the computer we do not want a border around this image.

There is one more attribute I like to add to any image I am using, and that is the alt="Bears"> Ex: <img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200" border=0 alt="Bears"> I normally use the alt on a link back so when your cursor is run over the image you will see where it is going to be linked to.

Now I will add the alt into my equation. I want people to know the link is going to take them to Karma's Korner. Ex:<a href="http://karmaskorner.com/"><img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200" alt="Karma's Korner"> Now people will know exactly where they will be going when they hit on the image. Some people will put alt in for all images. I only use it on linked images.
Now, I had said earlier that an image code does not need to be closed. Except when it is linked. We need to turn off the link. So just as in entering a link tag and closing tag, we need a closing tag here. Ex: <a href="http://karmaskorner.com/"><img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200" border=0 alt="Karma's Korner"></a>
If we did not close out that link tag anything under the image would be linked.
So now, if I want my image in the center, and I want to link it back it would look like this: Ex: <center><a href="http://karmaskorner.com/"><img src="http://karmaskorner.com/misc/bears.gif" width="300" height="200" border=0 alt="Karma's Korner"></a></center> You may want to copy that ex: into note pad and save it.

If you have any questions at all, feel free to email me at :
kkdesigns11@hotmail.com