They say if you are not online, you don't exist.
Retailers should interpret this as: if you don’t have an ecommerce website, your business is off the radar for a helluva lot of customers.
Last quarter, Walmart's online sales increased by 97%. Amazon’s Q2 sales & profit growth was 40% but it’s not just the big guys, benefiting from consumers’ spiked appetite for online shopping. Smaller retailers such as Howards Storage World, B-Wear Sportswear, and Plain Jane among others are seeing double and (even triple!) digit growth in ecommerce revenues, compared to the year before.
What else do these three companies have in common? Their fresh ecommerce website designs are spot on and optimised for customer conversion.
And here’s how you too, can join the growing array of retailers that consistently beat their yearly ecommerce targets.
Nation-wide retail operations or hobby side-project, no matter which type of ecommerce site you plan to build, the first thing you need is an ecommerce platform to help you build the best ecommerce store.
An ecommerce platform is a software application that lets you set up an online store and manage its marketing, sales, and operations.
There are 3 main types of ecommerce platforms on the market:
Each of them provides you with a toolkit for creating an online store: page builder, checkout page, payment gateway integrations and more. The difference between those ecommerce platforms lies in the levels of:
SaaS platforms offer out-of-the-box ecommerce store design experience. You can design a store using a drag-and-drop visual editor in several hours but the tradeoff is a limited customisation ability and no capacity to add custom features.
Open source platforms are like a blank canvas that with enough time and effort can be turned into any sort of ecommerce website. But you are creating everything from scratch. That means heaving a coder and a designer on call.
You can choose between headless commerce and Open SaaS platforms such as BigCommerce, SaaS platforms like Shopify (does have a headless commerce offering, but has rigid API call per second limits), SaaS website builders like Squarespace and Wix, and open source platforms like Magento (doesn't have a native theme editor) and WooCommerce (technically an ecommerce plugin). Such ecommerce solutions don't limit your design capabilities so you can create beautiful and unique websites, and you don't need to build core commerce functionality from the ground up.
At any rate, no matter which store builder you choose to start up with, make sure that your top pick has the following features:
When 46% of consumers complete their entire purchase process (from research to purchase) on smartphones, you’ll be missing a lot of sales if your website is not mobile-friendly. A responsive ecommerce platform ensures that visitors from all sorts of devices have equally great on-site experience, without any design constraints.
“Beauty” is highly subjective, but when it comes to web design, “good looks” usually means convenient layout, aesthetically pleasing typography and iconography, crisp visuals, and other on-site design elements that differentiate your store from others. If your ecommerce platform has no customisation features or beautiful ready-to-use templates, you are stuck with using the same mould as hundreds of other stores, with little room to show how your brand stands apart.
Navigation is an umbrella term for all the UI elements users can use to reach specific information on your website. These include header navigation menu, product category pages, filters, on-site search, and footer. When your ecommerce platform restricts your ability to create custom navigation paths, you'll end up with a pretty, but dysfunctional website few customers will want to use, and your conversion rate will suffer for it.
Delight prompts consumers to complete their purchase, and then shop some more. What ignites that sense of delight and takes your brand to the next level? The best marketing tools in the world won’t help if your site leaves them wanting.
Well-thought user experience (UX)
UX plays a pivotal role in ensuring that your website is not only functional, but intuitive, reliable, user-friendly, and easy to navigate. These factors dial up the pleasurability of interacting with it and make other good things happen.
Think higher conversions, repeat purchases, rave reviews, and word-of-mouth recommendations. So you don’t want to skimp on this.
How do you determine if your ecommerce platform is UX-friendly? Check several ecommerce website examples, built on the selected platform. Specifically:
To design a high-performing website, you need to understand who your target audience is and what’s the best way to reach it. Both Business-to-Business (B2B) and Business-to-Consumer (B2C) ecommerce websites have the same agenda — make a sale, but the means towards that goal are somewhat different.
Let’s take a look at what this means design-wise.
Both Business-to-Business and Business-to-Consumer purchases are sparked by a need, but the underlying motivations behind those needs are different.
B2B customer intent is driven by business priorities and backed by a group of other people (stakeholders, teams, company’s customers, end-users). With many people to please, the product research timelines are longer, and the list of requirements for evaluating products is more detailed. That’s why B2B ecommerce websites dwell more on converting top-of-the-funnel (TOFU) and middle-of-the-funnel (MOFU) visitors to prospects and then turning them into customers using a mix of online (email marketing, eBooks, social media, online demos) and offline sales (phone consultations, in-person demos, etc) strategies.
B2C shoppers act on an immediate need. While most shop around too, comparing product specs and prices, their average time spent at every stage of the sales life cycle is shorter. Unlike B2B buyers who allocate more time to data-based product evaluation and consideration, B2C folks often act on impulse, and thus are more receptive to various cognitive triggers, activated by our bias:
Effective conversion rate optimisation tactics, used by B2C e-tailers, leverage these biases in design to sway purchase decisions.
More people are involved in the B2B buying process, including both end-users and the purchasing agents/decision-makers. An ecommerce website is a facilitating tool that has to inform, support, and demonstrate how your products can meet all the organisation’s needs through content, interactive on-site tools, and supporting marketing assets. Remember: your main goal is to generate leads, not root for an immediate sale.
In the B2C space, purchase decisions are often emotional and event-driven. The coffee machine's broken? OK, I need a new one. Oh, that shoe looks nice. Where can I buy one too? Most B2C consumers are in a constant state of product exploration and in-the-background evaluation. When they discover a good offer, they are almost ready to snatch it. In that sense, B2C ecommerce websites need to facilitate discovery and feed into that sense of urgency.
User experience is equally important for B2B and B2C shoppers, but it has to account for the above-mentioned differences in intent and purchase process. Nielsen group identifies five important differences in UX requirements for B2B and B2C websites:
Now that you know how ecommerce web design differs for B2B websites, let’s circle back to B2C commerce.
Let’s examine the examples!
LARQ uses crisp product images and animations to make us truly excited about something as simple as drinking water. Through spot-on copywriting, colour-block product features, and interactive plastic waste calculator, the reusable water bottle retailer persuades us to join its Bottle Movement and explore more of its stylish products.
Adding multi-regional capabilities (using BigCommerce) was another pivotal moment. According to LARQ, within three months, the company's conversions increased by 80%.
Modular furniture retailer Burrow skipped words in favour of a home page video to demonstrate its main value proposition — assembling new furniture can be fun, quick, and toolless. Using a mix of product and lifestyle pics, Burrow makes it easy to picture its latest designs in your home, customise them for the right fit, and order in several clicks.
Revelry knows that swatches are the shortcut to any bride's wallet when it comes to the bridesmaids' dresses, as well as free sample delivery and at-home try-ons for the entire party. Both options have a prominent spot on the e-tailer’s homepage, along with excellent category navigation, prompting shoppers to discover different dress styles, materials, and colours.
We rave about Skullcandy pretty often, but it’s hard to do better than this with an ecommerce store. The company expertly offsets bright colours with a signature black website design to create that sleek, lux feeling. Products are easy to discover, review in great detail on video, and then read the specs for. Although their primary market is audio, browsing Skullcandy's website is a delightful sensory experience due to the expert use of visuals, material design elements, and video.
Solo Stove website is an admirable example of how to use iconography in ecommerce. The fire pit manufacturer made custom icons for each product category to better convey what it’s selling and highlight some of the main product specs. How-to product videos, illustrations, and FAQ sections help bring across the main point further — their products are durable, easy-to-use, and well worth the price, as the reviewers will tell.
Bliss website is absolute eye-cotton candy. The spa-powered skincare brand uses three dominant colours — Millennial pink, baby blue, and Gen Z yellow — to visually appeal to its main buyer personas. The funky and friendly brand attitude is further reinforced through microcopy. The wording of button copy, section titles, and form descriptions makes you feel as if you are talking about your skincare routine with a friend.
The Mountain has all the great design features of an ecommerce website. A straightforward navigation bar, featuring main product categories, prompts exploration. A service banner, placed under the header, immediately informs about shipping terms and possible delays — a good practice for managing customer expectations.
The hero slider highlights the latest seasonal goodies and promos and prompts further discovery. With a wider range of product categories, The Mountain did an excellent design job of organising everything in categories to reduce the feeling of being overwhelmed that a lot of ecommerce platforms can give you.
Liked the website examples above? All of them were designed on BigCommerce, and here’s why enterprise clients and SMEs alike choose our ecommerce platform:
Pretty or functional ecommerce website? With BigCommerce you get both.
Think of ecommerce website design as building a house. First, you have to build strong mortar and outer walls. BigCommerce provides you with the technical 'bricks' to place at the core of your online operations — no-code page builders, secure checkout, SEO-friendly codebase, and more. You can mix and match different ‘bricks’ to assemble a tiny house or a six-bedroom Victorian mansion.
We also don't limit you when it comes to the front or interior design. You can give your website a fully custom on-brand look without skimping on SEO, usability, or security. At the same time, you can customise your back-end to match your operations by pairing the in-built core commerce with external integrations.
If you don’t feel like creating your store design from scratch, you can take a look around our theme store. With 150+ unique designs, you are bound to find something that pleases your eye. Browse options based on grid type, product catalogue layout, or industry. Or review the best ecommerce themes, picked by our staff.
Every BigCommerce theme is responsive, mobile- and SEO-friendly, and optimised for usability. Using a premade theme is a shortcut way to designing a great ecommerce website at a lower cost.
What if I want to design a truly custom ecommerce experience? Think third-party integrations and add-ons with AR apps, a custom CDN + CMS to support heavy-duty publishing, and an ML-powered product recommendation engine on top with real-time data. Is BigCommerce still relevant to me?
Absolutely. BigCommerce is an open-SaaS platform, meaning our technical infrastructure can be easily connected with an array of other applications through APIs. Our platform seamlessly integrates with external apps and can be integrated within larger technical ecosystems.
For example, you can use our core commerce features for inventory management, payment processing, shipping, fraud management, and more, while using another technology such as WordPress or Adobe Experience Management to power your website's front end. Such a setup is known as headless commerce.
On the other hand, if you need less sophisticated, but still robust design functionality, we deliver that too. Take our Page Builder — a drag & drop web page editing tool that small businesses and Fortune 500 companies use to create attractive landing pages.
Using pre-made design elements, you can rapidly prototype attention-grabbing and click-inducing product listings without writing a single line of code. Create interactive customer experiences, level up your content marketing game, and add new supporting pages to your sales funnel without calling the dev team.
Even with the best-in-class tools, the design process can easily get derailed without a clear roadmap. What do you need to prepare for your e-store launch?
Let’s tackle all of these one by one.
A homepage is the first touchpoint between you and a potential customer, you can think of it as a digital storefront for your online business. With roughly 3 seconds to make a good impression, you need to be strategic with your design choices on your homepage.
High-performing ecommerce homepages share the following elements:
The structure above is not cut and dried, though. The look of your homepage will be determined by two factors — your industry and your customers’ preferences.
For example, Jeni's ice cream immediately prompts the shoppers to decide if they want to order a takeaway from their local store or ship nationwide.
Category pages help organise all your products and facilitate discovery. Digitally-distracted customers want instant information, especially when they are on mobile devices. So you need to serve them with quick access to the products they crave.
Apart from being crucial for user experience, category pages also need to be optimised for SEO (search engine optimisation). Incorrect parent-child relationships can result in duplicate content and undercut your rankings in search results. Thus ensure that each category page:
Natori follows all of these principles to create a delightful browsing experience for buyers
Product page design is exceptionally important for ecommerce. Whether you sell t-shirts or tyres, if your listings look meh, your traffic and conversion numbers will never go up. At the very least, your product page has to feature:
Then you can spice it up with some extra features — countdown timers, video or AR demos, check-in-store option, back-in-stock alerts, and more! In our previous post, we talked a heap more about creating effective product pages.
Many factors could prompt the customer to abandon their shopping cart, according to Baymard Institute:
Most of them can be prevented by improving your checkout page look and flow.
Don’t treat an “About” page as an afterthought, especially if you're in B2B ecommerce. Because 52% of business buyers say one of the first things they want to see on the vendor website is the About Us page.
There are many ways to craft an attractive About Us page for an ecommerce company:
Design-wise, keep the texts short and point. Avoid sales pitches and CTAs, but do use good team and product visuals to back up your story.
Larger ecommerce stores need to think well about the on-site search experience.
To create a great on-site search experience:
Don’t brew too much over login forms. They should be short, progressive, and frictionless. Ask the shopper to provide the basic information first (email/pass) or even log in with one of their social accounts. Every extra step during registration increases the chances of churn. Request shipping and billing details after the registration is complete. Offer users an option to save and re-use their details in an address book — for everyone’s convenience.
A well-executed ecommerce email marketing campaign can drive repeat traffic to your website and maximise conversions, but before you market, you need to build your email list. To entice subscriptions, give your newsletter a prominent placement at the homepage and keep a sticky or pop-up version in the footer area. To retain first-time shoppers, you can also pitch a small discount for a subscription.
We've talked and shown you how a winning ecommerce design looks and what pages it needs.
Now let’s dive into the how-to part and talk design tips for store owners.
The path to purchase has to be immediately obvious to the customer. Before adding a new design element to the page, ask yourself this: will this help or impede the buyer journey? It’s best to start with a minimal landing page, then add extra conversion-inducing elements as you learn more about your audience behaviours and preferences.
Great user experience amplifies the pleasure of interacting with your brand while design mishaps chip away that feel-good feeling. After you are done with the initial design, audit each page. Determine where you can remove friction and add extra delight to improve your store conversion rates.
Branding is a powerful asset for building emotional connections with your audience and turning them into vocal brand advocates. Four out of five customers are more willing to promote a long-time favorite brand. By creating a distinctive ecommerce shopping experience, you are securing your spot as a long-time favorite brand, one interaction at a time.
Attractive prices, cool promos, catchy banners are still important, but their effectiveness shrinks if the overall UX is clunky. Focus on ensuring high website usability and performance first. Then work on extra graphic design elements.
By now flat design has become a ‘classic’ look around the web, and for good reason. The main principles of flat design prompt:
All of these elements add up to a great ecommerce experience
The ecommerce space is getting busier year-on-year. Your branding, iconography, website features, and on-site experience should jointly reinforce your unique value proposition and differentiate your ecommerce business from the competition.
Back your design hunches by data. Study your customer lifecycle, analyze their browsing habits if you are redesigning, or conduct usability tests with a focus group. Learn as much as you can about their browsing habits, then incorporate those findings into your design. Your ecommerce design has to appeal to your target audience, not just be aesthetically pleasing to you.
Great ecommerce websites visually lead the customer during their journey. Each element plays a strategic role in that discovery process. Tooltips and service texts can be helpful and prompt conversions, but if you need to explain each new step, the selected design isn’t working for your brand.
Online product discovery and purchases should be intuitive. Present a clear path-to-purchase to each visitor through navigation bars, straightforward information architecture, and promptly-placed calls to action. By minimising the cognitive load at each step towards a purchase, you increase the chances of conversion.
With a ton of ecommerce best practices around the web, it may be tempting to use each one of them, but more isn’t the merrier. Not every practice works universally well for every retailer. As a business owner, base your design decisions on first-hand customer data and feedback, rather than common wisdom. This way you’ll create a unique user experience that makes a mark with your target audience and makes them more loyal to your brand.
At the end of the day, good ecommerce website design is all about iteration. Start with the essential pages and design quick prototypes. Test them with your team to make alliterations. Launch a new look and collect first-hand insights from your customers.
Between conversion optimisation, new product landing pages, and seasonal promotions, you’ll always have plenty of ‘design’ work at hand. With functional and performance requirements taken out of the way by your ecommerce platform provider, you can focus on the creative part of the process and outperform yourself with every new design variation!
Still have some pressing ecommerce design questions left? Let’s sort those out!
Ecommerce website design is the process of creating an online store for your business to sell digitally to target consumers. To design an ecommerce website, you need to plan, conceptualize, and arrange your content and products for effective display on the Internet.
Good ecommerce website designs have four key elements — clear navigation, effective information architecture, optimised product landing pages and easy check out. All of them combined sum up to great usability.
Here are the steps you need to take to build an ecommerce website even if you don’t know how to code.
The most-wanted ecommerce website design features are those targeted at improving conversion rates. These include user-generated reviews, wish lists, high-quality photos, demo videos, product recommendations, find-in-store search option, one-click checkout, multiple payment options support, and a mobile-friendly design, featuring all of the above.
Small ecommerce stores should prioritize user experience the same way as bigger e-tailers do. This means using responsive, mobile-friendly designs and ensuring convenient filtering and navigation. Invest in high-quality visuals too, and don’t skim on supporting different payment methods.
For large ecommerce stores, effective navigation is key. Spend more time on determining the optimal information architecture for showcasing your stock. Create different product category groups and sub-groups to speed up discovery. Also, invest in powerful on-site product search that also supports different filtering options — by price, product type, size, color, season, etc. Your design should naturally facilitate discovery, not ramp up the feeling of overwhelm due to the sheer volume of choice.
The dominant ecommerce website design trend right now is personalization as that’s what most ecommerce shoppers expect by default. Personalized user experience can be achieved with dynamic landing pages, data-based product recommendations, upsells and cross-sells, as well as product quizzes and curated edits.
No, most good ecommerce themes are not free. But they are well worth the investment. Premium ecommerce themes (unlike free ones) are bug-free, SEO-optimised, and fully secure. Support and troubleshooting also come as a bonus with most paid ecommerce website themes.
Building a fully custom ecommerce website, instead of using an ecommerce platform, costs more. However, if your goal is to achieve a fully custom look for less and faster, you can opt for a headless approach to ecommerce development.
BigCommerce should be among your top picks! We offer all the essential ecommerce website design features you need to design an e-store of any size. Smaller retailers prefer us because we provide all the core commerce features and visual design tools for an affordable price. Enterprise clients enjoy using our open SaaS platform as it places no limits on design or integrations with other apps. So that you can focus on managing your operations without worrying about backend development and maintenance.
B2B ecommerce stores use the same UX design patterns as B2C ecommerce stores but have a somewhat different structure. Since the sales cycle is longer in B2B, such stores focus more on capturing TOFU and MOFU prospects, rather than enticing an immediate conversion as B2C stores. That’s why some of the key design elements for a B2B ecommerce store are: longer product landing pages, featuring demo videos and comprehensive product descriptions, CTA forms offering to request a product demo, schedule a call, etc, and longer check out forms, asking to provide minimum order quantity, offering payment plans and pricing calculators for large-volume orders.