Web Design for B2B Commerce and Ecommerce (With Examples!)

Web Design

a laptop, ipad and iphone all alongside each other


15 min read

Web design for B2B commerce and eCommerce has become absolutely essential for all businesses.

Even in the past five years, the business to business sales landscape has shifted aggressively into the online sphere. The development of easy sourcing from China via dropshipping, FBA selling, and easier access to direct selling has also led to a boom in eCommerce.

This means that the sales environment online is more competitive than ever, and the marketplace is far more cluttered.

So how do you rise above the competition and get your offering noticed?

Well, this is an answer that people have been pondering since the very beginning of trade, and thankfully even in the digital age the answer remains largely the same.

You make your storefront the most attractive one.

desert road

Ice Cream in the Desert, and What It Can Teach You About B2B Commerce

Picture this…

You’re walking along a hot, dusty desert.

You haven’t seen another human for miles and miles, and the sun is beating down on your back.

Your throat is parched, and your lips are cracked.

Suddenly, almost like a mirage, ahead of you in the middle distance, there are two ice cream vans.

As you get closer, you see that one of the ice cream trucks looks a little bit beaten up.

One of the headlamps is smashed, they have a flat tyre, and the board listing the ice creams is dirty and covered in sand.

The other one is gleaming.

Bright whites and blues, immaculately clean and shiny, and the board listing the ice creams for sale is bold and clear and easy to understand.

Instinctively, which one do you approach?

I know that’s a bit of an unrefined example, but it holds up.

If your website- your digital storefront- isn’t maintained and kept as well designed and clean as possible, people will be turned off of your business.

This is the number one reason for B2B Commerce and eCommerce websites to be professionally designed.

Well designed websites convert.

In the end, it’s important for businesses to be able to feel proud of their websites, and for their branding to be beautiful and clever, and all of the marketing to be firing on all cylinders.

However, none of that is worth anything if your website doesn’t convert.

So, let’s stick with the ice cream truck metaphor for a little while, and use it to illustrate other reasons why web design for B2B commerce is absolutely vital.

ice cream truck

Web Design- Putting your Ice Cream Truck at the Front of the Queue

Ok, so- same scenario. You’re walking through the desert.

You’re too hot, and all you need is a cold ice cream to keep you going.

Then, suddenly… there on the horizon- ice cream trucks.

Hundreds of them- possibly thousands!

They are all lined up, 50 yards apart, all the way down the side of the road.

You’re 50 yards away from the first one, 100 yards from the second one, and so on and so forth, as far as the eye can see.

Which one are you going to go to?

It’s the first one you come to, right?

Again, it’s a bit of a blunt way of illustrating the point, but it’s still valid.

The age of technology is the age of convenience, and speed.

People don’t want to waste any time getting to what they want.

As above, even if your branding is on point, your marketing is working, your products are industry defining… it doesn’t mean anything if you have no one to sell to.

When people use search engines like Google, or even use voice search on an Alexa or Siri, they rarely stray from the first page.

Official stats say that only 12% of users click through to the second page of Google, and Google, as a business, is constantly working to get that figure down.

They want to serve the best content to whoever is using Google.

That naturally results in one thing, and one thing only:

Well designed websites rank well in Google.

If your website isn’t professionally designed, with a good understanding of user experience, user interface, and load speed times, it won’t have what the Google algorithm is looking for.

It won’t be served to your potential customers unless they are already searching for you specifically (and sometimes not even then!)

Think about the line of ice cream vans. Even if the ice cream van 54th in the line did the best ice cream in the world, would you ever have found that out?

Good web design puts you further up in the Google rankings, which puts you higher in priority for customers.

But it isn’t just that.

Bad web design will drive your rankings down in Google, and can be hard to recover from. The damage can’t be reversed simply by updating your design, because a negative user experience damages not only Google rankings but your overall brand.

One last extended metaphor based around ice cream trucks in the desert?

ice cream flavours lined up

Web Design- Putting Your Ice Cream Out There

You’re no longer in the desert. You’re now the CEO of an ice cream company.

Someone calls. They say they were lost in the desert and came across an ice cream truck.

Your ice cream was the best ice cream they’d ever had.

They want more of it.

I think I might have just stretched this metaphor to it’s absolute limit, but bare with me.

In this instance, the ice cream truck isn’t your website, but the ice cream.

Your ice cream is excellent, and flavoursome, and does everything it should do.

So people stock it.

If your website is good, and well designed- people will link to it from their websites.

