• How to design the best homepage for your online store

Designing an Eye-catching Homepage: Tips for Engaging Your Online Store Visitors

It seems like it should be obvious that your homepage is the welcome mat to your store and that it needs to be terrific. Yet I see so many hard misses, especially with brands that are new to eCommerce. Your homepage is the most important page on your site and getting it right can greatly impact your success. Admittedly, a well-known brand can do it differently as people KNOW who they are. They also have big budgets and can do things most smaller stores just can’t afford to do…yet! So what does make a great homepage for an eCommerce site?  Let’s dig in!

The front window for your store

Imagine you’re walking downtown and past a number of businesses. How do you decide which you want to enter? For most people, you’ll start by looking at the sign and seeing if that tells you what they offer. Sometimes it does; sometimes it doesn’t. As you get closer do you look into the window? Of course, you do! Does that influence your decision? Yes, it does. You’ll look both at the window, and if you can see further in, you’ll look to see what types of merchandise they offer. If you think you may like what they have you will step in and take a closer look.

The first impression users have when they land on your homepage is critically important as it will determine if they look closer. Online this “front window” is what they see when they first land on your site. The amount of screen that is seen is also called the viewport.

Unlike on a street, this view can be very different based on the screen size of the device they are using.  These days that means considering mobile, tablet, and a variety of monitor screen sizes. For most businesses, especially those that sell retail, the majority of visitors will arrive via a mobile device so if you’re designing your store based on what it looks like on a desktop, you may miss critically important design features that can help or hurt conversions.

Takeaway: Don’t obscure the view with immediate popups. Let people take a peek to see if they are interested first!

Capturing attention instantly

I believe I’ve read that you have less than 3 seconds to impress people to stay. This is one reason you do not want popups to slap people in the face the minute they arrive onsite. Let them peek in your window a bit and decide if they like what you sell before you invite them to subscribe.

This also means that people must know immediately, within this viewport what you sell and why they should care. This core principle is one reason you do not want to hide all your product categories behind a “shop” button. Shop what? This is a question you don’t want to be asked as it causes many to leave. If you have a large catalog, you can show your most popular categories on your horizontal (header bar) navigation and a Shop All.

This is also why non-buying information pages should not be in your header. It takes up important real estate that should focus on the buying process. What you sell, who you are, and how to contact you. Shipping, returns, FAQs, blog, etc. can all live in your footer. Even contact can be in your footer if the header is space-challenged as people will look for it. Placing it in the header helps shoppers see that you’re a real business, manned by real humans, and is part of building trust.

Takeaway: Don’t hide all your categories under a Shop button.

Visuals are key

The #1  rule of eCommerce marketing is that people don’t read. Given 3 seconds to capture their attention, the imagery in your store is critically important. Keep your overall site appearance clean and uncluttered. The products should shine. All images should be crystal clear.

Your hero image (most stores should not use a carousel) should make it clear what your store sells – in most cases in a broad sense. For example, if you sell cosmetics it would be better to show either a collection of different items, or a woman applying cosmetics, or some other image that supports the concept that your products make women feel more beautiful.

If you can tell a story in images and few to no words, do it. If it’s as easy as 1, 2, 3, show those steps with simple icons and short text.  If you serve a mission, for example, donate a portion of proceeds to a charitable cause, indicate this too as well as why that cause matters.

Categories or other special information are usually better than listing individual products on a homepage. There are some exceptions to this, but in general, if you have more than just a handful of products to sell, you’ll do better to show that breadth.

People will rarely buy a product from a homepage for two reasons.

  1. The odds that the products you’ve chosen to display on your homepage are exactly what they are looking for are slim.
  2. Most of the time, they need the additional information found on a product page to make a buying decision.

Stores that are product-heavy on the homepage are often using software that personalizes the products displayed based on the shopper. This said, new or popular products can add more context to what you offer. Showing your products within lifestyle photos can be an excellent way to help shoppers see your goods in use and as something that they will enjoy. For example, if you have a category for dresses, showing items from your collection being worn while within a scene can be a great way to further show what you offer.

Takeaway: if you can tell your story in pictures use them and fewer words. 

Demonstrate value

A key concept for business success is a Unique Value Proposition (UVP). Your UVP answers why buy what is sold on this site here, today? What value does your store bring to a shopper? Is it a carefully curated collection of items that would be hard to find in one place? Is it an original design? Is it customized? Is your pricing exceptionally low?

There are many factors that determine value. Remember that value is all about perception. Do your shoppers feel you offer a great value? Value and price are not the same things and you can offer exceptional value without being the cheapest.

Take a good hard look at your products, and your goals, and your customers (hopefully you have done a customer avatar) and ask what would motivate your shoppers to buy now. Then answer this question.  Experiment with ways to convey this value both with imagery AND with concise words.  This UVP then becomes the text for your hero or carousel banner and may be repeated elsewhere.

Secondary values can also be very important. Typical secondary values that matter include free shipping, easy and free returns, fast delivery or curbside pickup, expert help. Convey these values in a very visible fashion. Free shipping is often conveyed in your header as it is the number 1 question shoppers ask. What will the shipping cost? Answering these questions to the satisfaction of your shoppers can increase your conversions too!

Takeaway: Visually present what value your store brings to your customers. Plus your homepage is all about building your brand and shouldn’t really be just a catalog of products.

Build trust

