5 great examples of B2B eCommerce websites

Blog banner

We analyse five of the best B2B eCommerce websites around and explain what makes them so good.

Great B2B eCommerce design recognises that behind every business purchase is a person or a group of people making buying decisions. Obviously, companies have different needs than regular consumers but the B2B buyers actually signing off purchases have very similar needs in terms of the customer experience. At a glance, B2B eCommerce websites may look very similar to consumer targeted online stores but key differences are in the details – as you’ll see from these examples.

#1: Jewson: Ticking all the right B2B eCommerce boxes

B2B eCommerce example showing Jewson homepage

Jewson is one of the UK’s most trusted builders merchants and also one of the oldest. The company has to adapt heavily in making the online transition and integrate digital channels with its offline customer experience. Last year, we published an article looking at 12 key features of a B2B eCommerce website and Jewson’s website pretty much ticks every box.

B2B eCommerce example showing Jewson website header

If we look at the header, you can see four icons pointing users to a branch locator, their trolley, a sign-in/register link and a VAT toggle switch to include or exclude VAT in product prices. At the bottom of the screenshot above, there’s also a white bar of links highlighting key information and purchase options: Covid-19 updates, a click-and-collect service, trade account applications and a promotion of 50% off tool hire. All of these UI elements have been added to address the buying needs of trades professionals and placed at the top of Jewson’s website for easy access.

Jewson is clear about which actions and information are priorities and this is most obvious with the top line of links for project estimations, expert advice, help and the contact page.

The other two big elements in the header are the unmissable search bar and main navigation menu, which comprises entirely of popular product categories (as well as tool hire) to help users get to the page they need as quickly as possible while links for less important pages (eg: contact us) are placed elsewhere.

Directly underneath the hero section, there’s a product feed featuring seasonal items that are most in-demand for the time of the year.

B2B eCommerce example showing Jewson everyday essentials

Scroll past this, and you’ll see two full-width sections promoting some of Jewson’s key services, such as material calculations and expert advice, and product categories with nested links.

B2B eCommerce example showing Jewson website

This in-page navigation directs visitors to the most important pages of the site and reduces the total number of clicks required to get there. Whether users turn to the search bar, navigation menu or the in-page links shown above, they’re ultimately going to end up with a search results page showing all of the relevant products to their keywords or selected category.

B2B eCommerce example showing Jewson search results

Jewson packs a lot of information and functionality into its results pages:

  • Breadcrumbs to help users navigate to previous pages
  • Product category description
  • Filters to specify requirements and narrow down options
  • A sort by filter
  • Quantity of relevant products
  • Descriptive product names
  • Pricing for trade account holders
  • Listing prices (with or without VAT)
  • SKU numbers for each product
  • Preview images
  • Add to trolley button
  • Quantity selection

While there’s a lot going on here, all of this functionality enhances the experience and contributes something meaningful – either with specific actions (add to trolley) or contextual feedback (product quantities).

It’s a similar story on the product pages where Jewson adds even more functionality purchase options (something else we talked about in our key features of a B2B eCommerce website article). Customers can check availability at their nearest branches and choose between Click & Deliver or Click & Collect while account holders can add items to project lists for each job.

B2B eCommerce example showing Jewson product page

One area where a lot of eCommerce brands (not only B2B) fall short is product descriptions but Jewson does well here, too. Each product page has a good amount of unique and useful information, including a list of benefits and features. There’s also a dropdown section for specifications and this is another key feature for B2B eCommerce websites because most buyers are buying to specification and they need to confirm a product meets their needs.

B2B eCommerce example showing Jewson product description

#2: Matthew Clark Live: Making it easy for customers to keep spending

The newly redesigned Matthew Clark Live website won the “B2B eCommerce Website of the Year” and the “Food and Drink Website of the Year” awards at the UK eCommerce Awards 2020. Judges commended the site, saying its “UI is super strong, sleek, considered, and easy to use” while the redesign was credited with going “to great lengths to improve the experience for customers”.

Matthew Clark B2B eCommerce website homepage

In fact, one of the company’s slogans is “the experience matters” and, while this doesn’t reference the website itself, you can see that the same philosophy is applied to the buying experience on the site. There’s even an online ordering help section on the website and a user guide (PDF) to help customers get the best out of the platform – and this is more of an online platform than a website.

In the back-end of customers accounts, users can add buyers to delegate purchases, create and manage order pads, and view purchase histories, favourite products and saved baskets.

Matthew Clark B2B eCommerce account

Eligible customers receive personalised promotions, which can include a free POS kit, money off deals or free stock for bulk purchases. Alternatively, customers can browse categories or search for specific products using the search bar in the header and refining results with the filters displayed to the left of the results page. Once again, there are descriptive product names, SKU numbers, prices, “add to basket” buttons and a product quantity selector for each product on the results page to help customers shop faster.

