There are certain elements you will want to include in your e-Commerce homepage. Follow this guide if you want your website visitors to click further into your WooCommerce store and convert into paying customers.
Starting at the top.
People read websites in a ‘F’ pattern. Meaning they start at the top left corner and there move across the top. Then they drop down a line and scan through the rest of the page. Usually reading less and loosing interest as they move down the page.
This is why websites almost alway feature important items at the very top of the page in the banner or header area.
The logo, navigation and a link to the shopping cart are almost always in the header area. A search box, social media links and contact details often are in the header too.
As far as navigation goes, the header needs to have all the most important links. Cart, Checkout, a link to the users account. The main product categories are a good idea. Don’t stuff the most important real estate on your site with unimportant links. A lot of things, like links to every category, your blog, terms and conditions etc can be put elsewhere. Perhaps the footer.
A device that some sites use is a top bar above the header. Usually it is coloured a little more subtly than the main header so a not to draw as much attention. This can be a good place to put important details and links that need to be easily found, but aren’t going to get you more sales. Good items to put in the top bar are phone numbers, links to account pages and other important but non essential details.
After the header area.
Next after the header area using comes the next most important area of your e-Commerce homepage. Most sites have a large image area, sometimes known as a ‘hero image’. Large images of your products in use are a great idea for this area. Check out fashion e-commerce sites for some inspiration. The hero image can have some nice design features that tie into your store’s branding and make your site unique and memorable. This helps with creating a positive brand perception.
It is a good idea to also incorporate a Call to Action in this area.
For example, you can have an image that ties in with a particular product or product category and has a ‘Buy Now’ button that links directly to the product selection.
You can change the content in this area regularly. If there is a holiday coming up like Mother’s Day or Christmas you should advertise any sales or associated products.
This is one of the most important areas on your homepage so use it wisely.
After the ‘Hero Image’ area.
After the ‘hero image’ area. E-commerce sites usually start listing the best products on the store. Best products being the best sellers, featured products and products that are on sale.
If your store has a large product range then present the main categories to them with links to the sub categories. Large department stores often take this approach to their e-commerce homepages. They often use the same approach on category pages too. Making mini landing pages for each category which are like more specific versions of the homepage.
Many stores that don’t have a huge amount of products will display a selection of their best selling, new stock or sale products after the ‘hero image’ area.
Thankfully most Shopify or WooCommerce themes will let you add them to the homepage.
More advanced versions of this are personalised content. Websites like Amazon suggest products to return users. If someone has bought from your e-Commerce store before you can suggest complimentary product to them based on their previous purchases. You can have sections like Products you may like or recommend for you. Or you can present them with products that people like them purchased.
Non product related things to include.
If you are building an email list then you should include an email sign up on your home page too. Email marketing is an effective way to stay connected with people that are interested in your product or have shopped at your e-commerce store before.
Great content for a regular newsletter are summaries and links to any new blog posts you have written for you site. Notifying people of sales is another good use of your email list. As is letting people know about new products or product lines.
Testimonials and reviews.
If you sell a product people love and they’ve left you great reviews or testimonials then put those on the homepage too. You don’t need many, just a few of the best will do. This helps with building trust with your site visitors.
The footer area.
Lastly is the footer area of your site. This is often forgotten or just used as a dump for links. A well designed footer and be a beautiful and helpful thing.
There are some links to pages that you will want to include. Links to product categories, user accounts, shipping information, returns policy and term and conditions are a good idea for the footer area. Links to frequently asked questions or sizing information are good too depending on what type of e-commerce store you have.
You can also put in contact details like a phone number and address, even if you have them at the top of the homepage.
Remember to include some whitespace. Websites that are too cluttered mean everything is fighting for the users attention but no particular content actually stands out.
Try to avoid very long lines of text. The optimum line length is about 50-60 characters. Anything longer becomes difficult to read, especially on a computer screen.
Big blocks of text are difficult to read too. People usually skim read web pages. So keep the text brief and to the point.
Use quality images. Bad product photos or poor design can decrease the trust visitors have in your website. For a guide on taking better product photographs for your e-commerce store click here.
Don’t forget mobile phones. Lastly, ensure your finished homepage design looks and work on tablets and mobile phones too. There is a growing amount of purchases that are coming from touch devices. If your site doesn’t work on them you could be missing out on sales.
Every e-commerce website is different, depending on the products you sell. But if you follow this guide you will include the elements your e-Commerce homepage needs. Don’t forget to keep improving and fine tuning your homepage too.
FREE VIDEO TRAININGHow to increase sales and profit for your WooCommerce store
A simple 5 step plan to increase sales and profit for your WooCommerce store without wasting money on ads