Everything you need to know about submitting your newly built website to all of the major search engines, including links for submitting to Google, Yahoo, MSN and DMOZ (open directory project).
Read more »

Part of this topic is covered in my post Why does alt-text not show up in Firefox? which deals mainly with images, but the subject deserves it’s own post as using titles on links will help robots give links (and text) a higher priority when it comes to ranking the content of your web page.

As explained in my other post on alt text which you should read first, alt text is for browsers that have images turned off or for people who use screen readers and gives a brief description of what the image is, whereas the title text is what is supposed to be displayed when you hover over an image (or word, or link, or whatever you want to title), supplying additional information.

The confusion between alt text and title text is that Internet Explorer displays ‘Alt Text’ when hovering over an image, and all the good browsers (like Firefox, Chrome and Safari) don’t. Instead, the good browsers only display ‘Title Text’ over images.

How to ‘title text’ your links and text.

Try hovering over this link: www.worcestershirewebdesign.co.uk.

Now try hovering over this word: here.

The code for putting title text over a link is:

<a href=“http://www.worcestershirewebdesign.co.uk” target=“_blank” title=”Using title text over links“> www.worcestershirewebdesign.co.uk </a>

and the code for putting title text over normal text is either:

<p title=”Using title text on words”>here</p>

or:

<span title=”Using title text on words”>here</span>

NB: the <p>…</p> tags will start a new paragraph, as they are paragraph tags, and the <span>…</span> tags will allow you to title-text a word within a sentence.

The code above is in xhtml but works fine in plain, old fashioned, boring html (and if you are still using html, WHY?)

And now the benefits of using title text on links.

Our internet friends, the robots, sometimes have a hard time working out what is relevant and what is not on your web page. They take a good look at the meta data for the Title, Description and Keywords, and most of your page ranking comes from those three, in that order. Then your tags H1, H2, H3 (and so on) come in to play and finally your content.

You may have heard the expression “Content is King“… well it is. After looking at your meta data, tags etc., it is the uniqueness and relevance of your content that makes search engines sit up and take notice.

The robots don’t actually understand what you write, they’re robots after all, and artificial intelligence is still sixteen years away, but what they can understand is what you do to your content to make it stand out. They know what BOLD is, they know what ITALICS are, and they sure know how to read TITLE TEXT.

All of these tell robots that “Hey!, This text or link is just a little bit more important than all the rest.”

Will using Title-Text on links make your website jump from a PageRank 0 to a PageRank 7 overnight? Not in your wildest dreams!

What it will do is get you in the habit of doing the right thing for your website. As with most other methods of Search Engine Optimisation (or Optimization as my spell checker keeps nagging me), any gains are strictly long-term. With the Millions of websites and Billions of web pages out there, any slight edge your website has over it’s nearest competitors could mean the difference between hitting page one or page two of Google for a particular search query… and that difference is huge.

So using title text and other SEO techniques now could pay dividends for the future.

A final word of caution – don’t overdo it.

Robots may not be intelligent, but they can spot someone abusing SEO techniques a million miles away.

Related information and links.

Why does alt-text not show up in Firefox?

I hope you found this information useful and I welcome your comments. If you have any specific questions related to website development, please email me or post a comment.

Worcestershire Web Designer

So you’ve built your website, optimised it for search engines, sorted out your affiliate marketing and put your site live on the web. Someone comes along, sees your fantastic new site and decides that your well chosen affiliates are worth having a look at.  They click the link, make a purchase and you get that well earned 10%.

Well not always…

There are people who just strip the affiliate ID from the link so that you earn 0% but worse still, there’s software out there that can maliciously strip your affiliate ID and replace it with someone else’s so that when your well intentioned customer makes a purchase, your hard earned cash goes to someone else.  Sometimes the customer’s computer may unknowingly have the software on it, but other times the affiliate site itself might have been hacked.

So what can I do about it?

Protect your affiliate link. There are various ways to do this and I will discuss 3 here, but my personal favourite is using a PHP redirect.

In the three examples below, I’ll use the fictitious site and affiliate link of:

http://www.imaginarysalescompany.com?ref=joe99

www.imaginarysalescompany.com is the site, and Joe99 is the affiliate ID.  In all cases replace this link with your own affiliate link.

Option 1) PHP redirect.

Copy the following code into notepad or similar, remembering to change the link with your own affiliate link:

• <?php header( “HTTP/1.1 301 Moved Permanently” ); header(“Location:http://www.imaginarysalescompany.com?ref=joe99“); ?>

Save the file as php-redirect.php to your computer (the filename is not important but the extension .php is)

Upload the file to your own website

Then instead of using your affiliate link like this:

• <a href=”http://www.imaginarysalescompany.com?ref=joe99” >my affiliate link text</a>

Link to the php redirect file instead like this:

• <a href=”php-redirect.php” >my affiliate link text</a>

Your website must have PHP enabled for this to work, most websites do but if you are unsure, contact your web host.

Option 2)  Java script redirect.

Copy the following code into notepad or similar, remembering to change the link with your own affiliate link:

• <HEAD>
  <SCRIPT language=”JavaScript”>
  <!–
  window.location=”http://www.imaginarysalescompany.com?ref=joe99“;
  //–>
  </SCRIPT>
  </HEAD>

Save the file as java-redirect.html to your computer (the file name is not important but the extension .html is)

Upload the file to your own website

Then instead of using your affiliate link like this:

• <a href=”http://www.imaginarysalescompany.com?ref=joe99” >my affiliate link text</a>

Link to the java script redirect file instead like this:

• <a href=”java-redirect.html” >my affiliate link text</a>

Option 3) HTML ‘meta-refresh’ redirect.

Copy the following code into notepad or similar, remembering to change the link with your own affiliate link:

• <html><head>
  <meta name=”robots” content=”noindex,nofollow”>
  <meta http-equiv=”refresh” content=”0; url=http://www.imaginarysalescompany.com?ref=joe99“>
  </head>
  </html>

Save the file as html-redirect.html to your computer (the file name is not important but the extension .html is)

Upload the file to your own website

Then instead of using your affiliate link like this:

• <a href=”http://www.imaginarysalescompany.com?ref=joe99” >my affiliate link text</a>

Link to the html redirect file instead like this:

• <a href=”html-redirect.html” >my affiliate link text</a>

Are there other redirects available?

Yes. There are more variations of the above redirects, all with subtle differences, and there are also .htaccess redirects but these .htaccess redirects only work on Apache servers and if you mess things up you could block access to your website so always do a complete back up before trying to change .htaccess files.

You should never need to use anything more complicated than options 1 or 2 above for a simple redirect although option 1 requires your web host to support PHP, which most do.

Related information and links.

unsure how to link to a URL? visit w3schools.com for a full explanation.

I hope you found this information useful and I welcome your comments.

If you have any specific questions related to website development, please email me or post a comment.

Worcestershire Web Designer

I recently installed Firefox, but every time I previewed my website, hovering over the images produced no ‘alt text’.  It worked fine in Internet Explorer so why not Firefox?  Was something wrong with it?

It turns out the opposite is true, it is Internet Explorer that’s wrong for showing alt text in the first place.  Alt text is text information equivalent to the image’s content or function. It may be used when a human or a robot may want to use text instead of an image, or for people who view pages in text-only mode, or who are blind or visually impaired and use screen readers or for people who just turn off images. The alt-tag is an alternative for that image, hence the name.

Let’s see an example using my company logo:

The code for this is:

<img src=”http://worcestershirewebdesign.co.uk/blah…/blah…jpg” alt=”Worcestershire Web Design – quality, affordable websites” />

(I’m using xhtml in this example, but html works the same)

If you hover over this image in Firefox, Safari or Chrome, no alt-text appears, but switch over to Internet Explorer and the alt “Worcestershire Web Design – quality, affordable websites” appears.  Why? read on…

So what should ‘alt-text’ look like anyway?

Using the above example with my browser’s images turned off and as you can see, the ‘alt‘ text is displayed where the image would have been if I hadn’t have turned it off.

So how do I get the alt-text to appear in Firefox?

Apart from turning your images off, you don’t – you use a ‘title-tag’ instead.  Title-tags are the correct way to get text information to appear on screen when hovering over an image with your cursor, not alt-tags.  Title-tags are coded in the same way as alt-tags, but you just change the word ‘alt’ to ‘title’.

Using the same example as before:

The code for this now is:

<img src=”http://worcestershirewebdesign.co.uk/blah…/blah…jpg” title=”this is an example use of title text” />

If you hover over this image in Firefox now, the words “this is an example use of title text” appears.

So which tag is correct, ‘alt’ or ‘title’?

Actually, you should be using both just be aware of the different uses.

• Alt text: shown in place of an image to give people the equivalent of what the picture was, taking into account if the image has content or has a function (a photo of a horse shows content, a link-button image has function)

• Title text: shown to give an image, text or link some title text

Using the same piece of code again but this time with both alt and title tags:

<img src=”http://worcestershirewebdesign.co.uk/blah…/blah…jpg” alt=”Worcestershire Web Design – quality, affordable websites” title=”this is an example of title text”/>

Are there any other uses for title text?

Plenty. Try hovering over this word: here.

Now try hovering over this link: www.worcestershirewebdesign.co.uk.

The simple code used for getting title text to appear over a word is:

<p title=”Use title text on words”>here</p>

and again for a link:

<a href=“http://www.worcestershirewebdesign.co.uk” target=“_blank” title=”Or you can use title text over links“>www.worcestershirewebdesign.co.uk </a>

Many thanks to Florent V. for correcting some errors that were originally on this page.

Related information and links.

There is an excellent article on the appropriate use of alternative text at WebAIM.org which goes into much more detail. Definitely worth a look.

Not using Firefox yet?  download the latest version for free at http://www.mozilla.com/en-US/firefox/

Latest W3Schools figures show 47.5% of people now use Firefox http://www.w3schools.com/browsers/browsers_stats.asp

Figures from other sites show different statistics on browser usage so you may also want to check out: http://gs.statcounter.com/

I hope you found this information useful and I welcome your comments.

If you have any specific questions related to website development, please email me or post a comment.

Worcestershire Web Designer