Matthew Clark B2B eCommerce promotions

Matthew Clark B2B eCommerce search results

On the product pages, key information about each product is listed in bullet points between the pricing and “add to basket” button. There’s also a product description underneath the main image and it seems the company has attempted to create a unique description here, based on the official Absolut copy. Even still, it’s basically a rewording of the official marketing material and it’s a little light so this is one area where the website could improve.

On a more positive note, the Allergens tab on each product page provides crucial information for buyers and this is a good resource for customers to check the suitability of each product they buy.

Matthew Clark B2B eCommerce product page

By the time customers reach the checkout page, they can change order quantities, remove or exchange products, add any promotional codes they have and create a purchase order reference.

They can also choose their preferred delivery date for orders, save orders as a new order pad, create an Excel order sheet or clear their entire basket. These are all minor touches but they contribute to an ordering experience that helps customers make purchase decisions quickly, confirm their order as soon as possible, complete repeat purchases easily and manage orders efficiently – all from the back-end system on the website.

Matthew Clark B2B eCommerce check out page

#3: Hughes Trade: Focusing on customer benefits, not products

Hughes Trade has a dedicated website for trade customers and it takes a different approach to the examples we’ve looked at so far. Instead of placing the focus on products, the company emphasises the customer benefits of buying through a trade account and targeting specific sectors relevant messages.

B2B eCommerce website Hughes Trade homepage

If you look at the header of the website, it’s similar to the Jewson example we looked at earlier but you’ll notice there’s no VAT toggle. This is because Hughes runs separate websites for consumers and trade customers so no pricing is shown on this site – customers have to open an account or log in to access these. The orange bar in the header highlights the key benefits of having a trade account with Hughes and this is the key theme throughout the website.

Scroll down the homepage and you’re not going to see any product feeds or listings, it’s all about the key benefits of opening up that trade account. Hughes has one conversion goal on this website and there are no mixed messages to confuse users or distract them from this.

B2B eCommerce website Hughes Trade benefits

Hughes is more interested in appealing to its target customers than promoting its products and you can see this in the “sectors we supply” section of its website. Here, the company can deliver relevant messages to each buyer persona, narrowing down on the specific benefits of its trade services for businesses in each industry – for example, renting products, expert purchase advice or installation services.

#4: Shoes For Crews: A lesson in B2B eCommerce copywriting

The Shoes For Crews website was named as a finalist for the “Best B2B eCommerce” at the eCommerce Awards 2020. The company sells comfortable, slip-resistant footwear for businesses and professionals in hospitality, food and healthcare industries – job roles where people are on their feet all day.

B2B eCommerce website Shoes For Crews homepage

If we take a look at the website’s header, the layout looks pretty familiar by now with the main navigation and a search bar sandwiched between two secondary rows of links, mainly for user accounts in the top row and key service benefits in the lower, as well as an embedded review status from Trustpilot.

This is almost identical to the header structure used by Jewson and Hughes Trade but the Shoes For Crews takes a very different approach to navigation. Both Jewson and Hughes Trade focus on product categories in their main navigation menu because they have large, diverse product ranges that can be difficult to navigate.

Although Shoes For Crews sells different types of shoes along with accessories like insoles and grip mats, the company primarily has one product category and the primary division for purposes is women’s and men’s shoes.

Navigation isn’t the only element that benefits from having a focused product range, either. In fact, Shoes for Crews is selling a very particular type of footwear for specific use cases and this makes it easier for the company to clarify the key selling points of its product and incentivise users with compelling page copy.

B2B eCommerce website Shoes For Crews website copy

Unfortunately, eCommerce brands with larger, more complex product ranges have a tougher job in their hands with customer experience design. Shoes For Crews doesn’t have this problem, though, and the clarity in its page copy allows it direct visitors to key product ranges before they’ve even scrolled halfway down the homepage.

Here, we’ve got another in-page navigation system that points users to the most important product categories. First, Shoes For Crews has identified three purchase incentives, two of which exploit classic purchase anxieties: budget sensitivity and the fear of missing out. Then, in the middle, you’ve got that heading for food production and safety shoes, which appears to be the company’s most important target customer and their key selling point.

Below that trio of emotionally-driven links, there’s a row of categorical navigation for the different types of footwear on offer and buttons to filter them out by men’s and women’s shoes.

B2B eCommerce website Shoes For Crews in-page navigation

So we’ve got two rows on in-page navigation there: one for the more impulsive buyer and another one for those who know what they’re looking for. And, if neither of those compels visitors to click through to view products, Shoes For Crews follows up by appealing to different job roles.