You’ll build something called a backlink profile– a host of referring domains and links out from other people’s website to your own.

If your website is well designed, people will consider it a mark of quality, and not worry about linking their blog to yours.

If your website is poorly designed… well, typically the only way you’ll get backlinks is from roundup posts about web design mistakes and the worst websites on the net.

Not exactly the kind of referrals you’d like, presumably!

A well designed website is an indicator of brand quality.

Your website entirely reflects your business. It is your first impression, your marketing, your brand, your offering… everything!

If you attach yourself to something that isn’t 100% functional, powerful, contentful, and graphically appealing, you are only harming your business.

At Canny, we create bespoke websites that are made with usability and conversion in mind.

From your businesses’ visual identity, building a fast, responsive, mobile friendly website, through to search engine optimised marketing and blogging, Canny offer end to end marketing and web design solutions.

If you’re ready to get started on your web design project today, get in touch with us and see how we can help you get the best out of your digital presence.

And I’m finally putting that ice cream metaphor to bed!

Now, let’s look at some of the best (and worst) examples of web design!

a cowboy

Web Design: The Good, The Bad, and The Ugly of B2C Ecommerce

When we’re talking about good web design, it would be really easy- if a little arrogant- to just link to the our work section of the Canny Creative website. We make really, really good websites- websites that work AND convert, creating notable uptick in sales and revenue.

To try and keep our expert web development team at least a little bit humble, we’ll avoid selecting our own work- at least for the time being!

As tradition dictates, let’s start with the Good- some of the best web designs on the net that nail the key elements of good web design.

screenshot of the woven site

The Good

Woven Magazine

First up is Woven Magazine.

This online publication celebrates the work of artists, craftsmen, and creators, across the globe. Their website is a joy to use and very aesthetically pleasing. Using large banner images which take up the full width of the screen, it’s powerful and entices you to read further into the top stories.

The colour palette is clean and minimal, allowing you to easily digest the content. There is just enough white space without seeming too bare, and each image is beautifully balanced with text.

Simply Chocolate

Next up, we have Simply Chocolate.

I was craving chocolate after just looking at this design!

Maybe I’m just hungry with all of the ice cream and chocolate flying around in the blog today!

Utilising full width banner images and a vibrant colour palette, you just want to pick the chocolate bars out of the screen. The 3D appearance further adds to this appeal and makes the site more engaging.

The website also front loads the actual product. It shows exactly what it is that Simply Chocolate has to offer, all of the reasons why you might want it, and how to get it.

This sort of streamlined user journey– a basic flow of a typical consumer’s journey down the sales funnel- is exactly what good web design looks like.

You also don’t feel overwhelmed while you’re browsing as there’s a lovely balance between text and imagery.

The CTA is also beautifully placed as you scroll through each bar and makes for a good user experience.

Screenshot of the UAT website

The Bad

University of Advancing Technology

Moving to the other end of the spectrum, we have the University of Advancing Technology.

Now you would typically think a university with the word ‘technology’ in would have a half decent website, right? Unfortunately for this American based uni, it couldn’t be more different.

I still feel confused after looking at it! From moving images to fast changing colours, there’s just too much going on. And as far as navigation goes, I’m still yet to find the menu.

Using a carousel style on the homepage, the menu seems to change each time you scroll along. Very off putting!

007 Museum

What words spring to mind when you think of James Bond? Cool, sophisticated, and suave perhaps? None of these words come to mind when you look at the 007 museum website. I’d say painful, cluttered, and clueless are more fitting.

I have never seen a homepage so long. It’s full of random fonts, images, hyperlinks, and icons, creating a very confusing design. Is the content meant to be left aligned, right aligned or smack bang in the centre? Who knows, it changes throughout each section.

There’s absolutely no consistency and you’re just bombarded with content at every scroll.

90s website design

The Ugly

NEW Accountancy Services

When visiting the website for N.E.W Accountancy Services, I genuinely got a headache! They’ve purposely made the design look old to reiterate the fact they’re an established business who have been around longer than their competitors.

Whilst the idea might have sounded good, the execution is appalling. From using bright green text so it’s barely visible, to featuring out of date social media logos, the website is difficult to understand for even the most experienced of users.

And more annoyingly it doesn’t make sense. It doesn’t communicate expertise or credibility (which I’m assuming they were going for) but instead looks silly and in need of some serious TLC.


Craigslist is an American advertisement website with sections dedicated to job adverts and homes for sale, among other categories. Since the 90’s, this site has remained relatively untouched.

