Importance of a Website's First Impression

When meeting new people, first impressions are very important. If someone looks dangerous you're unlikey to go to talk to them, although he may in fact be totally harmless and highly likeable. The same principle applies to websites and in this article we shall do a case study on a popular guitar related website, GuitarProTabs.org.

Background Information

GuitarProTabs.org is a website that allows visitors to share files for a popular guitar tablature software, Guitar Pro 5. It was launched in December 2006 and since then had never had a design change. We were given the task of completely redesigning the site from the ground up. We were given this task in December 2009, and the new site went live on the 6th of January 2010.

One thing to note before reading on is that we are dealing with an established site with a steady flow of traffic - the changes seen in crawler statistics for example is not due to any other factor, other than design changes.

The Original Design

The original design was something that was coded when the website was first launched, which was meant to be an clean & attractive design. It actually failed in both of these terms as the design was not attractive, and although it was clean when first designed, it got very cluttered as advertisements were added as years went past.

As the site received anything between 3,000~4,000 unique visitors a day, it was decided that the website should be improved to take full advantage of this traffic.

The New Design

One aim for the new design was to create a clean, intuitive and easy to navigate website that enhances the visitor experience. Our other aim was to work on building a community spirit, to encourage visitor loyalty, user submitted content and awareness.

We therefore came up with this 2 column design, which included many major changes:

• We added a membership area.
• We added an Addthis button to increase the chance a visitor shares a page with their friends.
• As adverts were always going to be a part of this website, they were taken into consideration in the designing process, which allowed for the adverts to blend into the website and compliment the website's design.
• A sitewide alphabetical menu was added to increase accessibility.
• A top 10 most downloaded artists list was added to encourage visitors who entered through the homepage to stay longer on the site.
• A 10 newest tabs list was added to aid search engines find new pages.

We also made various changes behind the scenes to help make it a little more search engine friendly:

• The site had always been using mod_rewrite via an .htaccess file but felt that it could do with a little improvement. We therefore changed the format of some of the URLs.
• The 2 columns are actually coded so that the right hand column, i.e. the content, is higher within the HTML code. This helps crawlers determine what information is important on the page.
• Improved cross-linking within the site, e.g. we added bread crumbs.
• We discovered that the site did not yet have a sitemap. We therefore added a sitemap and submitted it to Google Webmasters.

The Results

The changes we made to the site showed immediate results. While the traffic to the website remained the same we noticed the following:

• Page Views - There was a 41% increase in the number of page views from an average of 17,000 to 24,000 page views a day.
• Bounce Rate - The number of visitors leaving as soon as they land on the homepage was reduced from 20% to 15%.
• Google Crawler - There was a phenomenal increase in the Google crawler activity. The number of indexed pages has already more than doubled, since the change was made a month and a half ago.

The following screenshots show various aspects of the site spanning the period 2 weeks before and after the new design was applied to the live site:

Visitors

Average Page Views Per Visitor

Bounce Rate of the Homepage

Google Crawler Stats