Home > ramiro's blog > Linking the Logo to the Home Page with JavaScript

Linking the Logo to the Home Page with JavaScript

The logo of a Web site is not only important for branding but also as a navigational element, that many users expect to link to the home page. According to usability guru Jakob Nielsen the first of Ten Good Deeds in Web Design you can do is link your logo to the home page except you are on the home page.

Mr. Nielsen conducted many usability studies and has written groundbreaking articles and books on Web usability. Good reason for me to trust him when it comes to this topic, especially when it sounds completely plausible.

Why Linking with JavaScript?

There are many parallels between creating a usable and creating a search engine friendly Web site, but often enough you need to take subtleties into account. According to Rand Fishkin — let me call him the Jakob Nielsen of SEO — only the first anchor text counts for Google and he is not the only SEO expert who observed this.

On Linux-Netbook.com, a Drupal site I created a few months ago, the site logo did not link to the home page in favor of the site name, which appears later in the HTML source. I have no evidence and not tested whether anchor text is more important than ALT text, but that was my reasoning.

To fix this usability crime without sacrificing my SEO efforts, I added the following 5 lines of jQuery code to the theme's script.js file:

jQuery(function(){
  if (document.location.pathname != Drupal.settings.basePath) {
    jQuery('#logo').wrap('<a href="' + Drupal.settings.basePath + '"></a>');
  }
});

This code links the image with the ID logo to the home page unless we are on the home page, provided the user agent interprets JavaScript.

I assume that Google's engineers are smart enough to make Googlebot understand this JavaScript snippet, but I guess it does not play a role in the which link comes first game. In case it does, the ALT text contains the site name as well.

SEO Tools to Help Your Rank Higher
Well said keep posting similar to these small things which are unnoticed by people :)

Thanks for your feedback! I'll keep on posting simple things ;)

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <p> <br> <img> <h2> <h3> <h4> <h5>

More information about formatting options

Type the characters you see in this picture. (verify using audio)
Type the characters you see in the picture above; if you can't read them, submit the form and a new image will be generated. Not case sensitive.