The Instagram logo
☰

How to join the online revolution

Website and online shopping guidelines for retailers


You don't need us to tell you that shoppers have clicked in their droves to buy online. And post-lockdown, many of them will carry on regardless.

Recent research shows that for UK consumers, the most important factor when shopping online was that a website is easy to use – way more important than how pretty and warm-hearted it may be.

Almost as important was a quick load time followed by the products they need being in stock. One in four want to see a website that loads well on a smartphone.

You probably already have a website but the thought of adding an online shop fills you with trepidation – after all, surely that means employing a team of geeks and losing yourself in a darkened room for hours while you tear your hair out at all the techie stuff.

Not necessarily so.

Here, we'll talk you through some of the basics not only for designing a website but also for starting your online shop. And if you already have the full monty, don't switch off now but have a look to see where you might be able to improve or free up more time to talk to your customers face-to-face. And maybe follow our links to the organisations that have helped us the most with this guide: startups.co.uk, The Baymard Institute and Shutterstock.

STARTING FROM SCRATCH?

Your website and social media channels will help you attract and communicate with customers, build credibility, increase your brand exposure and drive sales. If you don't already have a website, you'll need to build one first. You can do this by:

Most family-run health stores will probably opt for the middle choice, but don't make this decision until you've read our section on How To Build An Online Shop and clicked through to Startups.co.uk/getting-online.

DESIGNING A WEBSITE

The first thing you need to figure out is what action you want your users to take: what you want them to do on your page? Few goals (or even a single goal) is preferable as too many goals can confuse users and paralyse decision-making. You may want them to love the look of your shop and pay you a visit. Or you may want them to phone through an order or email some questions. Or you may want them to like and follow your social media posts, or sign up for a newsletter. Or you may want them to buy your products right there and then. You decide.

If you're designing a product page, the goal is to get people to put the product in their shopping cart.

The next thing you need to figure out is what you want to display on the page. Lists are usually good for this, so the next step is to write a few simple lists of all the elements you want to display on the page.

Then take all your lists and prioritise them. What's the most important thing on the site? What's the second most important? And third, and so on.

After prioritising the lists, you should prioritise the elements within each list by visual importance, putting the most important elements at the top. Then write the actual body text, making it easy for people to dive right into the content and so it should be really prominent.

These prioritised lists will force you to ask a lot of important questions and choose certain elements over others. All this is important for your design as it will determine where to place what elements and help you decide how much weight to give them in terms of size and color. Now you have everything you need to begin doing your first design drafts.

START DESIGNING

Begin with the most important priority. Having the priority list will guide you for each tab in your menu. Sketch out the different elements of your site, separately. You may do multiple design variations for the same elements. This is good. Now is the time to try out new things as the cost of making a change is purely your time.

Repeat this for all the priority lists, going through them by importance, designing the most important, then second most important, and third and fourth etc.

Once you've done that you can make a start on the design drafts yourself – if you understand HTML, the 'language' of web design – or hand over to your in-house IT person, or to a web designer, or use a website platform which doesn't require a knowledge of HTML.

Important things to focus on at this stage include:

Some of this information is summarised from baymard.com/blog/designing-a-new-website-part-one which moves on to further instruction in three parts.

HOW TO SET UP AN ONLINE SHOP

With help from startups.co.uk editor Bryn Glover

From integrating secure payments to marketing your shop, here's a brief guide for small retailers to get your online shop up and running.

Decide whether you'd like to self-host your shop website, or launch it on a hosted platform such as Bluehost, Hostgator or InMotion.

What's the difference? Self-hosting is selling your products through your own website, whereas a hosted site means selling your products through an existing online marketplace, such as Amazon, Etsy or eBay.

So, given that a hosted site will surround your products with competition and present little opportunity to get your brand message out there – and you'll be paying some of your profits back to your host – we'll discuss starting your own self-hosted online shop.

It's not as hard as you may think. Starting an online shop can actually be as simple as adding e-commerce functionalities to your shop's website or blog.

One of the easiest ways to start an online shop is to use a website builder such as Shopify, BigCommerce, or Wix, all of which offer affordable ecommerce plans. Alternatively, if your requirements are a bit more complex, web design agencies give you the opportunity to build an entirely bespoke website from scratch.

Shopify plans include all these functions and more with all its premium plan and BigCommerce's product has a dizzying array of features you can use to create a professional-looking online shop regardless of your skill level.

By e-commerce functionalities, we simply mean:

You'll also need to be able to package and ship your products in a timely manner.

You can integrate these functionalities by installing an ecommerce platform (see panel). These are software applications with which you can build your online shop as well as manage sales and operations in one handy programme.

In this way you'll be able to get the all-important foundations of your online shop in place by:

Each ecommerce platform will come with its own configuration process, but it's worth opting for one that has an intuitive set-up wizard that'll guide you through this early building process.

You will also need to make sure that your website can securely take payments from credit/debit cards and/or direct debits. It may be that your ecommerce platform guides you in this, but we'd also recommend checking out platforms that can specifically do the job – it's available with e-commerce plans from Wix and Squarespace.

Alongside the ability to add key functions, an e-commerce platform such as Shopify or BigCommerce will enable you to personalise your online shop's design so that it fits with your business' branding and your shop's intentions.

Whichever provider you opt for, you won't be short of designs for your online shop. Shopify has a nice, manageable 20 templates to choose from, while Wix has more than 500 templates available.

When it comes to this design process, you will be limited to what your e-commerce platform allows. It could be that it enables you to freely put a page together using drag and drop tools, or it might stick to a more rigid template structure. Either way, it's important you choose a platform that offers the level of customisation that suits you.

In terms of design, think of your online store as a physical store. The site should be user-friendly, with the aim of making it as easy as possible for customers to buy something. Having poor site navigation is like making somebody wander aimlessly around a physical store – before long they'll get frustrated and walk out. The same happens online.

In other words, make sure all the key elements of your site – for example, your catalogue of products, an 'about us' page, and the customer's shopping cart – are easily accessible at all times. A customer will get frustrated if they're made to click through countless pages before reaching the product category they want.

DETAILED PRODUCT DESCRIPTIONS

Of course, where online shops have a disadvantage is that customers are unable to examine or feel a product in the flesh before deciding to buy it.

So, it's important to give as much information as possible about a product to encourage them to commit to buying it – and so they receive what they expect to receive.

We've included a Must Stock Guide in this issue showing what suppliers can offer you in terms of ready-made images, product descriptions, ingredients, package sizes and RRP – see here.

What's your priority?


Startups.co.uk lists these as the Top Six ecommerce platforms for different reasons:

  • Wix.com – Best value for money
  • Squarespace – Best creative control
  • Shopify – Best for sales-specific features
  • Weebly – Best hassle-free platform
  • BigCommerce – Best for multi-channel selling
  • GoDaddy – Best for ease of use

10 RULES FOR DESIGNING A WEBSITE

Source: Shutterstock.com, THE place for images to populate your website

A few more pointers

See baymard.com/blog/covid-19-ux-improvements

Read more articles from our latest issue...