B2B eCommerce website Shoes For Crews product navigation by role

This in-page navigation structure helps users refine product searches with a single click, based on their priorities, whether it’s role, style, budget or any of the other selling points Shoes For Crews identifies.

Clicking on any of these filters directs users to hybrid landing/results pages with relevant messaging in a hero section to keep the key selling point fresh in the buyer’s mind at all times.

B2B eCommerce website Shoes For Crews search results

Product pages are filled with high-quality images, product codes and all the essential info. Users can add products to a wishlist or compare them with others and every product showcases a review score to help customers buy with confidence.

Shoes for Crews product page

Scrolling further down the product pages reveals the product descriptions with the key features and benefits listed and a detailed breakdown of review scores, including value for money, comfort, quality and the standard of services from Shoes For Crews. Once again, the company is taking every step it can to help customers buy products based on what matters to them most.

B2B eCommerce website Shoes For Crews product information and reviews panel

At the checkout page, customers are greeted with recommended products, including socks, insoles and other accessories. Much like the product pages, the checkout is clean and easy to navigate without any distractions getting in the way of customers completing the purchase.

B2B eCommerce website Shoes For Crews checkout page

The Shoes For Crews website is an excellent example for B2B eCommerce companies with a relatively small product range to follow. Without a complex catalogue, the company can focus on the key selling points of its primary product and appeal to different target customers – not only different sectors but buyers also buyers with different priorities.

#5: Magnet: Redefining customer relationships

Earlier, we looked at how Hughes Trade focuses on customer benefits rather than products and Magnet takes a similar approach by prioritising customer benefits – although, it does showcase products and pricing further down the homepage and across its website.

eCommerce B2B website Magnet homepage

Magnet doesn’t position itself as a vendor selling to trade customers, though. Instead, it builds a narrative of being more like a business partner that helps trades professionals and companies operate more efficiently.

eCommerce B2B website Magnet benefits to customers

Magnet wants its customers to feel like they’re getting real business support to help them secure new jobs, complete them on time and increase revenue. So it’s not kitchen fittings that trade customers are buying into here but a rounded package of business and supply services.

Before you see any products, Magnet wants you to know that it’s got your back with fast quotes, free samples, flexible finance options and free home measurements – all of which helps its trade customers win contracts faster.

eCommerce B2B website Magnet customer benefits

Magnet then starts to showcase some of its product offerings on the homepage but it quickly returns to promoting the benefits of its trade accounts.

eCommerce B2B website Magnet benefits to trade customers

By the time it comes to browsing for products, getting quotes and making purchases, Magnet trade customers have already bought into the service and the company lays foundations for customer loyalty, repeat purchases and maximising customer value before a single product is bought.

Building better B2B eCommerce experience

Hopefully, the examples in this article inspire some thoughts about delivering an improved eCommerce experience for B2B buyers and you can find more insights in the following articles.

As always, if you need dedicated support for B2B eCommerce design or marketing, you can speak to our team by calling 023 9283 0281 or filling out our formAlso check out our eCommerce SEO and eCommerce PPC service pages for more information about how we can help.

Kirsty McLean profile picture
Kirsty McLean

Kirsty joined VL in January 2019, and has been working hard to come up with new ways of working which support the creative team and make life easier for our clients. She has always been interested in how things work both digitally and practically, and her role at VL allows her to explore both of these interests, using tools like Asana to enable more efficient delivery of complex projects. An English Literature graduate with postgrad certification in project management from APM, she has over 12 years’ experience in digital marketing, leading teams and innovating processes. As a highly experienced digital project manager, she’s delivered over 50 successful web projects, worked on rebrands, video shoots and AR apps, and been to A LOT of conferences. Her previous roles have seen her jetting over to Shanghai to project manage an international graduation ceremony, custom designing a recruitment process which was then rolled out across 65 schools, and shipping a website and three apps which promised to change the entire music industry. Kirsty loves being surrounded with creative people, extending this to her home life with her graphic designer husband and her two artistic daughters. It’s tough to be the only practical person around, but luckily she enjoys organising people at home as well as at work. Things Kirsty enjoys are reading, travel, feminism, houseplants, music, spreadsheets and photography. Her greatest fears are institutional chaos and running out of teabags.

More articles by Kirsty
Related articles
SEO strategies for B2B eCommerce companies

SEO strategies for B2B eCommerce companies

By Dave Colgate
Report: Q4 2020 Google trends for the B2B eCommerce industry

Report: Q4 2020 Google trends for the B2B eCommerce industry

By Michelle Hill
12 key features of a B2B eCommerce website

12 key features of a B2B eCommerce website

By Gabe Keegan