When you’re creating an online shop, you may already have an idea of what you want your site to look like but there are a few things to consider before you apply that Theme or design template to your new ecommerce website.
Firstly, the type of business and your product range will greatly influence the type of Theme you choose. For example, a clothing shop will most likely have a very image-heavy Theme which not only shows off the products in great detail but is also easily navigated by customers on smartphones and tablets. In comparison, an online shop selling components for performance cars may have smaller product images but allow for space in the Theme to display any product specifications and attributes which are essential to the customer on the product pages.
In this blog, we’re going to showcase some of the Themes our own customers have used on their EKM online shops and let you know about some of the specifics you need to look for when selecting a Theme for yourself.
Smith and Smith have used our ‘Toy Chest’ Theme and customised it to their own branding and colour scheme. This Theme has a simplistic and clean look, with easy navigation.
The owner of Smith and Smith said, “We are a very old established business – 135 years old this year – so as you can imagine, deciding to add a website to our bricks and mortar shop was not one which we took lightly.We were contacted by EKM’s Evolution Team who took a look at our website for us and refreshed it with a brand new Theme. We are very happy with it and feel that it reflects our business very well.”
Above the fold
When selecting a Theme for your own online shop, you need to be aware that all of your valuable content must be ‘above the fold’. The ‘fold’ in this case is the homepage, when viewed on a desktop or laptop, before the customer has scrolled down, so it’s literally anything above the bottom of the screen; the content above the fold is therefore very valuable and needs to be utilised wisely. Independent research investigating the habits of online shoppers reveals that very few customers scroll down on the homepage of an online shop or ecommerce website, with an average of just 12% reaching the footer of the Homepage. With this in mind, you need to ensure that any popular products, categories and promotions are clearly displayed above the fold to have the most beneficial impact.
Online clothing retailer Mon Michelle has also chosen a predominantly image-heavy Theme ‘Blanc’ to really show off their collection. This Theme takes its inspiration from the online shops of bigger high street brands and offers a ‘lookbook’ style homepage.
Mon Michelle’s owner said, “I chose the Theme Blanc as I believe it stood out to consumers and what I thought would catch my own eye, as well as staying current. I also really liked the amount of exposure I could get, showing off my clothing items as customers opened my website.”
If you look at this screenshot of the homepage of Mon Michelle, you’ll notice the largest image that resides above the fold refers to their most popular category, with examples of the products that can be found within this category. Clicking the image takes the customer exactly where they want to be in an instant.
Go Office Furniture uses our ‘Qwerky’ Theme and features some really high-quality lifestyle images of their products on the homepage to tempt visitors to click deeper into the category and product pages. The images are static, which means that they are not animated, ensuring maximum visibility for the products featured in the images and a fast loading time for the homepage itself:
Sometimes called carousels, slideshows were incredibly popular on ecommerce websites over a decade ago, and although you may see them on the odd online shop, they’re not what we’d consider being best practice. The reason for this partially based on the independent research that reveals that online shops will spend little more than three seconds on any homepage looking for what they need. With this in mind, the chances of them staying to watch a slideshow rotate – whether the slides move manually or automatically – is very, very slim.
Slideshows can also increase the loading time of the homepage, which makes for a bad customer experience and this had lead to them being replaced with static images on many online shops today.
Looking at the screenshot of the homepage of Go Office Furniture, you can see how they’ve used three really strong images above the fold to encourage the visitors to click deeper into the site. These images can then be replaced regularly when they wish to promote different product lines.
Magic 7 and the Rules of 3
Another aspect of your Theme that you need to consider is your navigational structure – in short, how you will display your products and categories to your customers. This is an essential step, as again the products you sell will partially dictate how categories and the products within them are displayed.
When building the navigational structure of your online shop, there are two ‘rules of 3’ that you need to bear in mind. The first rule is that each customer on your shop will spend an average of just three seconds looking for a pathway to the product they want. That pathway can be via a menu or an image linked to the product page, and this applies to not just your homepage but every page on your online shop as each page has the potential to be an entry point if the customer has found it within their search engine results.
The second rule is that whatever the customer is looking for needs to be no more than three clicks away. As an example, if a customer landed on the homepage of an online shop selling toys and they were looking for a Barbie, if there were no pictures of a Barbie doll to click, they would automatically go to the menu. Ideally, the category structure should be:
Home > Dolls > Barbie
That example is just two clicks away from the homepage and is ideal. An example of a bad navigational structure would be:
Home > Girls > Dolls & Prams > Hasbro > Fashion Dolls > Barbie
Which is five whole clicks away, and especially frustrating for the customers if many of those categories had more than a handful of products in each.
In some cases where a product range consists of many different components – like plumbing supplies for example – you can use product filters on the category pages to allow customers to filter the products to view what it is they’re looking for.
‘Magic 7’ refers to your main categories. Ideally, you should have no more than 7 categories on your homepage, with subcategories and product pages linked to those. You should also keep the names of your categories and subcategories simple too; adopt the general rule of thumb ‘the visitor has no idea what your products are’, regardless of what it is that you sell.
Tweedie Chairs are a classic example of this clean navigational structure, dividing all of their products between three categories – Armchairs, Footstools and Sofas:
Keep your logo small
One of the most common issues new online shop owners face is how to present their logo as most automatically opt for ‘the bigger, the better’ approach, but in terms of customer experience and usability it’s not the way to go, especially if you’re a small business. The logo on your online shop needs to remain relatively small in the header, to decrease any blank ‘negative’ space and wisely use the content above the fold to provide the best experience for your customers.
By having a large logo on your online shop, you’re making the header large and creating negative space which may not have the functionality to be used for anything else. Laurel’s Funeral Flowers is a good example of this, as the logo remains small allowing the eye to be drawn automatically to the main product image that resides above the fold:
Bear in mind too that by having a small logo in the header of your Theme, you’re not limiting yourself or your brand, as your logo can be added into lots of different components of the customer’s experience. You can add the logo and your branding into design images, as Works Components have done here:
You can also incorporate your logo and branding onto any emails sent from your shop when a customer places an order, onto your social media and packaging used to box up your products for your customers. By reducing the size of the logo on the homepage, you ensure that the above the fold content is wisely utilised whilst your branding can be displayed at lots of different points within the customer’s journey on your online shop.
So remember, when you’re selecting a theme or design template for your own online shop, you need to make sure that:
- You’re utilising the design images and content above the fold on your homepage;
- You only have 3 seconds to show a customer how to find a path to the product that they want;
- The product the customer wants should ideally be no more than three clicks away;
- You’re sticking to the Magic 7;
- There’s no slideshows and only static images on your homepage;
- Your logo within the header remains small to allow you to promote more content above the fold.