html lessons : the a tag

The a tag, or hyperlink is essentially what the web is all about. Linking one document to another is what makes the world wide web go round and is what laid the groundwork for HTML to be written. That’s all great and dandy you say, but what does it mean for bloggers? So glad you asked!

As a blogger you spend half your time linking text and images to others’ work, your social networking sites, other blogs, etc. For example :

As you can see, the names Dennise and Bre are in between <a> and </a> tags ( in dark grey ) and are linked to two different sites. When you click on a name, you are taken to each site respectively.

You can also link pictures by surrounding the picture with the <a> and </a> tags. In the first example below, you’ll see just an image HTML code. In the second example, you’ll see that same image HTML code surrounded with a link code, as shown in dark grey.

BONUS TIP
Do you notice an annoying border around the images on your posts? When you click on your images do they lead nowhere except the same picture? If you don’t have a specific site or page to link your images to, then you need to remove the <a> and </a> tags from your images. Take this wordpress example ( in the HTML tab on your post editor ) :

The hyperlink is in dark grey in this example, and if you’ll notice, all it’s doing is linking back to the image itself. I see no need for this hyperlink so I’m gonna remove it by erasing the code in dark grey from above. Here is what the new code looks like :

When I publish my post, the image will have no annoying border and won’t link to anything and that’s just the way I like it. Click here to learn more about the a tag and what it can do.