The homepage of your company’s website is your most valuable online real estate. Every year, millions are spent optimizing, promoting, and funneling traffic through this single page ̶ and for good reason. It’s your business' virtual storefront and face to the world. Because of this, it’s critically important to have an effective homepage that can turn more visitors into buyers .
Specifically, it’s vital to make sure your homepage contains as few leaks as possible. Because a homepage typically gets more views than any other given page, it needs to educate, engage, and encourage a large and diverse audience to explore the rest of your website. Quite often, however, unknown issues can contribute to high bounce rates and low conversion rates, and it’s those issues that can cripple your lead generation and sales goals.
Homepage Makeover: A Case Study
We talked to one company (which chooses to remain anonymous) in the software industry, which knew its homepage wasn’t up to snuff and needed to do something about it. While the company was successful in increasing site traffic year over year, its conversion rate remained below 2%, and its bounce rate was in the 70% to 80% range, compared to the industry average of 30%-50% . After receiving a marketing and website assessment , the company discovered its homepage did, in fact, contain major leaks. These leaks were caused simply because the page was missing must-have components that turn visitors into leads.
Shortly after, the company applied the 12 Critical Elements Every Homepage Must Have in a major redesign of its homepage, setting up an A/B test to verify the difference in performance.
What were the results? The conversion rate of the newly designed homepage increased 106% !
The new homepage (Variation B) outperformed the original design (Variation A) by 105.9% . A conversion rate of 3.4% is double that of the industry standard, helping to put the company at a competitive advantage. The best part of the redesign? It drastically increased the company's number of inbound leads , allowing the sales team to rely much less on cold-calling.
What Variables Caused the Increase?
There were many different changes to the homepage, but below are the three that had the most impact:
1. Clearly Answering Who, What, Where and Why
Before: While the original homepage did a good job outlining its five different product lines, it failed to guide visitors to the right product due to a lack of information. While I generally encourage the credo, “keep it simple, stupid,” this page was actually far too simple. 85% of the homepage's traffic was unique, meaning that the majority of visitors were unfamiliar with the company and its products. Visitors were unable to identify the difference between each product and which one to select. Second, there was little to no explanation of “why” the visitor should remain on the website. There was practically no mention of the company’s value proposition.
After: While the original version focused more on its products (and only its products), the revised homepage solves for “who, what, where, and why” above the fold . It is more focused on talking to the prospect, instead of the company just talking about itself. The company revised the headline and added a sub-headline and body copy to emphasis the benefit and value proposition (the original page only contained a vague headline, no sub-headline, or body copy). The new page content also then leads visitors to the products with a brief description of each product and links to learn more.
It’s important to prevent unsupervised visitor thinking by organizing the elements on your homepage to guide visitors in the right direction. This helps to decrease your bounce rate.
2. Include Clear Calls-to-Action for Lead Generation
Before: It’s important to give visitors different types of options depending upon where they are in the buying cycle. The original design laid out the five products in equal distribution, and because of this, visitors didn’t know what to do first. Even when a visitor clicked on one of the products, it brought them into detailed product pages where the only option for lead conversion was a “contact us” form. Not everyone who lands on your website is ready to be contacted by sales. Second, there was a very valuable whitepaper tucked away in the bottom left hand side of the homepage. Even though there was very little clutter on the page, the positioning of the whitepaper wasn't prominent. Furthermore, it was unclear what visitors would actually get by downloading the content.
After: In the new design, the company took its most popular whitepaper (previously hidden down in the corner of the page) and positioned it front and center with a strong headline and call-to-action . Knowing that the majority of visitors were unfamiliar with the company and its products, it used the whitepaper as a way to educate its prospects about its offerings, uniquely position the company in the market, and generate more leads. A big, red call-to-action is featured for visitors to download the whitepaper, making it clear what they are supposed to do first. A clear, secondary call-to-action is also used if visitors want to dive into the website to learn more about the business' products.
It’s important to isolate your primary calls-to-action within the main eye path and to guide prospects to your main conversion goals with as few distractions as possible.
3. Use Meaningful Graphics
Before: Each product line had an “icon” that was associated with it, similar to what you’d see with an iPhone app. The reason this was done is because the company sells database software; it’s intangible, and there isn’t really a clear picture of what it “looks like.” While it was a good attempt to give distinction and an identity to each product, the problem was that these graphics had no meaning to the audience and did not aide in guiding prospects to the right product.
After: Less emphasis was put on the icons, and instead, the image of the company’s most valuable whitepaper was used as the primary image. Since the company was promoting the whitepaper as the main call-to-action, it only made sense to use that as the image. Icons were still used alongside the products, but they were replaced with smaller images and worked with the product descriptions instead of overpowering them.
It’s extremely important not to use images for the sake of using images, especially when it comes to stock photos. Yes, images can help associate a concept, but images can also have a negative, sub-conscious effect if not used properly.
Once you have identified leaks and applied the must-have elements to your homepage, you too can see a great improvement in your conversion rates.
When was the last time you critically examined the effectiveness of your homepage?
Image Credit: Diana Parkhouse

Jon Nugent 1:40 PM on March 09, 2012
Did I miss how to do this with HubSpot. With HubSpot's web and landing page templates we're limited to what we can do unless we hire a web developer or designer.
I've approached HubSpot several times about uploading html templates to replace individual pages, including the home page but it's clear, the content management system (CMS) is limited in what can be done.
UK Greeting Cards 2:11 PM on March 09, 2012
I think your article is spot on it is so important to get your front page right as it is your main shop window to the world!
Johnny 3:36 PM on March 09, 2012
And in the case of an online store? The same principle...
Juan Gomez 12:35 AM on March 10, 2012
Yes, similar to Johnny, our e-commerce site needs sales not so much leads because we have plenty of visitors; new and recurrent.
Am I missing something?
How to convert visitors into buyers right now?
-When people visit the site.
Dimitris Patras 2:34 PM on March 10, 2012
@Juan Gomez , there is always the possibility, the brand and the website to be well designed and fully-functiontal but the product itself might not be attractive. You get the point.
Brian Mathers 6:33 AM on March 11, 2012
Such a topic as this is important and I can see the benefit of the changes made to the home page in this case study.
But as someone has said here, 'ecommerce' is the most challenging when it comes to page information architecture. I have found that with ecommerce, the home page needs both refreshed new content to promote the latest deals, but on that same page you also need to retain some 'core content' that expresses the 'primary proposition' of that web site. For example a site that sells car parts but it also sells replacement car parts. But the real challenge is deeper in the website. Now you have a page that sells an AIR FILTER, but this product fits possibly 50 makes of vehicle. Real SEO ecommerce and visitor experience combined is, how do you construct a unique page for the visitor of one vehicle who wants this AIR FILTER so that person gets the right information for the right vehicle and the page does must not experience a high bounce rate because the information on this page should relate to that person's vehicle. But what about another person with another vehicle type that can also have the SAME AIR FILTER. Now that is both a challenge for the visitor and the website developer. How do you prevent DUPLICATE CONTENT, but how do you give the visitor a POSITIVE experience so they land on the right page purely for THEIR VEHICLE?
Now there is an EBOOK to create?
Stephen 6:20 AM on March 12, 2012
Having just looked at the website of the company in the example above - why have they apparently reverted to using their 'old' design again?
Dan Ang 10:40 AM on March 12, 2012
Thanks for this article. It certainly has provided me with valuable insights of how to structure my call to action and headlines in my internet marketing blog.
To Success!
Dan