More than 60% of online shoppers just leave an e-Commerce website within the first 5 seconds landing in the Homepage. This is the painful average number for the whole industry. Do you want to stay below this “standard” and win the eCommerce game? If yes, it’s time to take a serious consideration of optimizing your homepage to the best.

Homepage has a big impact on traffic, search engine rankings, conversions and sales number of an eCommerce website. Creating an effective homepage is a difficult task, as it involves various elements. There is no right or wrong answer as to which homepage pattern is the best. Hence it is important to test different approach to know what works best for your business.

Let’s move through 6 key elements a homepage needs for an awesome conversion, and optimize them for your website:

1. Prominent main menu

Product findability is one of the most important factors of an eCommerce store. Your website’s skeletal structure – the navigation design, bears huge impact on your store’s success or failure. Generally, the main menu consists of links that make it easy to scan and lead users to various website sections. For eCommerce sites, quality navigation describes both the structure of product categories and the act of navigating by users. Clearer navigation structure means better user experience. It keeps users on a website stay longer and visit more often. In turn, it helps boost conversion rate and improve search engine optimisation (SEO).

There have been many different ways to present users with different navigation. Mega menu appears to be the most common and effective. It displays product categories and sub-categories in a multi-column menu. It enables adding plentiful contents as well – promotional banners, video clips etc., – directly into the menu itself. Shoppers then can navigate through the pages with ease.

Tip: Check out 35+ Megamenu examples to inspire your own navigation design.

Mega menu(Mega menu – view entire Homepage)

2. Primary Calls-to-action

You’ve spent time tweaking the storefront look and feel and applied growth hack initiatives to get traffic. But why aren’t any visitors adding products to their cart? Perhaps, your visitors find it hard to navigate your store, or they simply don’t know where to click. This is why effective CTAs are essential for all eCommerce websites.

Every homepage should find ways to use primary and secondary calls-to-action to make every next step clear. As the goal of your homepage is to direct visitors to further down the funnel of buying cycle on your store, the common CTAs like “Free Trial,” “Schedule a Demo,” “Buy Now,” or “Learn More” will tell them what to do next so they don’t get overwhelmed. The primary call-to-action is bold and normally above the fold. However not necessarily all CTAs are for the top of the homepage. Make sure you get CTAs done right to turn your homepage into a sales- or lead-generation engine.

Tip: You can cater pre-made responsive themes to create effective call-to-actions your way.

Primary CTAs

Primary CTAs – View full homepage

3. Benefits of Your Products

Your homepage is the best place to communicate a compelling value-proposition. Show the advantages of your products and ‘don’t make me think’, perhaps, is the best practice to keep visitor stick around and stay longer.

Visitors are attracted by shopping deals the most. When your store shows your main services and product-offers, your site communicates instantly. An outstanding list of product categories,may be in a grid format, can be the perfect help to your online store. Adding Daily Deals, Best-sellers (Hot sellers) and new arrivals are also good to show your visitors what they are missing out on. Chances are, many online shoppers do not exactly know what they want. Putting key benefits clear on the storefront is always a plus point beyond arguments.

Tip: Take a look at 35+ inspirational storefronts that have outstanding and straightforward product categories.

Show advantage of your products

Show advantage of your products – View full homepage

4. Advanced Search Functionality & Shopping cart (Guest checkout)

For any large eCommerce site with a wide collection of product, the search functionality is a must-have. It allows visitors to search their preferred product faster. Imagine that a visitor only knows brand/SKU. Ensure that he finds such specific product easily with just a few clicks. For this, keep search box at a prominent place which to the search easier for visitors.

Advance search form

Advance search formView full homepage

Another especially element for first-time customers is guest checkouts. Forcing users to sign up before they reach the checkout page will decrease the conversion rates. It interrupts the shopping process. On the other hand, registration helps returnees to come back for purchase. They don’t need to enter all their billing and payment details in again. Having one-page checkout process in place will help create a streamlined experience for both groups.

Tip: The search feature might vary between sites. If you use Magento platform, Magento’s default catalog search can be a powerful tool.

Shopping cart

Shopping cart – View full homepage

5. Optimisation for mobile experience

As shoppers interact with brands across multiple devices, making it easy for visitors to interact with your products on any device is a-must. We’re quite familiar with responsive web design (RWD) which identifies the type of device being used to access it, adjusting itself to fit the device. RWD has become the default standard of all eCommerce templates these days, as one set of codes servers all devices. However, beside traditional responsive RWD, let’s start thinking of m-commerce as well. A few solutions like Shopgate are in place now. It helps create beautiful native mobile apps for your store automatically, with just a few clicks.

Whether you go with RWD or m-commerce solution, the homepages on mobile must be ‘easy to navigate.’ Do not use flashy, overly-complicated objects that unnecessarily get in the way of browsing. Different from desktop, mobile context is almost for ‘on the go’ users. Therefore, basic things like clarity of interface, consistency from one view to the next and ‘tapping’ interactions should be straightforward.

Tip: See 70 Stunning responsive themes – a solid starting point to create homepage that works well across desktop and mobile devices.

Crafts theme: Responsive vs. Native mobile app

Crafts theme: Responsive vs. Native mobile app – View full homepage

6. Website loading speed

Google has indicated site’s loading speed as a determining factor for ranking. Once your visitors arrive in your slow-loading homepage, you are more likely to lose them. Visitors are traffic which can potentially generate revenue. As reported by Amazon, an increased revenue of 1% is generated for every 100 milliseconds site speed improvement. (source)

Homepage Optimisation

Homepage Optimisation

A perfect e-commerce experience is reliable and brings out the best performance to your conversions. So make sure you optimise your homepage to increase your page speed. There are many factors associated with optimising your site’s loading time. However, from homepage perspective, you might consider starting with minifying your code (CSS, HTML, Javascript files) to eliminate extra spaces, line breaks and indentation. This helps reduce the size of your code, as per Google’s recommendation. Since oversized images take longer to load, it is then, of vitality that you keep your images as small as possible. For other suggestions, try minimising HTTP requests, reducing server response time and using Gzip compression to reduce the bandwidth of your pages to reducing HTTP response. Add these in your optimisation list as well.

Tip: Optimisations for your online store depends on many variables, yet making use of the top optimised responsive themes will save you much of time.  

Conclusion

Now that we’ve walked through some key elements that affect your eCommerce homepage conversion, it’s your turn to take action and apply some techniques to your store.

While optimising your homepage as per checklist mentioned above, take visual appearance perspective into consideration as well. As pointed out in this post, 52% of shoppers abandon sites and do not return because they dislike the overall aesthetics.

There is still no best practice on a perfect homepage. Try testing a few variations of pre-defined homepages on your own store to see which approach works best in your specific case. If you have other ideas to suggest, be sure to leave them in the comments section below.


Author biography: An Nguyen – Head of UberTheme.com – We offer top quality Magento eCommerce solutions since 2009. UberTheme creates a wide range of professional themes and extensions, with over 70 top-notch products that make your store eye-catching, functional and user-friendly. We constantly add new products and resources to help you get started with Magento 2 with ease.

boost sales for magentohomepageincrease salesmagentowebsite optimization