Review – Homepage Usability – 50 Websites Deconstructed

Share this article

In our world of information overload, frustration sets in quickly and patience runs thin. The Web only makes things worse. With slow modems, confusing link labels, poor navigation, and technical glitches it’s no wonder that most ecommerce transactions aren’t completed and that most homepages are abandoned.

But, regardless, it’s your job to navigate around technical obstacles, manage overly creative Designers who want to use 250K Flash intros, and curb the egos of managers who seriously believe that your site’s visitors actually care about your company.

The online world is tough. Fail to deliver in any department, and your visitors will head to the competition. Succeed, and you’ll be a hero. “Homepage Usability — 50 Websites Deconstructed” by the outspoken, self-proclaimed guru, Jakob Nielsen, this time paired with Marie Tahir, is all about making a good first impression.

The book itself definitely does. Unusually big, heavy, and running to over 300 pages, it’s packed from cover to cover with great looking color and graphics.

An Easy-To-Follow Format

Three main sections make up the book:

  • Homepage Guidelines (113 in all)
  • Homepage Statistics and Convention Recommendations
  • 50 Homepage Reviews

The first two sections are extremely useful, and are, on their own, worth the $39.99 price tag of the book. Quick to read, they present an excellent checklist that’s easy to apply to any design project.

I personally found the information in these first two sections more useful than Jakob Nielsen’s other book, “Designing Web Usability” which was very theoretical. The only way to make good use of that book is to manually go through over 400 pages and highlight the do’s and don’t and then flip through the book for each site that you design in order to make sure that you comply with the usability principles.

Fortunately, that’s not a problem with this book. The first 50 pages lay out the principles, and the other 250 show them in action.

Homepage Statistics and Convention Recommendations

The extensive statistics on the 50 reviewed Websites provide a clear picture of the conventions that are commonly used on the Web. For example:

  • 84% of sites place their logo in the upper-left
  • 35% place search in the upper right, 30% in the upper left
  • The median page width is 770 pixels, and a “liquid” layout is recommended
  • “Jobs” is a term which should be included in the label for the employment information section
  • 60% of sites have an explicit contact page, while 22% make that info available through their About Us link

It’s very obvious from the book that some major conventions on how things are done, and the way certain features are labeled, have emerged from the plethora of sites now online. It only makes sense that your site stays in line with what others are doing, in order to avoid frustrating visitors — and this book provides those guidelines in a clear format that’s easy to use.

The book obviously goes into much greater detail on each of the statistics and guidelines, which range from “Never animate critical elements such as logos and headlines” to “Don’t offer a ‘Search the Web’ feature from the site’s search function”. Unfortunately, though, no research is provided to back any of these points up.

50 Homepage Reviews

While 50 homepage reviews sounds like a great number, in practice they become quite tedious to read. The authors must be given credit for having the courage to tear apart even the largest sites, among them Yahoo!, eBay and CNET.

Nevertheless, after the first dozen or two reviews you’ll get the gist of process and how the guidelines listed at the beginning of the book apply in the real world.

The biggest flaw of the reviews themselves is that many of the points stated are based on opinion rather than fact. The flaws aren’t rated on any sort of scale, nor are their impacts on the sites qualified in any manner. With over 1100 design “flaws” being pointed out throughout the book, it takes a lot of energy to read them all, especially without any categorization scale.

On a positive note, two screenshots of the site are presented in each review, one with numbered “errors” and one without. After a while you can test yourself and try to spot as many mistakes as possible before flipping the page for the answers. Hey, with enough practice you too will be able to charge $10,000 US for a homepage review…

Before I wrap this up, I should mention the Appendix. It compares the top Websites, side-by-side, including: their Window Title, Tagline, use of screen real estate, logos, search boxes and more. In just a few pages, you get a very thorough overview of the universe of homepages.

Now, rush on over to Amazon and pick yourself up a copy at a nice discount and put it on your bookshelf right along “Don’t Make Me Think”.

Rating: 4/5

Frequently Asked Questions about Website Deconstruction and Homepage Usability

What is website deconstruction and why is it important?

Website deconstruction is the process of breaking down a website into its individual components to understand how it works, its design, and its usability. This process is crucial as it helps in identifying the strengths and weaknesses of a website. By understanding these elements, one can make necessary improvements to enhance the user experience, increase engagement, and ultimately, drive more traffic to the site.

How can I improve the usability of my homepage?

Improving the usability of your homepage involves several factors. First, ensure that your site loads quickly as users tend to abandon sites that take too long to load. Second, make your navigation intuitive and easy to understand. Third, use clear and concise language that your audience can easily understand. Lastly, make sure your site is mobile-friendly as a significant number of users access websites through their mobile devices.

What are some common mistakes in website design?

Some common mistakes in website design include cluttered layouts, poor use of color and contrast, lack of mobile optimization, slow load times, and complicated navigation. These mistakes can deter users from visiting your site and negatively impact your site’s performance and ranking on search engines.

How does website deconstruction help in improving SEO?

Website deconstruction can significantly improve SEO by identifying areas of improvement. These could include optimizing meta tags, improving site speed, enhancing mobile-friendliness, and ensuring that the site is easy to navigate. By addressing these issues, you can improve your site’s visibility on search engines and attract more organic traffic.

What are some best practices for homepage usability?

Some best practices for homepage usability include having a clear and concise headline, easy navigation, a clean and uncluttered design, and a strong call-to-action. It’s also important to ensure that your homepage is mobile-friendly and loads quickly.

How can I make my website more user-friendly?

To make your website more user-friendly, focus on creating an intuitive navigation system, use clear and readable fonts, ensure your site loads quickly, and make your site mobile-friendly. Also, provide valuable and relevant content that meets the needs of your users.

What is the role of color and contrast in website design?

Color and contrast play a crucial role in website design. They help in creating visual interest, guiding users’ attention, and enhancing readability. Using the right color and contrast can also evoke certain emotions and reactions from your users, influencing their perception of your brand.

How can I ensure that my website is mobile-friendly?

To ensure that your website is mobile-friendly, use responsive design techniques that allow your site to adapt to different screen sizes. Also, make sure that your site loads quickly on mobile devices, and that the text and images are easily readable and navigable on smaller screens.

How does website deconstruction contribute to better user experience?

Website deconstruction helps in understanding the user journey and identifying any pain points or obstacles that users might face. By addressing these issues, you can create a smoother and more enjoyable user experience, which can lead to increased user engagement and conversion rates.

What are some tools I can use for website deconstruction?

There are several tools available for website deconstruction, including Google’s PageSpeed Insights for analyzing site speed, Mobile-Friendly Test for checking mobile optimization, and various SEO tools for identifying areas of improvement. Using these tools can provide valuable insights into your website’s performance and usability.

Matt MickiewiczMatt Mickiewicz
View Author

Matt is the co-founder of SitePoint, 99designs and Flippa. He lives in Vancouver, Canada.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week