Anytime there is money to be made, there will be scammers and unethical businesses. Sooner or later everyone gets hurt so it is very important that your site conveys the message that it is trustworthy. Trust is a complex combination of factors both on your homepage and throughout your website. Well-written key pages such as About Us and all store policies are very important. Easy to find contact information is also key. Note that the inclusion of a physical address and phone number do contribute more to trust than an anonymous site.

Homepage trust factors include brand carousels when you carry known brands, store testimonials, and customer reviews, review software badges such as those offered by Trustpilot, Stamped.io, or Google Store Reviews. Note that ALL of these review badges click-through to a page that lists reviews.Trustmarks from third party review sites

Showing off the brands you carry can inspire trust as shows you carry good quality merchandise. Any press you have received is also an excellent addition.

Many brands will also showcase an Instagram feed as social proof that they are real and have an existing following of happy customers.

Personalization

In an ideal world, all websites would know who each shopper is and deliver personalized content. For shoppers who have been to your store before, this is possible but the software to do this may be unaffordable until you get larger. If you are doing 7 figures or more a year, it may make good business sense to consider adding merchandising tools that personalize user experience.

A smaller store can add elements of personalization via the clever use of marketing popups. Most stores are underutilizing or incorrectly using this type of marketing tool. The right tool can allow you to tailor pops to show based on point of origin – such as an ad, email or social channel, based on whether they are a repeat customer or not “Welcome back,” or even be as granular as targeted to only shoppers who have bought previously at least 3 times!

For a great idea of a well-known brand that has a fully personalized homepage, check Amazon. Though even Amazon will offer a hybrid of seasonal and personalized content during the holiday season, most of the time the homepage content is based on your prior shopping.

HomeDepot’s current homepage shows a great mix of personalization, their seasonal messaging, featured categories (immediately below the carousel), and value propositions. See “my store” up in the header? As I shop, Home Depot uses that information to display interesting content and to inform where there is local stock.

Home Depot's homepage 11/29/20 is an example of a Great Homepage for eCommerce

Home Depot has adapted its value propositions to fit seasonal concerns.

Home Depot's value propositions 11/29/20

Expertise

You’re an expert! At least that is the message you need to convey when it comes to the products you sell. Expertise and expert guidance can be a key differentiator against competitors who fail to understand that knowledgeable support and pre-purchase information are part of the buying process. Content designed to convey pre-and post-sale information is also super helpful for your SEO. This is part of the answer to “why buy here?”

A well-written blog and evergreen pages serve as part of the role of establishing your expertise. Friendly and easily accessed customer support is also a piece of the puzzle. These days most sites are utilizing chatbots and knowledge bases to answer common questions, then offer to connect either via live chat, phone, or email to a human for more sophisticated answers.

Your homepage can showcase the availability of expert support, and can include access to guides and blog posts.

Stay in touch

Most stores use email marketing as an important marketing tool. Text messaging is increasingly popular and some stores also offer push notifications. You’ll want to encourage people to sign up to your communication channels by including sign up forms and social media links in your footer. Note – don’t put social media links in your header as this encourages people to click offsite, interrupting the buying process. They are a good addition to your footer as this is where shoppers will go to look for more information about your company.

The addition of a pop-up invitation to subscribe is generally a good addition. Just be sure to give people ample time to check out your site before displaying the popup. After all, you’re not looking for more emails, you’re looking for more emails from people who may want what you sell. This is a big difference!

Best practices for visual design and layout

This article covers a lot of ideas for what types of content help build your brand and inspire site visitors to purchase. The next key concept is how you present all this information. Order matters. Layout matters.

Hierarchy of elements

Tons of research has been done that shows how the human eye will track a webpage. If you’ve ever experimented with scroll and click heatmaps it becomes clear that where you put information absolutely impacts how well your page delivers on your goals.

As people scroll your page, the percentage that leave that page increases. It is not uncommon to lose 25% or more below the fold (the fold is where your viewport ends on first landing). This is why the real estate on the top of your page is critically important and must convey what you sell and why people care immediately.

As you place other elements consider their importance to the buying decision. Note not every store will have or should have, every possible piece of content listed below.

  1. what you sell and why I should care – navigation, UVP, secondary value propositions
  2. categories – help further define what you sell
  3. brands, new products, featured items  – all support what you offer
  4. purpose – how it works, causes you may support, why your store exists
  5. testimonials and social proof
  6. expert content
  7. email/text signups, social media property links

The Gutenberg diagram

The Gutenberg diagram describes how the human eye tracks a page and which areas draw attention. Even within the viewport location of specific elements, such as the shopping cart or a Buy button are best placed where the eye will easily catch them. There are other principles of visual design that can dramatically improve the effectiveness of your pages. It makes good sense to study the basics and apply the best practices of compositional design to your page.

Are you overwhelmed?

Admittedly, there is a lot of information here. I wish I could say that it isn’t a big deal to get it right but it is. Truthfully a bad homepage can kill your business even if you have great products. If you’re a brand new business, a good homepage can make you seem more established and more trustworthy.

If you have an existing customer base but are just new to eCommerce, you may survive but you’ll struggle to gain new customers, at least until your brand gets better known and has a ton of reviews.

If you’re well established and a recognized brand, you may still do okay with a weak homepage, but you’re still likely to be losing new customers because odds are that many who may arrive onsite do not know who you are.

So this is important for all size businesses, not just those that are brand new.

Truthfully, it pays to have a professional design done for you by an agency well-acquainted with all the elements of trust and conversion optimization. While good help isn’t cheap, the odds are excellent that by scrimping here, you’re hurting your sales by a factor that exceeds the cost of a great site many times over. Penny smart; dollar foolish.

By |November 29th, 2020|