Here’s captain obvious (yours truly) with an extra special observation for you:
BAR WITH SPECIAL MESSAGE
LOGO PLATFORM↓ SOLUTIONS↓ PRICING
BOLD STATEMENT
CALL TO ACTION
GRID OF LITTLE ILLUSTRATIONS
LARGE BOLD FOOTER
©2018— Chris Coyier (@chriscoyier) January 30, 2018
It came across as (particularly trite) commentary about Website Sameness™. I suppose it was. I was looking at lots of sites as I was putting together The Power of Serverless. I was actually finding it funny how obtuse the navigation often is on a SaaS sites. Products? Solutions? Which one is for me? Do I need to buy a product and a solution? Sometimes they make me feel dumb, like I’m not informed enough to be a customer. What’s the harm is just telling me exactly what your thing does?
But anyway, people commenting on Website Sameness™ has plenty of history onto itself. One of the most memorable stabs was from Jon Gold:
which one of the two possible websites are you currently designing? pic.twitter.com/ZD0uRGTqqm
— Jon Gold (@jongold) February 2, 2016
Dave Ellis has a good one too:
They style itself is now so mainstream that clients ask for it. It’s happened to me, more than once. I’ve created sites that follow the formula. This surely is another reason. If clients are seeing a lot of sites that are the same style, it’s causing them to ask for it.
Mary Collins says Dave’s sentiment rang true right away:
Myself, I’m not sure how much I care. If a website fails to do do what it sets out to do, that, I care about. Design is failing there. But if a website has a design that is a bit boring, but does just what everyone needs it to do, that’s just fine. All hail boring. Although I admit it’s particularly ironic when a design agency’s own site feels regurgitated.
My emotional state is likely more intrigued about your business model and envious of your success than eyerolly about your design.
As long as I’m playing armchair devil’s advocate, if every website was a complete and total design departure from the next, I imagine that would be worse. To have to-relearn how each new site works means not taking advantages of affordances, which make people productive out of the gate with new experiences.
It’s probably fair to say, though, that design uniqueness and affordances need not be at odds. Surely you can design a site that is aesthetically unique, yet people still know how to use the dropdown menus.
There has been a lot of scapegoats for Website Sameness™ over the years. The popularity of frameworks. Flat design as a trend. Performance holding back creativity. User expectations. Research telling us that our existing patterns work. The fact that what websites are all largely trying to do the same things. Even responsive design is a popular whipping boy. We might as throw style guides / pattern libraries on the heap.
So again, I’m not sure how much I care. Partially because of these two things:
- Designers have all the tools they need to make websites as unique as they like.
- There is an awful lot of money in websites, and an awful lot of people trying to get their hands on it.
If design uniqueness was a lever you could pull for increased success for any type of business, you’d better believe it would be pulled a lot more often.
In that respect there’s a question I’ve been asking myself for a while: what makes people start from blank sheet, go vanilla JS instead of jQuery, etc. To ultimately converge towards website sameness?
Last time I faced the problem, I tried to advocate the use of Bootstrap, trying to make an analogy with a Linux distribution. I was arguing there were basically 2 ways:
– take the kernel, choose an init system (init vs upstart vs systemd), basically assemble everything from scratch…
– or derive from Debian or Ubuntu
IMHO one seems less painful than the other. Choosing Bootstrap or Debian looks like a safer bet as you benefit from thousand/millions of other people testing the thing with you.
If your primary mission is to build a website for a client (who is likely to ask you to build a site that resembles the others). Or if your primary mission is to build a website for your own company, which uniqueness isn’t its website. And if you’re statistically predetermined to converge towards website sameness whatever the reasons… Why are you starting from scratch?
When you’re in the web designer shoes I understand it is harsh to get told “just use Bootstrap and tweak knobs”. I can hear that voice that says “my craft is worth more that that”, often rightfully so. But at the same time you’re going to be the one ironing things out for less popular browsers forever (and no, IE is not the only browser you’re leaving behind when overlooking this question). You’re the one going to realize these few lines of CSS and JS have now piled up. So what is it so unique on your site and in your craft that Bootstrap or Foundation or Bulma can’t achieve?
Beside “there’s no accounting for tastes”, it seems to me you better have a strong reason to depart from standing on giants’ shoulders.
What do you think? Is what you just read short sighted?
Good article Chris. I only disagree with one thing:
“Designers have all the tools they need to make websites as unique as they like.”
CSS is entirely too limiting and complex for a design environment. Whenever I try to design something unique I end up hitting against what CSS expects me to do, which is not what I want to do.
And the underlying complexity of CSS has made it very difficult to create design tools that leverage its power. I see the maturity of web design tools at 2 on a scale of 10, while Photoshop for comparison would be around 9/10 for bitmap editing maturity.
Personally I hope web design will see brighter days ahead.
Oliver maybe you can start learning Gridd css / variables / and animations.. there you can see how much far you can go…
In terms of UX design I will say :
1st is better designed (I mean in the wireframing persperctive as far as it is not real content yet)
The reasson this works for the majority of clients is becouse they can show their info in the home in a simple and sintetic way. One claim / 6 content options and only one CTA, that means only one action and enough information to take a decision ( as a user).
Could work as a landing page for getting leads, one of the most valuated things for a business.
Only thing is that is to obbius this is the easy way by far.
Right one has 3 type of content and 3 CTA.
At that point this site is just informing with apparently not a clear objetive.
It has a problem:
It has been proved Zigzag does not help reading in the web. (Not me but Jakob Nielsen in his usabiliti blog)
https://www.nngroup.com/articles/zigzag-page-layout/
Could work nice for a page that shows 2 products. But actually there are 3 CTA that means 3 options for the user. Wich them will the user take?
Why stills working as a trend?
1 We dont need to come with good content to make it shine. Client will not give you a good one.
2 Actually it is so easy to do so.
3 Works for getting leads if you put enphasis in good copies and good content.
Why designers complain?( I will like to belive is the 1st)
Actually this conversation should be about a mobile firts wireframes as far as some pages are now in 70% mobile trafic. So there is no problem (both will look the same in mobile. only a problem with CTAS)
1/ To come up with a propper solution based in bussines decitions and not only on a aesthetics is so complicated. to many layers of people will complain. And then you are just the designer.
2/ Becouse they thing only aesthetics are important. And they dont give a shit about understanding “the medium”
3/ Last one but not less important understanding who will be the user, what kind of needs they have. How they consume information. What will be the fundamental goal of this page they have to acomplish?. Geting leads, just inform users, or whatever.
Please can you share an example of your design? I’d like the challenge of getting something in front of me where are tools are too limiting — perhaps a dropbox or WeTransfer link would be good.
Mazu, why would you begin your comment by assuming I don’t know CSS Grid or CSS vars? I have been diligently learning as much of modern CSS as I can, grid and CSS vars included.
Grid helps a lot but is not panacea.
I like analogies. I think websites are approaching where cars or houses have been for a while (broad strokes the same, but with artistic liberty within the confines of those broad strokes).
With cars, four wheels is the typical norm, with passengers situated between the front and back wheels, the engine up front where it can contribute its mass to protecting the passengers in case of a head-on collision, etc.
With houses, 90-degree angles are the norm, with curved walls typically avoided. Windows are often from waist to above-the-head height, roofs are angled to deal with precipitation, etc.
With websites, the same patterns are emerging. Navigation is at the top, an attention-getting element below it, and a breakdown into details somewhere beneath that. These are patterns that—over the course of ~20 years of website design—work well. Not everyone uses the same colors, imagery, element sizes, and whatnot, but there’s definitely a basic, functional (and thus attractive) form to it all.
I can totally understand the popularity though. It’s minimalistic, easy, logical and looks nice. Clients have often seen this kind of layout before, and wish for their site to look similar because… well, they know it works! From a user perspective, the consistency across the individual pages and different websites does have its positives. Websites like these don’t require much cognitive load due to the predictability. Users know what to expect and where to look for certain information. Now, with that being said, it has also lead to a downright ludicrous sameness. It’s down for me right now, but Every Fucking Bootstrap Site Ever really nails it down (just like the tweets in this post). No wonder the brutalist web design movement has exploded like it has!
As much as I love WordPress, I think the emergence of themes also has a lot to do with it. Buy a theme, update the content and images and you have a new website.
I love this article and I love the specific quote above.
Thing is whatever reason they are giving you not to be a customer is fine so long as they are not targeting you, and they are not FMCG / mass-marketed.
Olivier – I think CSS Grid will help that. Sure, a lot of people will just use it to rebuild designs like this but it can do a lot more.
On this site trend – it’s familiar and ‘works’ (though I wonder how many people who assert this have tested against a different design) but I wonder if we’re trapped in a local maxima. Even stipulating that this works well is it the best possible design for all kinds of sites? I think that’s unlikely. However, if it works well and is easy to make responsive it’s hard to argue for testing several other designs which will take a lot of design and dev time and effort (and thus money).
One problem is, that people stop design websites at all. They setup a template and use it for wireframing till the website is ready for launch.
Next Problem is the concept of »Sidebars« in any Form. For »non UX Designers« this is to hard to think about. They are basically overwhelmed by finding solutions to responsive problems.
50% Screen/50% Printdesigners are happy to jump on the »Bootstrapping train of thought« because they heard to often »this is not possible.«
Free yourself of limitations — kill the idea of »Mobile First« — go and create visual stunning stuff — find technical and SEO-solutions later. – Or implement an affordable website with a Theme and a CMS.
Yes, free yourself from the shackles of designing a first class experience for the >50% of people who will visit your site on their phone.
God, I can only blame Bootstrap* …. ( * correct, I’m not really a fan ). I’ve been there a few times where you design something, perhaps with some new ideas and then when the developers get it they just template Bootstrap it, don’t deliver, and use technicalities as a rationale for why your design can’t be done. ( they just can’t think/code outside bloody Bootstrap )
They can. It just comes down to budget. Development of a unique design takes 5-10x longer than is budgeted. I’ve tried to provide clients quotes saying that design is £x amount, build is £x*5 amount. Not only does the client complain, but our Creative Director complains too as to why it’s not 50/50 split. The outcome is a regimented design where a framework takes up the bulk of development.
“when the developers get it”
So give it to them earlier and involve them. Some designs can’t be done, Bootstrap or no.
Over a decade ago we didn’t have the constraints as people could build sites to be pixel perfect interactive bitmaps using Flash. And oh wow talk about usability nightmares!
The trend for design has become more regimented, but usability dictates that you should stick to what people know. Also, having first hand experience, there is simply is not enough money in 95% of website jobs to allow for unique designs and the necessary time and expense of researching whether the designs work. Good photography, font usage, and illustrations can often provide the necessary uniqueness, whilst keeping the same framework; all for a cheaper price.
I do think there will be a bit of a renaissance soon in web design as new techniques such as CSS Grids allow the shackles of design to break out the old floats. Perhaps this time round, it won’t be the mess it was in the late-90’s/early-00’s.
This is very interesting, however I feel like sameness is not really unique to web design, it’s all around “traditional design” too, Business cards are one example, or… you know… books.
I feel like this is mostly what the medium looks like and like both books and business cards even if structure is “recognizable” design details will always be there to make a difference. This does not mean we should not try to achieve uniqueness, it just makes it special when we do.
Front cover
Inside cover ©️2018
List of content
Preface
Content (normally in chapters )
List of relevant books
Author Bio
Back cover
But nobody’s complaining that books are structured too similar…
Have you looked at Korean websites? They’re basically all the same, and have been like this for 10 years or so. They follow a pattern partly, I think, to make things easier for the end user.
It’s just functionalism for “the digital age.” Everything’s a cycle!
Let’s compare website sameness to something else that took awhile to develop, oh say the automobile. There are many elements that don’t change …4 wheels …steering …seats …doors. if you took almost any of these features away, or radically changed their function or design, people would think you were crazy. We still use the round wheel today because whether you dress it up or down, it just works flawlessly. Ubiquity-ness is common. Call it “boring” if you will. But it’s what enables anyone who has driven a car, to be able to jump in some other car and be on their way with out too much familiarity needed.
You choose to make the car a pedestrian model or a Cadillac. Just leave the engine where it’s at.
Well, comparison with car manufacturing industry is not relevant. I tell you why – I studied Industrial Product Design.
Automobile Manufacturing Industry is an extremely expensive process that requires much more resources than people. Besides it’s a big ecosystem of complex economic dependencies. It’s bound oil/energy industry, it’s bound to tire industry, it’s bound to metal industry. It’s extremely delicate business because if you do something wrong: there happens accidents and people die. And there’s a huge competition. If you deviate a bit, you risk to lose all your credibility and share in the market.
Though still, there’s a lot of stupid norms that manufacturers thought they had to continue: like dependence on fu.king oil. Until Elon Musk invented Tesla…
So you’re saying that web design is like automobile industry? Excuse me, this is outright irrelevant. Of course, people are conservative and they like to be used to seeing things in the same order even if it was terrible (microsoft designs…). But this doesn’t mean some evolution shall happen, and there’s any big risk to it. There isn’t. We have to move web forward: Because it’s cheap, it’s easy, it’s for all. One only requires knowledge, skills and a computer to build a website (and a hosting of course). It’s nothing like a car industry.
If people were truly conscious and cautious about their decisions and actions, they would already have stopped wasting their times on facebook sacrificing their data.
Web design has a lot more to evolve. And we the designers are responsible for that. At least a bit. Otherwise who?
What you’re proposing is a disruption in the current web rut we’re in. It requires not only some strong originality but some advanced web dev chops. That’s a rare breed. Those breeds do command a high price, and usually it’s not easy to replicate. When it becomes easy to replicate, that’s when it becomes commoditized, like the designs we see everywhere today. And there’s a rush to cash in on it, and then it becomes the norm.
I would compare the websites of today to the iPhones of today. Incremental changes that are mostly marketing hype and little incidental features that are added here and there courtesy of hackers whose ideas were bought and popularized or copied. New back-end editors, chatbots, animoji or what have you. But something big’s got to land for wholesale improvement, in both design/affordance and style/appearance.
I read many comments on this article and I have asked the question “SAMENESS”. Let me qualify myself, first I have been doing this since the internet came out from Unix Software Labs and I have seen many changes. We need to remember that websites are a tool for making money. If they don’t do that then the design does not matter. First we must consider client persona, who are you selling to? Next, prototypical which means “SAMENESS”. People are used to seeing things a certain way and when we try to do something different people will say “That won’t work”. Here is a perfect example: They said that 30-second or less social media is what we should create. I went in the other direction for 2017 and marketing stats shows that social media of 60-90 seconds get higher engagement. Now, in regards to web design, I am doing mixed media websites(video/animation/music) coupled with social media. The one-size-fits-all does not work anymore so someone has to do something different and it might as well be me. AMP site with video in development right now. I do the website, video and animations because of my creative vision. Creativity cannot be taught. The pilot episode of Star Trek failed but look what it spawned. Keep trying, good luck and see you at the movies. LMAO
Nice stuff!
Well CSS-tricks is different – big navigation bar at the left – does anyone have any serious usability issues with it?
https://twitter.com/dbox/status/748175612762685440
Steven Hay:
Funny, I was just in a design review meeting yesterday where someone wanted to change the name of a standard header link because it was too “boring” and was named the same as on every other site. I argue that was a good thing, as in, I know what that link will do just by looking at it, so don’t make me think!
Sameness is neither good or bad. It’s a state of being. Understand how to use it and you make sameness an advantage. As others have mentioned, when sites provide functional sameness they reduce the need for users to learn a new system. In this sense you can use sameness to improve the end users experience.
On the other hand, if you’re a “designer” and your site looks the same as all the others, you’re not trying hard enough. @Oliver take a look at sites like the Awwwards and the CSS Awards to see how far you can push design. CSS is not a cause of sameness.
It requires thought to know when sameness is good and when it’s not.