Headed to INBOUND '16? We'd love to connect with you!  Meet With New Breed

New Breed Blog

Get Blog Updates

B2B Website Design Tips: Creating an Effective Homepage Narrative

Peter Emerson
Dec 3, 2015 9:00:00 AM  |  Peter Emerson

b2b-website-design-homepage.jpg

This time of year businesses are pulling out all the stops to create exciting window displays. As a B2B business, you most likely don't have a physical storefront that potential customers will walk past or have the chance to peer into to see what you offer. Instead, this responsibility is shifted to the homepage of your website as the first view through the "store window" to see what's inside.

Just like a retail store, the storefront isn't the be-all end-all of the business. The value or sophistication of your product isn't predicated on it, and it doesn't represent all the aisles that are held within it, similarly to the different core sections of the rest of your website. However, the homepage is critical to conveying your value proposition and creating a narrative that visitors want to learn more about, getting them to a second page of your site.

Download our free eBook to learn the 10 essential elements of a successful  website redesign.

How to create and include a homepage narrative for your B2B website design

Your homepage should create a customer-centric narrative about how your business is uniquely positioned to solve a specific need. To do this, you need have a crystal-clear understanding of your audience and the messaging that it will relate to. You must create a homepage user experience that features only the necessary information to get your visitors to engage further.

Nail the value proposition (Why)

Simon Sinek gave a great TED talk where he discussed how to "Start with Why," using a framework he calls the golden circle (we've also written more about this concept here):

golden-circle.png

Photo Credit: Tom Humbarger

The key takeaway is that great companies don't sell what they do, they sell why they do it. This concept can be translated really well to the narrative of your website homepage. Your homepage header should start with that why statement.

A great example of this is InsightSquared. You can see that its headline messaging isn't talking about business analytics software. Instead it tugs the heartstrings of the sales executive who can't stand to open another single Excel spreadsheet with next month's pipeline numbers:

insightsquared-homepage-header.png

Differentiate your business and build trust (How)

Now that the "why" has been established, it's time to give your website visitors a taste of how you do it, while also balancing this with the user-centric WIIFM (What's in it for me?) approach that is critical for success. This can be accomplished in a few key ways. Test and iterate to find what works best for your business.

The first is by graphically explaining how you accomplish the bold claim you just made. Xively does this really well:

xively-homepage-challenge.png

The second is by discussing the outcomes that your solution enables. Desk.com offers a great example of this: 

desk.com-outcome.png

 Finally, in illustrating the "how" of your business, you should also demonstrate how you've accomplished this for customers in the past to help build trust via testimonials or case studies. See how Bizible has accomplished this:

bizible-testimonial.png

Say what you do (What)

Your site visitor is hooked, and you have clearly conveyed the value proposition of the company, built trust, illustrated the outcomes your company can support and shown evidence of previous accomplishments. It's time to address your products. Just like a window storefront, you don't want to give away everything your company offers. Rather, you want to support the subheader copy and state what you do clearly and simply.

Again, we'll turn to Xively as an example here:

xively-product-example.png

This business didn't dive into the nitty-gritty of the platform or talk about any technology and specs. Instead it has illustrated its solution with minimal copy and offered a path to learn more about the product.

Get started (Why again)

Just like The Hobbit, every great story goes there and back again. Now that you're nearing the end of the homepage it's time bring the attention back to the visitor, revisit your value proposition and show the next step that a visitor should take at this stage.

This is generally done by highlighting a bottom-of-funnel conversion opportunity. Domo has done this nicely:

domo-demo-request.png

There you have it, you've taken your homepage there and back again, creating a narrative of which even Tolkien would be jealous. Wrap things up with a footer that highlights additional resources and illustrates the main navigation, and you're well on your way to having a sales-ready homepage.

new-breed-marketing-website-redesign

Design
Business2Community
User Experience

Comments

Comments

Peter Emerson

This post was written by Peter Emerson

Pete Emerson is a Senior Designer and Developer here at New Breed who've helped us achieve COS Champions. Well-versed in the HubSpot COS and passionate about typography, Pete has a keen eye for innovative web design and UX.

Connect with Peter

    Inbound-Marketing-Guide