In terms of design, it’s very, very dull. There’s quite literally no thought gone into the design, including no fancy logo or use of imagery. Instead it does what it says on the tin. You simply click onto your city, and find what you want.

However, it does follow classic tenets of good web design, which is why it is so popular. It has a lean user interface, meaning there isn’t much to do on the site other than buy (or sell).

It has a developed, intelligent, and suitable search.

It has great responsiveness and load times, and serves consumers with what they want- fast.

It’s so straightforward and that’s what users love.

This is an instance where functionality of a site trumps the design- and that only works because Craigslist pre-dates the need for great web design as it started in 1995.

Craigslist is such a strong and established brand that it can stand on that and that alone. Craigslist registered a profit of 500 million dollars in 2016 (the most recent report I could find!).

Imagine how successful they’d be if they had a better website!

Well, they might have taken a larger slice of the proverbial pie away from some serious big hitters in the online industry- Ebay, Amazon, and more recently social media marketplaces to name a few!

marketers pointing at a screen

Web Design: The Good, The Bad, and The Ugly of B2B Ecommerce

The rules for B2B web design are a little different. The user journey is everything, and needs to be first and foremost in every web designer’s mind. Whilst having the ability to add a load of custom graphics and animations to your site is great, too many can slow down loading speeds and clutter the website.
Marketing to businesses has a different psychology attached to it.

Fast loading, convenient, easy to use websites are still vital, but there has to be some information provided alongside that because the buying process is less impulse driven. Generally speaking, hard stats and figures work better than softer descriptive text blocks.

You aren’t selling to an individual directly, you’re trying to help an individual justify their financial investment in your product to their company.

With that in mind, let’s take a look at the good, the bad, and the ugly of business to business website design.

Asana website screenshot

The Good

Canny Creative is a web design agency based in… just kidding!

Although the Canny website is a brilliantly designed and optimised website, we’ll not feature ourselves in a ‘best of…’ list.

No, first up is Asana.


Asana’s website is clean, fast, and gives solid examples of exactly what you’re paying for- illustrated graphically and in writing.

Asana’s website uses colour really well as well, highlighting key points without overloading the user with too much information.

Add to that the clear calls to action placed strategically throughout the blog, and the easily navigable top bar, and you’re onto a clear winner.

Asana have clearly considered a typical user’s journey, what information people need in order to get to a buying mindset, and know what their customers want.

The simplicity is what wins it for me, every element on the website is clearly pulling towards one thing and one thing only- there’s no extra fluff.

Very minimalist, very focussed, very cool.

Very well done, Asana!

The Bad

For the bad, we’ve painted ourselves into a bit of a difficult corner, because there isn’t much to talk about with this website at all.

We’re looking at the Interrupt Technology Corporation website.

This is the entirety of their website:

interrupting technology corporation

Why do this? This website is infuriatingly pointless.

The only half reasonable argument I can think of is from a brand protection point of view, camping out some content on their (actually potentially valuable) domain name.

The thing is, no matter how basic this website is, it is definitely costing some amount of money to maintain, whether that be hosting charges, domain name upkeep, even paid SSL certification if they do everything else themselves.

Why wouldn’t you optimise it to do something?

Bad, but deliberately so (I think?). Still an incredibly frustrating approach to website design.

The Ugly

Pacific NorthWest X-Ray Company

I wouldn’t buy from this company if they were giving equipment away.

There are no words to describe how badly designed this website is. From the horrifyingly large cumulative layout shift caused by the background, to the animated logo that looks like it was ripped straight from an early noughties MySpace page, this is a masterclass on how not to design a business to business website.

If you look at the first website, Asana, side by side with the Pacific NorthWest X-ray Company’s website, you’ll be able to see everything that differentiates a good B2B website from a bad one.

They’re chalk and cheese.

The one good thing about the Pacific North West X-Ray Company’s website is that it’s pretty geo-specific, so from an SEO point of view they probably don’t do too badly in their ultra niche, ultra specific offering.
Outside of that though, I’m struggling to find an upside.

website design

Web Design for Business to Business Commerce and Ecommerce

So there you have it! Good web design for B2B websites means always considering the user needs first and foremost, optimising loading times via lean, minimalist design, and making sure that all elements of the website are firmly aimed towards providing information that helps a user on the buyer journey.

Web design in business to business commerce and ecommerce is vital, as it builds trust, drives business, and reflects your brand.

If you want to build a website that looks great, ranks well in Google, and puts your products in front of the right eyes every time, then get in touch with Canny and see what we can do for you and your business.