Why do all websites look the same?
medium.com
medium.com
1) Why are all buildings the same? Light switches are often in similar places and the space between the floor and ceiling is pretty standard.
2) Why are all vehicles the same? Mirrors are always in the same spots and seat belts all work the same.
3) Why are all laptops the same? Keyboard center on the bottom with a trackpad or nub near the center. Screen on top, ports and stuff on the sides.
There are components that are common in all facets of our lives that when different can cause problems or surprise which could be good or bad. We need to join two floors of a building. Use stairs! People understand stairs. We need to showcase a collection of clickable images. Use a grid! People understand link grids.
If you want to make your website usable you have to lean on expectations and those are pretty well defined nowadays. Imagine walking into a room and turning on the lights using a switch in the middle of the floor or plugging in your laptop's power cord at the top/back of the screen.
Most companies spending money on a website want them to feel fresh and creative and engaging but they also have to temper that with usability and expectations. That's why all websites "look the same" or at least why the author thinks they do.
Just because certain elements are in the same spot(s) or behave similarly doesn't mean things are the same. Or, at least, to me they aren't.
For ~500 years, books look approximately the same: normally paged sideways (not top-down), with some margins for handling, with text in rows or columns (depending on the writing system), some chapter structure, and index / contents page, page numbers, covers of more durable material to protect the pages, with some kind of a title on the top cover, etc.
Those features don't just exist because of tradition or technical limitations. They mostly exist because they are convenient, useful, and logical.
But they also exist because people expect them, from times of handwritten books. They put the skills people already had to good use. They created a visual language which is easy to pick up and easy to use, both for readers and typesetters.
Most web sites are a logical continuation of books, magazines, newspapers, etc. No wonder they actively adopt the time-proven, well-working concepts from the print media.
Forms have a much shorter, and much less rich history outside web, and here experimentation was wild; a lot of sites do forms quite differently. Though some common language (like labels, placeholder text, pre-validation, etc) already has formed. OTOH even checkboxes are not yet a commonly accepted visual concept; some e.g. prefer "switches", iOS-style.
What happens, when, in the words of the article, you "Do not be constrained by questions of usability, legibility, and flexibility"?
The answer, it appears, is their re-design of HN: https://interface.fh-potsdam.de/future-retro/HN/ which I find unusable.
The expanded view with lines between comments and their parents which scroll independently is literally the worst website UI I have ever seen. And I recall some terrible flash abominations.
That is, create a work of art (as opposed to utility). Okay, art is nice, too.
But mixing artistry and utility is quite hard. Designing a nice, livable house, or a store, is a craft. Building fancy sand castles is a (pastime) art. But mixing the fancy free-form with being actually usable by thousands takes lots of work, resources, and time, because what you'd have to build is a cathedral. (If you think modern technology makes it simple, look at the history of building the Sagrada Familia in Barcelona.)
Web sites have a similar popular anti-feature that's included for reasons of social status: low contrast text. I think this is popular because ability to easily read it signals both health (good eyes) and wealth (good screens).
Perhaps. But I always presumed the good eyes, good screen, and lack of empathy belonged to the designer. These same site too often seem to have experiences based on an ultra-fast connection, as opposed to a wonky 4G (at best) connection.
You might be right. But I've sat in meetings and/or shared office space with low-UX-IQ designer / frontend types.
Fortunately extensions like Stylus allow to tweak page styles to make them more usable.
That should barely be the case with a good layout and hyphenation algorithm (or a competent printer in the old days). What word processing software does is not necessarily the best possible way to produce an even justified layout.
I think you can even go back as far as 1000 years to find those same standards. https://en.wikipedia.org/wiki/Carolingian_minuscule
True, but print media formats got even more simplified in web. The reason? Responsiveness constraints.
Many times I've seen great advanced "article-like" designs for desktop from ambitious designers. It turned out that making them easy to manage in CMS, stable in all possible combinations (or implementing good validators) and at the same time logical and good looking on mobile was extremely hard and not worth it.
This led to further simplifications...
... and then Medium looks like Medium.
There's not much place for creativity on mobile. And this is where most of the "fast content" is read.
Some flash sites were horrible. But there were some real gems. That Hacker News design by Tyrion's brother is probably inspired by a bunch of old Flash sites that followed that template.
Flash was so easy to work with. Draw some neat stuff with their tools, animate it in the same program with their timeline, then make it all navigable and smart, still in the same program. You test it, in that same program. Then you publish it, and it works exactly how you made it work, in every browser, ever. One file. So easy for artists, designers, and non-technical people.
That's why we don't see cool shit on the web anymore- it's too hard/boring to make.
The people who designed these gems would probably be able to design good sites no matter what tools they had at their disposal.
All kidding aside I think the overall level of USABILITY of websites is much higher than it ever has been today. But in large part that’s because they are all following the same foundations.
My experience of flash is that it mostly didn't work, and I had to spend an hour after every new OS install trying to get flash to work.
And copy and paste doesn't work, you can't right click to save images, etc. Unless you're trying to make an animation, or a game, flash gives a really lame user experience, I don't know why you like it so much.
At the end of the day a site is there to serve a purpose. And, generally speaking, that demands familiarity with the UI and ease of use. If every site demanded increased cognitive load from the user the internet would be a horrible place.
I get that designers want to design cool stuff. Love it. But when all the smoke and bull clears out the mission is to sell a widget, deliver a service or provide information. Craigslist and good black and white movies prove that good and useful content is what people are after, not award-winning design and cool web tricks.
But why? What about a site about art? What about a site about me? What if I don't want you to get "information" about me, but to see the world through my eyes, with the website as my lens? Sure, I guess I could post my non-interactive photos to Instagram, but that seems so... uniform.
Not every website has to make money. They can entertain just by the virtue of being interactive. And I'm not saying it's impossible to do in 2018. I'm just saying it was a much more creative-friendly experience 10 years ago, and when we killed Flash, we lost it.
We did gain apps though. So I guess there's that.
This is exactly how I remember the best Flash sites of the 2000s. They weren't creating interactives to drive some lead gen campaign, or sell their blockchain-based SaaS or whatever; it was made purely because it was cool and fun to use. Some portfolio websites for UI and FE developers still have this feel.
> We did gain apps though. So I guess there's that.
I get the sarcasm, but IMO, I'd rephrase and say "We did gain Codepen". Lots of cool visual stuff there, but I guess it would be mostly of interest to developers, and not the wider public. Still, I see stuff in Codepen daily that would never make it into a "production environment" because it didn't fit the CMS template, it wasn't responsive, or was using new tech like CSS Grid, or a multitude of the other reasons why websites stopped being cool.
I googled "cool websites" and these came up
https://www.awwwards.com/95-inspiring-websites-of-web-design...
don't know if any of those do anything for you. I'm too lazy to look for more but I feel like they are out there.
By Googling "cool sites", you've stumbled upon the crux of the issue. The site that ranks at the top is the SEO-optimized, but incredibly cookie-cutter, template-heavy Awwwards, which is a back-patting congratulatathon of creative directors at design agencies. So of course the websites featured are their own.
I'm sure at some point they wanted to feature real client websites, but chances are those were mini-sites created for specific campaigns, and were taken offline after the campaign ended.
(Giving page designers total control over scrolling was a huge mistake.)
The thing is, all that's been replaced with JavaScript, which has all the downsides (well, it's not really proprietary, but JavaScript-heavy websites aren't really usable as something to learn from & modify, especially once minification comes into play) and has the great new flaw of not realistically being disablable, unlike Flash tended to be.
We even saw this week Google deciding not to support non-JavaScript browsers.
JavaScript is a boot stomping on a human face, forever.
Did you ever use Flash? It was incredible. Draw right there on the canvas with basically Illustrator-esque tools (or just File->Open whatever .jpg you want). You can add a keyframe in the timeline, and just drag the image to wherever you want. Then you hit play, it looks right, then you hit publish, and it would play exactly the same in any browser ever.
Also, ActionScript 3 was basically typed javascript, back in like 2004.
With Flash, I once ported a game to Flash, from scratch, with art (but no sound...although I could have added sound), in the span of 12 hours, and while it wasn't my most popular game or anything I still get people telling me how much they enjoyed it 15 years later.
In fact, the most popular game I ever designed and released, Proximity, I designed and released in a single week of work (in my spare time).
I have never been able to match the speed and flow of development that I got with Flash since with any game engine since then, and I've tried a whole bunch trying to find something.
The closest thing to it now seems to be Unity but that's a much bigger beast that I don't have a full grasp on and have to look things up or download various things from the asset store. It's possible to make games quickly, but they'll probably play and look like garbage if you don't take your time with them and hire a proper artist, judging by the flood of garbage Unity games released on Steam.
Pico-8 is also fun to program with (it includes a built in sprite editor, level editor, and music editor), but it's a little too limited for my tastes, since I can't really make a commercial product with it, and I'm not that great at doing 2d pixel art. But I still spent some time doing most of a port of Proximity while playing around with it and for people who can do pixel art it's a lot of fun to use.
* 12 hour game, Squarez: https://www.newgrounds.com/portal/view/91933 * Proximity: https://www.newgrounds.com/portal/view/183428
EH?
Buildings have light switches and ceiling heights standardized because of building codes which mandate these things, and the fact that many components are mass produced so they're extremely cheap (like light switches) and are used everywhere.
Vehicles have things in the same places because regulations require it, it makes sense to do so (mirrors aren't much help if they're behind your head), and because drivers expect similarity.
Laptops are similar because that's really the only way to make them work. A keyboard over the monitor isn't usable: your arms would block your view. This is just silly.
Websites may be built with the same components (python, PHP, web servers, HTML, CSS, etc.), but that in no way means they need to look the same. It's entirely possible to make them look very different, and you only have to go to the Wayback machine and look at how sites used to look 15+ years ago, and compare to modern ones, to see this.
Basically, most of it is a cargo-cult mentality: sites update to "newer" designs that are less useful because it makes them look "fresh" and "modern" even though they waste a ton of whitespace and make the site slower and less useful. Sites used to be much better in the mid-2000s.
There's a decent amount of research that has found that putting things in non-standard locations impairs most users' ability to accomplish what they want on your website.
The Nielsen Norman Group is a decent place to find some of this research. There's some decent information here about how conventional layouts tend to be more effective:
https://www.nngroup.com/articles/horizontal-attention-leans-...
and how placing logos in the center instead of on the left often prevents users from accomplishing their goals:
https://www.nngroup.com/articles/centered-logos/
and the reason all of this matters is that the computer skills of a typical person using your website are probably far, far worse than you think they are:
https://www.nngroup.com/articles/computer-skill-levels/
so if you deviate from the "standard" layout too much, you'll hurt your website's business value because people won't be able to use it effectively.
I think there's still lots of room for creativity within a standard layout. But too much creativity might result in a site that looks better from an aesthetic standpoint but is less effective at actually delivering business value.
You mean similar to included youtube videos, Facebook like buttons, Google analytics, ...
> Vehicles have things in the same places because regulations require it, it makes sense to do so (mirrors aren't much help if they're behind your head), and because drivers expect similarity.
GDPR cookie settings? Imprint? Privacy statements?
> Laptops are similar because that's really the only way to make them work. A keyboard over the monitor isn't usable: your arms would block your view. This is just silly.
It would be silly to place the menu on the bottom, as you would always need to scroll down the whole page to see what options you have.
> Websites may be built with the same components (python, PHP, web servers, HTML, CSS, etc.), but that in no way means they need to look the same. It's entirely possible to make them look very different, and you only have to go to the Wayback machine and look at how sites used to look 15+ years ago, and compare to modern ones, to see this.
Houses may be built with the same components (bricks, wood, concrete, glas, metal), but that in no way means they need to look the same. It's entirely possible to make them look very different, and you only have to go out in the world and look at all the different implementations.
Sorry ;-)
Why it's not used extensively in web? (it would make it at least a tiny bit less boring).
On iPhone when you scroll down the page, bottom Safari bar collapses and your sticky menu would be still sticky at the bottom. But clicking any button on the sticky bottom menu wouldn't invoke click on the menu. It would make iPhone Safari menu uncollapse -> huge confusion -> potentially less engagement -> retention.
Web today is full of similar constraints. That's why there are usually one or two options that make sense and everything looks the same.
There's also the obvious stuff about top-to-bottom reading order making such a layout making the navigation much more obvious when you first look at a site (which is probably want you want for most things, although not all, which is reflected in things like blogs often putting ancillary navigation elements in the page footer).
I don't think this is a broken thing that needs fixing.
I'll also note that it has taken mobile UX designers YEARS to start moving navigation elements to the bottom of their apps, driven by larger and larger screens making elements at the top of the screen quite uncomfortable for one handed use. It's required that to become sufficiently cumbersome that the trade-off in immediate discoverability becomes worth it. And you'll note that the most popular mobile apps such as WhatsApp still have all their navigation elements at the top, regardless.
Similarly, any user experience study of a website isn't going to find that you should make your menu some diagonal shimmering nonsense, or try to convey information on the side of a spinning cube or any of that sort of thing.
Design != Art !!!
If designer is more interested in fulfilling his artistic/creative ambitions than business value for client (making things great looking, stable and reasonably easy to implement -> in budget), he shouldn't even touch digital today. It's too complex and filled with too many constraints.
But if same designer wants to make decent money, well...
With tablets like the iPad, the monitor is the keyboard, and your arm does block your view. Maybe it is 'silly' but a whole lot of people buy and use them.
There's been lots of other laptop designs, and they seemed much less silly to me than tablets. Compaq used to put the trackball on the right side of the case (even lefties I know mouse right-handed). HP made a laptop with a little pop-out mouse, which didn't even require a surface to place it on. IBM made a keyboard wider than the case, which unfolded when the lid was opened.
Everyone I know who tried or owned these laptops loved them. Why did they die out?
[0] https://www.engadget.com/2009/01/26/lenovo-w700ds-laptop-rev...
They demoed it and apparently the unit they demoed was stolen when they were leaving the show.
Not going to lie, I’d love an Acer Iconia style portable at this point. Wouldn’t use it for desktop publishing or probably anything with heavy typing, but just seems like a fun form factor.
Websites are far faster than they've ever been in the past, even with the bloat of frameworks and fonts. Most sites load in < 5s these days. That was not the case 15 years ago.
With today's speeds, the older internet is so much faster than “modern” sites. Some sites even have a loading bar (ex: gmail). Compared to sites with minimal/no Javascript, they’re much slower. 5s is not a good load time for a webpage especially with today's internet speeds.
I completely agree. I work to a perf budget of 200ms to first paint on the things I build. 5s is a huge amount of time to wait. It's the upper limit of what I think is acceptable.
It's not a valid comparison at all. Compare the time it takes to download and install Thunderbird versus the time it takes to log into Gmail, and there you'll have a valid comparison. Compare the time it takes to install Office versus the time it takes to log into Excel Online and there you'll have a valid comparison. And in comparison, it's a hell of a lot faster.
And yet the Gmail experience is not significantly better than non-JS alternatives, at least for m my use cases.
Yes they could be faster, but most are still useful at a 5 second load time.
In what is most likely a parallel universe that I inhabit, websites have been getting consistently slower for a while. No amount of edge black magic can compensate for the growing bloat of fonts, frameworks, multiple-dozen-megabytes background videos, and half a thousand requests to ad networks.
I had a cable modem 15 years ago. Pages loaded faster, even though I had 1/10th the bandwidth that I do now.
A while ago most people didn't realise to what extend loading times affect engagement.
If they knew, flash would be dead much quicker.
That's not true at all. Buildings are often very different from one to the other in both exterior design and internal layout.
In my experience, even light switches in commercial buildings are often in very different spots to where you'd expect, relative to a normal residential house. This is partly due to lights being switched on from one central area, and not being something normal visitors or workers of the building need to use. These are fittings anyway, not "the building".
Actual building architecture and interior design is very diverse, so your analogy here using buildings is not a good one to compare with the often identical website layouts seen everywhere.
You may not notice, but ceiling height varies regularly from 7.5 to ~10.25 feet, with absolutely everything in between represented. Only in a relatively small subset of large, wood-framed houses is it somewhat standarized to 10-and-a-bit feet.
Lightswitches are crammed in wherever and are very often a case of "yeah, looks good." Often a contractor will have a height he has people put them in at, but it varies from person to person. 4' is the most common but there is no code for it like there is for walls or railings.
Light switches themselves are all dictated by standardized form factors because different companies make the boxes, switches and faceplates and all need to agree on where the screws go for anything to work. Software, particularly web dev, is hardly limited by that. Design rigidity and similarity is dictated by convention, not necessity.
> Why are all vehicles the same? Mirrors are always in the same spots and seat belts all work the same.
Those two are laws. However specific shapes, measurements and ratios like hood height, hood length/windsheild size, and body shape are all extremely similar in order to very aggressively optimize aerodynamics and crash/pedestrian safety. That's a reasonable comparison to web development: webpages are made to understood principles of UI and UX design, and well understood design patterns.
> Why are all laptops the same? Keyboard center on the bottom with a trackpad or nub near the center. Screen on top, ports and stuff on the sides.
As an electrical engineer, I personally hate this uniformity. I hate the experience of laptops in general. I would very much like to make a laptop with no (well, one) moving parts, entirely glass, plastic and carbon fiber. The only moving part would be a single, extremely robust and stiff 180 degree hinge. Both sides of the clamshell are low-bezel 1440p touchscreens with localized tactile feedback, matte finish, and the keyboard and mousepad light up with a border wherever. Reconfigure the UI components with pinch and drag. Tilt the keyboard 45 degrees to type in bed. Use it like a book, a tablet, a newspaper, a laptop, whatever.
Problems include typing fatigue, touch-typing, breaking the damn thing, battery life, yadda yadda. But someone could try something creative. Laptops are in a hellish halfway of standardized consumerism and unstandardized technology- so identical, but so unaccessable and so unexchangeable. So uncreative. Why are slow/fast chargers and external batteries so hard to find? Why is Microsoft making the most creative devices, like the surface? Ugh. Laptops suck.
Let's do a test. Go to a bookshop and buy a novel. Now go to a different bookshop, and buy a different novel from a different writer and a different publisher. Read them. Chances are they're going to look very similar. Different cover maybe, but inside, mostly black letters in an unobtrusive font on a white page with sensible margins. No decorations or illustrations, nothing at weird angles or sizes. They all use the form that's efficient at transferring the content, the story, to your head.
Some web sites are about their design, but most are about the content they present, and they want to present that content in an efficient manner. A design that distracts from the content is not practical.
t l i sya f t a
hoo n-tlm r-e t
etoetralo.atmd
kreeniudnapal
rd anddsnak tbe
ens dn tel's g
aeiyeuwgsryc yi
stmed in ialb
o ih otioomtrsi
nslttthrftoseul
ea o oi si oi
wtrt yuuetttgtt
ei abstqfr rriy.
bsihea e-o aau
st e r f '-t
(read the columns up-and-down …)
I actually went to each of them, they may "look cool" but they were utterly unusable. The hacker news one was horrific.
Some people need to be reminded that design is not just being artsy. Design is for accomplishing purpose beyond screenshots to put on one's portfolio.
Look at the gmail redesign. The modernized it. Used cool new material design and other modern goodies. And yet there is a gmail redesign hate thread on HN every other day.
When I am reading or doing anything, I want to spend my focus and time on the content. Not on the side distractions that serve no purpose.
Websites have many purposes and functions, including of course interactive functions and connections with other elements both within the site and from other places.
Completely different to any book.
It doesn't have to be the sole purpose of any website for it to be the primary purpose of many.
For instance the purpose of this forum, along with many forums, is to convey primarily textual information in the form of comments arranged in a hierarchy.
The purpose of medium.com is to convey textual information in the form of blog posts.
The purpose of a site like Wired, newspaper sites and magazine sites, like their analog counterparts, is to convey textual information (albeit with a heavy graphical element) in the form of articles.
Websites expand upon the possibilities inherent to the medium of the printed page but HTML is a hypertext format, and its purpose (and therefore the purpose of most webpages) is to convey information in the form of hypertext. Interactivity and embedded elements don't detract from the textual nature of the web or its origin in concept or the relationship in the styles evolved with the printed page.
>Completely different to any book.
Different in structure, but not different in purpose, and therefore not completely divorced from the same design considerations.
Yes, we could design every website to look the way the redesigns in the article do, but would you really rather use the hacker news redesign presented in the article than this one? Would you rather use any of those redesigns?
Which is the exact opposite of what this article tries to recommend.
I'm sure there will be improvements on that form in the future, but when that happens, most websites will adopt it, and most websites will still look very similar.
A website is nothing like a book in form, function, purpose, appearance, use, lifespan, the list goes on.
You're confusing the equivalence. A "novel" is a type of book. A "website" is not a type of "something".
A website can be anything the owner wants it to be, with different functions and purpose. It doesn't need to conform to the other "novels" because of some perceived "effective form". That's the point I take from the OP's article.
Websites have not "found their form", that's just the reason you've chosen to believe based on so many websites using the same template.
A website can indeed be many different things, but a lot of websites have very similar purposes, so it makes every kind of sense that websites with the same purposes end up looking similar. Just like cars look alike. Or houses.
Of course websites with a different purpose are going to look very different.
So it's not what you say, it's how it's said. Which would go far in explaining why traditional liberal democratic practitioners always seems ultimately to fail in arguing against nazism, facism, etc. (That is, not only are they fighting with different weapons, but are on different fields on different days.)
So it might be possible to say that it is not design that distracts from the content. It is the design which is the content. The practicality is the reinforcement of an already-established form of cognitive mapping. In this way, it can be viewed as having parity with religion in society (though in some sense subordinate, as it is form, again, that underlies the function of the religious experience), in the sense that perhaps a given society is propagative-force for those forms on a kind of meta level, so, then, to change the forms is to change the society, the potential injection of a type of medical retro-virus (if attempted consciously), if you will, which, of course, as in the case of any external invasion, would likely trigger a sort of immune response.
True, there may be some absorption and incorporation of a rival form, but only rarely, and possibly, in parallel with biology, the more complex the organism, the less likely such would be possible. And, in any regard, absorption and incorporation would either have to be done is such a fashion as that only those aspects that do not create fundamental change are incorporated, which, in effect, means the intrusion is still neutralized, in the way a dominant culture an import cultural artifacts / aspects from another subordinate culture, a biological organism can, etc, or such absorption would give rise to a new form, meaning the effective annihilation of prior contestant forms.
(incorporation of pagan myth could be an interesting example of this phenomenon. Notice how the content can remain the same when encoded into the new Christianized form, and the same content ceases to be of the pagan culture, ceases to propagate the pagan culture.)
It would be interesting to see if form could be separated from content that it wouldn't then be possible to reconstruct, recognize, and/or recreate any given culture.
They are communication mediums. Either delivering communication effectively to the user, or to let the user communicate effectively with others, or do so bi-directionally.
Or they're tools to get work done - maybe even make other art.
In all cases functionality is most important - which is not incompatible with aesthetics. Aesthetics and usability are vital too.
But it does constrain somewhat the variety of your medium. And that's okay.
As LitFan said - it's the same reason cars and smartphones tend to look the same as well.
* Except when they are, and when they are they should be appreciated as such and graded as such, and there are such websites, but they are by far the exception.
I agree, but for a different reason: they're all following the same design fads and/or using the same frameworks, which make certain designs "easier" than others. The content of the fads or the defaults aren't necessarily the most effective or functional for the particular use-case.
I'm not sure what you think "art" is, but art is communication. That's the whole point. That's all it is.
As the article (mis-)quotes, "Don't mistake legibility for communication."
Writing a text-only webpage isn't somehow opting out of art, any more than a brutalist building is opting out of architecture.
"...and because of the way cement is poured into the foundations of modern office buildings, that's why everyone is using the same website template".
Sorry, but you'll need to try a lot harder with your analogies.
"Fabian and Florian turned Hacker News into an interactive visualization. The social media site is a news aggregator, focusing on computer science and information technology. Its design is bare-bones but it has complex functionality for voting and discussions. Fabian and Florian have taken the existing structure and turned it into a typographic space of timelines and networks. The visual presentation is based on the sequence and connections of news and comments. They also connected their design to the API of Hacker News, so you can actually use it to read the site. View the redesign of Hacker News."
And the redesign is a usability nightmare. You cannot easily skip a topic you're not interested in, and you cannot even skip the comments easily which are emphasized. In normal HN, you can browse news.ycombinator.com and click on the links from there. You can open the original links and the HN discussions in tabs. Not in this redesign. Perhaps it is God's greatest gift on mobile (I tried it on desktop), I don't know. Examples of doing it different should be objectively better; this one doesn't appear to be such an example, so don't mention it [1]. Instead, go back to the drawing board.
[1] There's also a bug that clicking on No. and Pts. gets you to that user's hompeage. Which could be 1 or 76, but it has nothing to do with that userID.
The other 5% is a self-expressive art project.
Part of me wonders if the author is trolling everyone by writing an article about the need for more unique design on Medium.com.
This can be seen in any product (cars, smartphones, food - the list goes on).
From time to time there are designs that don't look like others, and those may or may not be met with approval. If they're liked, those designs (or aspects of them) get blended with the standard.
Yes. This is quite similar to asking why all newspapers look the same.
The USA Today was the first to use color in the masthead (and on every daily paper's front page), and that has been copied by some.
Comprehensive macro changes usually only occur when there is a rather extreme inflection point in technology that makes a true leap possible. Something that was previously impossible not only becomes possible, but makes the experience a lot better for the end user. That's why the iPhone approach murdered the old flip phone industry so rapidly, that technology inflection made a lot of new things possible that were very beneficial / desirable to end users. It justified a large macro change, which users had to adjust to.
So for a generic website which cares about first-time visitors (as opposed to a specialized tool that people use often) following established standards and familiar UX paradigms is good usability design.
Chirality, side of the road, alphabet, notational conventions, AC/DC, power frequency, mains socket design, measurement standards, sugar and DNA handedness, etc., etc.
Similarly, if the people paying the people in charge of designing a product perceive a similar product's design to be the best, then they will pay those people to copy it.
Designers try to make sth fresh and out of the box all the time. The problem with these solutions are:
1. UX sucks
2. Don't scale to other resolutions (especially mobile / tablet).
3. EXTREMELY expensive to code comparing to "boring" web solutions (multipliers might be as big as 5-10x)
So most of the work we do is to try to make designers think with patterns ("boring" but the only way to fit in budget) and try to get as much as they can from STATIC design. Play with typography, key visuals, content etc. This is where their work brings most value for reasonable money.
The author of the article is a professor, so wouldn't expect realistic business thinking from him. He might be sad because web is boring, but usually no one wants to spend huge amount of money for prototypes where there's 95% probability that UX and stability will be worse than standard.
And there's a HUGE value in familiarity for users. That's why most of "creative projects" end up looking pretty similar at the end. I've seen many e-commerce sites which had "fancy design" and after months/years ended up with standard e-comm layout.
Also, web today is super hard comparing to 10 years ago. Number of things to think about multiplied by A LOT. Coding great static website with all things stable and looking great is a big task already.
It's like asking for a car with steering wheel in the back or with 3 wheels and paying for it 5x more. Do you want one?
EDIT:
Not saying "creative projects" are bad or sth, they sometimes are super coool. But I treat them more like "web art installation". Nice if you like them but not really practical.
I'm surprised a bunch of people who call themselves interaction designers put little thought into how people would actually interact with these "web-art" masterpieces.
In almost every case, I care about the content, not the particular web site designer’s vision of the “experience”. I don’t want an experience, I want information. I would prefer the content be delivered to my browser with metadata describing what it is, e.g. “news article” or “comment” or “image of purchasable item”, and choose my own experience- that is best for me.
Browsers seem like a silly vanity for me- 90% of the functionality is about allowing a remote party to control my experience. I’d rather control my own.
For the same reason text in a book is arranged in paragraphs, and why magazines separate articles into headers, body text, insets, etc, rather than having all printed media be simply unformatted text.
Having navigational elements and content groups on a site (a "layout") with a predictable visual style allows users to more easily differentiate between the different parts of a site, their different functions, and to navigate those sections more easily. Typographic elements like headers, paragraphs, font styling (bold, underline, etc.) make text easier to read and communicate concepts like hierarchy and emphasis. Flow is a necessary consideration when incorporating non-textual elements such as images into a document alongside text. Modern sites must also consider how they will appear on multiple screen sizes down to mobile.
>Browsers seem like a silly vanity for me- 90% of the functionality is about allowing a remote party to control my experience. I’d rather control my own.
A remote party isn't controlling your experience, they're sending you documents in a markup language, and your browser is interpreting that markup. If you want to download and view raw HTML then you can wget the pages and open them in the text editor of your choice (I think RMS does something like that to avoid executing nonfree code), but you should realize that most people don't want to view raw metadata and have to write their own stylesheet and schema for each site, they just want to read the document.
Facebook is as vanilla-standard as it gets.
A similar thing happened when Last.fm did their huge redesign. The new website was all js now, and they quit all support on the forums, messaging, pretty much all the old ways of communication between users. And for me, that was awful, since i was a part of a music collective that communicated primarily on those forums. After that everybody dispersed.
So outrage at a redesign is not always unfounded or silly. Web companies tend to hide things in them.
Most of the outrage I remember was around hiding and removing functionality: Chronological newsfeed, page customizations, network pages, etc
The reason why Bootstrap is nice relative to what they give as examples is that while (usually) it looks pretty, the content is what you focus on and not the dissonance that the UI creates. In the case of the art ones, it makes sense as I imagine that was the intent, to flip the focus, so as an art exhibition, that's perfectly fine and good. But as a website, I wouldn't use it.
It reminds me of early days (around 1995. I remember buying No Doubt's Tragic Kingdom CD around this time and their band's URL wasn't a custom domain but something hosted by one of their labels, I believe. Different times). A lot of bands, with Nine Inch Nails being a bigger one, would go for these UI nightmare sites with, my guess, the intent that they're essentially a game of sorts seeking out hidden stuff. Those types of things turned me off (still liked the music though, just not the sites), but I know there are those who loved them so more power to them.
Being usable and looking really cool often don't go together very well. I suppose the few cases where they do, are the mark of a truly great designer.
Superimposing the text of one comment over another may look cool, but doing so means you gave no thought to the experience of the user.
Still, maybe it's more the article writer's concepts of a unique website that don't work more than all sites being the same being a bad thing. Their redesign for Medium.com is nearly as unusable too:
https://retro-medium.netlify.com/borism
I get the creativity in letting people adjust the length of words/negativity of words/number of most common words in an article, but like the Hacker News redesign, it just creates an unreadable mess.
You can make something different without making it unusable, and most of these redesigns fail miserably at that.
The HN Redesign probably happened because the API was easy to use by students and they wanted to experiment with "cyberpunk" style interface, for which a text heavy site like HN was perfeect. It isn't at all the type of site
I can certainly imagine all websites looking like this in the near future however. Website designers all seem to love jumping on idiotic bandwagons that favor looking cool over usability.
More seriously, I think the Internet has the reverse issue. Every website looks and is used differently. You don't have to figure out how to turn pages when reading a new book.
Trivial example: Hacker News looks nothing like Medium. All blogs on Medium look the same though.
The mainstream web looks the same because it's all gone through the same funnel.
The web is split. You have the oldschool developer part (mostly textmode with the odd showoff project), and the mainstream part (full of GDPR banners, advertisements, cookies, tracking stuff, 10MB page loads, etc).
It’s challenging to rebel against the dominant paradigm because everyone ends up with tattoos and blue hair and alternative becomes mainstream all over again.
They not only blindly assume you have the latest web browser technology and are willing to use it, heedless of security concerns and basic propriety, on relatively minor sites, they assume you've crawled up inside the designer's head and therefore see the site the way the designer sees it.
Which brings me to why sites "All Look The Same" (kind of a stupid thing to say, but I'll not fight it): It's a design language, something where designers and users can agree which elements do what, what affordances they have, and, therefore, how to use the site to get what they want from it.
None of the re-designs follow that.
None of the re-designs are respectful of anyone else.
These re-designs are a bad parody of design work, and make designers look bad by association.
Granted I didn't go to design school, but efficiency and the ability to be understood are pretty high on my list.
Take example 2, not only does it scroll jack for a square pattern, there are things that highlight but aren't clickable, there's a gif that's chewing up CPU cycles, and this seemingly functionless page requires 58 requests, 48MB and somehow 1.2 minutes to load according to chrome dev tools, compare to loading the HN homepage in 1.1 seconds.
I'm not an advocate for turning the internet into a server of pure text files, but when art and usability are head to head, usability must win every time or your users will go somewhere else.
Personally I loved the cyberpunk feel of the Hacker News prototype, even though it's a usability nightmare. I like to view this stuff to engage my imagination and think about what's possible, not whether this design is ready to scale to millions of users.
This question puts two things in the spotlight:
1) the all too common software developer's ignorance for the art of design
2) the all too common designer's ignorance for the art of frontend software (which is usually data retrieval and entry, using common and learned UX functionality)
There often is a lack of humbleness regarding putting what I (designer) fancy behind what users need.
OTOH devs admire things like material design today or bootstrap in the old days as a way to "solve" design. Yet, those frameworks only touch half of what design is needed for (common UX patterns, don't come across as unprofessional) and fail at the other. I.e. there is no uniqueness, subliminal mood, branding, emotion or even recognizability in most pages/apps that use those frameworks.
The idea of letting A/B tests guide your design decisions gave us the many ugly things Google did in the past. And while they certainly improved on design, material design breathes the same spirit. The spirit of design as something "to solve".
Luckily with material design's CDK this spirit seems to be solved too :-)
Quite the contrary, when I set up a site for someone, I tell them to make it match their brand, but not to get overly creative other aspects of the design. A creative design may be interesting, but is that the goal of the site? To convince the audience that you found an interesting designer? Or do you want to communicate something about your product/project?
Simple, effective designs have evolved over the last couple decades. Designers should experiment, as that is their purpose, and it is how we avoid stagnation. Everyone else should use what works.
I think publishing this in Medium rather than on one of those designs of their students, kinda proves why most websites prefer to look boring.
Add to that frameworks such as Bootstrap CSS and opinionated website builders such as Weebly and I finally overcame a major limitation in my skillset. I could now actually build what I wanted to build, knowing that it looks decent and I can focus on what is under the hood.
If the web all looks the same, it is probably because it is built by people like me who need a rigid framework to work within.
[1] https://www.amazon.co.uk/Design-Hackers-Reverse-Engineering-...
I find the David Carson quote (confusing communication with legibility) to be ridiculous on it's face. If your intention is to communicate information, it needs to be legible, clear, and understandable. If your goal is to make beautiful designs, fine, but understand and state your goal.
Not a single website redesign here would ever work, and would be offensive as a user trying to consume information.
Design is about embracing constraints for the medium to solve a goal. This is about removing any constraint to make a pretty picture. Great, looks nice, but I won't ever use it. So what was the real goal?
Since we need to lay out a web page in several different ways as-is, it seems as though evolution has taken care of what seems to be a very 'natural' design pattern at this point.
Designs for websites were made in photoshop by creatives. Now designs for websites are made by front end engineers, or UX consultants.
Depends on the type of website, for example, if it’s a banking or airline ticketing website, my tolerance for creativity for the sake of differentiation is non-existent. I am not passively consuming media, I came to the site to complete a task and want to get it done with the least friction and advertising shoved in my face as possible.
Similarly, this is why I’ll never stop using ad-blockers and keep mentally noting which sites employ scummy UX dark patterns so I can spread awareness of alternatives to friends and family-- cause I consider 'dark patterns' both psychological opportunistic and predatory.
People use technology as a means to an end, whether to check their savings account balance, chat with friends, or look up information, introducing friction in the form of 'avant-garde' creativity without UX research/data on the impact to usability, is a recipe for disaster on user engagement metrics and revenue stream intimately tracked by upper management to justify continuing to pay the salaries of designers, developers, product/project managers/BSAs, etc. and to keep the lights on at a majority of tech companies (in my experience). Thoughts?
The real answer why sites are homogenous is because everything has to be mobile friendly. There are only a few options that work, unless you’re going to completely redo your layout and css for mobile. The truth is, modern front end is hard, so that’s not a good option. Ui designers also save a ton of work by keeping the mobile design similar to the desktop one.
What do customers need that modern web frameworks don't provide, and why is it wrong for customers to want the web to be familiar and unobtrusive?
- Medium
- Atlas Obscura
- Techcrunch
- New York Times (visual / interactive story articles)
- https://baymard.com/research - ecommerce UX research
Not all UX design content mediums have been invented yet, there's billions of permutations, and different content requirements. Different color, typography, color psychology, shadows, icons, animations, etc all change the way a story is told. A website is just a content medium, much like a video or image.
However, at the end of the day, content will mostly be the same. It's just CSS and JS changing the look and feel of the site. Example, one static HTML file and multiple CSS implementations: http://csszengarden.com.
To the untrained eye, every site does look the same. My definition of good UX is this - minimize the total distance your eyes have to adjust, and maximize the amount of content captured. Without being overly fatiguing (usage of whitespace, eye relief, etc).
Just try laying out a series of iconic buttons in a swooping curve. Or try laying out some text inside a circle ... or just making a circle, a triangle, a leaf-shape... or fitting an image between two columns of text ...
The tools to do all of this were available 25 years ago in desktop-publishing apps. Creating a beautiful page took design skills, but the layout was not done with CSS but by drawing on the page and making adjustments with handles.
Not by endless hours of fussing with CSS version xyz and grids and flexes and compromises by sacrificing original intent.
HTML layout is absurdly painful. Most people with deadlines don't have time to spend hours to make it work in one browser, switching to another browser and SCREAMING, and tossing it all out and returning to rectilinear boxes.
That's why.
7. Pity the readers
They have to identify thousands of little marks on paper, and make sense of them immediately. They have to read, an art so difficult that most people don't really master it even after having studied it all through grade school and high school --- twelve long years.
So this discussion must finally acknowledge that our stylistic options as writers are neither numerous nor glamorous, since our readers are bound to be such imperfect artists. Our audience requires us to be sympathetic and patient readers, ever willing to simplify and clarify --- whereas we would rather soar high above the crowd, singing like nightingales.
Pity your average web surfer.
An artist flexes their creativity and communicates thoughts through imagery/experience/sound.
[0]: https://medium.com/@borism/balancing-creativity-and-usabilit...
Just look at all the rant there are when an app change a bit of it's design. You want adoption by users ? Make it easy for them.
Is it frustrating for designers ? I bet so. But can you imagine living somewhere where every shop have its own design and way of sorting things ? Imagine a supermarket where products will be stores in alphabetic order ?
Seems a good idea, you won't have to search for the good line any more. But it'll have to survive long enough to customer to adapt.
Well, now imagine every supermarket having those disruptives ideas.
Maybe in a future where we'll all have time for it, if we won't have to work more than 5-10 hours a week. Why not ? Until then, let's keep it simple.
"WORDPRESS IS POWERING 26% OF THE WEB"
- Supporting all devices makes custom design really hard, with need to design for phones, tablets, PC in all kind of browser window size/ratio. Different screen size, dpi and input type. - Accessibility is really hard with out of the ordinary designs. - A website must "give out its content" in seconds. You cannot establish a relation with the user like, say, in games.
Once that has worn off, unless the site is exceedingly usable, memorable or memorable, I'm out.
It's taxing to have to visually search, analyze, scaffold, and navigate a new mental model of how I expect a website to behave.
And therein lies the problem, people have expectations of websites, and it is generally in their best interest to conform to existing standards.
Now: masonry layout / infinite scrolling
I mean, it's fine if the main goal of the website is to be artistic, but as others have pointed out, that's not the main goal of most websites, it's communicating information.
If you divert from that you better have a reason and be good at it or just layer something unique on top.
Diversity is found near exclusively in the domain of homepages built by people not in the business that didn't make their website to put on a resume to proof they can use whatever tool is currently in.
In fact, if I want to leard about something or somebody I will often choose Wikipedia primarily over something else because I know it's format and can get straight to digesting the information I came for.
(The issue of me using a crowdsourced platform as a prioritised source of something else for a different discussion)
If the purpose is to use the web as a medium of artistic expression, then you can see some variety. But that's likely a small percentage of websites by purpose.
I wouldn't even ~~be able to~~ want to read a static document that looked like those examples.
https://unitscale.com/mb/bomb-in-the-garden/
Even publications that produce a beautiful paper product seem to be willing to accept a garbage design when they post it online.
I really couldn't care less about modern web design -- Just show me the text.
All marketing sites converge on an identical design"
Promethease is a good example. Years later a bootstrap website signals to me "it's about the functionality, not the design". https://promethease.com/
Before that everything was jQuery UI. Government websites still use a ton of it. All of Colorado's web portals are built with it. And now things are shifting towards UI frameworks "plus more", like Ionic, which adds a bunch of design/devops workflow and cross platform functionality.
Within a particular generation, all things tend toward a familiar design. There is a herd mentality to fit in with the crowd, allowing for only minor differences.
Yes, it's a truism, but it explains why site designs converge. Fewer people will be willing to learn your site's custom layout and behavior.
The web had ~ 5 system fonts before Web Fonts were available in 2008 / 2009.
Now the web has many thousands of the best fonts ever created by the world's best foundries.
Business People: "Let's make it fast"
Developers: "Choose one"
These are questions that do not require an article worth of words for analysis..
They don't, you're reading the wrong sites.
It helped standardize design.
I'm against this but I can see the benefits of the same layout.