1. Avoid general links. Instead of "click here" use something like "more information about San Francisco hotels". A link should give clear hints about what it’s gonna be found on the next page. Generic terms confuse users.

2. Include introductory information for related links. Give context to users making the first link in a group fully understandable. For example:

Read this report in English
This report in German
This report in Spanish

3. If the link is an image, provide a text equivalent that describes the message the image transmits. For example, for a link picture include the following "alt" attribute:

<A href="uk_cities.html">
     <IMG src="uk.png"
               alt="See UK cities on the map">
</A>

It is even better if the link works as an image description (example taken from News.com):

4. Providing keyboard shortcuts to important links will help users with problems to use a pointing device like a mouse. Remember that helping the impaired ones is helping everyone, in this case this feature could also help advanced users to save time. Use the accesskey attribute for this.

<A accesskey="E" href="edit.html"
     title="Edit">
         Edit</A>

5. Create a logical tab order through links.

6. Use language familiar to the user for links. For example some countries use "Shopping Cart" instead of "Shopping Basket".

7. Same links across a website should point to the same document. The "Support" link should take to the same page website-wide.

8. Differentiate links with similar names or meaning. For example, you might find "About Us" and "Company Info". In that case leave only one of those.

"Your website get a better reputation if it provides useful links and information…"

Consider having partner sites that could provide you with some content that you don’t have and offer them in exchange some links. Your website get a better reputation if it provides useful links and information. This is also a usability topic as this will improve service, customer satisfaction and the general user experience.

 


A bad example could be many newspaper websites, they never link to external websites. On the other side, News.com link to many resources around the web. For this reason News.com image is improve and users will likely trust them. Check here other Design vs Art articles about Links.

Use links, but don’t abuse.

"A common problem is that users do not understand where the link could go…"

It’s important to pay attention on the way these links are done. A common problem is that users do not understand where the link could go. On the example below, taken from News.com, it’s clear for most users that clicking on "struck licensing agreements" would link to an article about that. On the other hand, clicking on "Imeem", would take the user to the company’s website or to other news about it?

The New York Times goes one step forward making embedded links more understandable, predictable and user friendly. As the user hover over the candidates’ names in this politics article, the link label appears telling users that they would be taken to more articles about that candidate. Using proper link labeling improves usability and avoid confusion. (Mouse arrow is not displayed).

The above screen shot was taken from the Azalea Bed & Breakfast website, there you can see three different typography styles, the normal one, bold and brown. Would you tell me which one is a link? The answer is: none! Even worse, real links do not look like real links:

I can imagine users trying to click on the brown or bold words without getting any reaction from the website. This usability topic could be more important than most of the people think, users might wait for the site but if they don’t see that something happens they might think that the site does not work. And they leave.

Try not to play much with colors on your links, if possible, make them blue and underlined.