For a website, visual complexity is to be banned. A Google study shows that people think that complex sites are less “beautiful” than simple sites. The simpler the design, the better. How to explain it? By science!
In this article, we will try to understand the scientific reasons why “simple” websites are more appreciated and more efficient than others.
Websites must stay true to the mental prototypes of Internet users
If I say “furniture”, there is a 95% chance that you think of a chair. If I ask you what color is associated with little boys, you answer “blue”. The brain uses prototypes to organize and categorize perception. Prototypes are basic mental images, models that can represent things. This is valid in all areas. In terms of a website, for example, prototypes are associated with each type of site. Everyone has a representation of what a social network, an e-commerce site, a blog looks like or looks like … If a website does not bend to these canons, the user’s brain will tend to reject it — consciously or unconsciously.
If I say “ready-to-wear shop online, you probably think of something of this type.
This representation is faithful to the prototype associated with e-commerce ready-to-wear websites. This prototype is used consciously or unconsciously in the production of the wireframe of a website.
If all the ready-to-wear sites share common points of design, it’s not that they lack originality or that they copy each other. It is because they comply with the basic expectations of Internet users in terms of e-commerce sites. They try at best to remain faithful to the mental prototype of the e-commerce site.
What can explain the concept of “cognitive fluency”
The simple idea behind the concept of cognitive fluency is that the brain naturally prefers to think of things that are easy to think about. The brain flees complexity and seeks simplicity. Like everyone else, you prefer to visit simple websites to understand, sites where you know what actions are expected of you. In short, sites that are easy to analyze.
The cognitive fluency is to be linked to the effect of simple exposure “, which shows that the more a person is exposed to a stimulus (a person, a product, a place), the more likely he is to love this stimulus.
Everyone, when viewing a blog, expects to see a sidebar on the right of the screen. Everyone expects, when visiting an e-commerce website, to have beautiful high-definition images of products sold and to see the company logo at the top left of all pages. Internet users are conditioned by these characteristics which have ended, by the habit, to impose themselves as standards. The effect of first exposure orients the perception of what is a simple site. A site that does not meet these standards will tend to be considered less beautiful than others.
Here are two examples of e-commerce sites that are particularly successful because they respect standard practices (be aware of the many similarities between these two sites):
Hello My Cushion :
This is not to say that one must necessarily do as everyone else does. Let’s be clear: do not do it like everyone else. Only you should never create a website that derives from the prototype that is associated with its category. This leaves you a lot of leeway to create a personal and original website.
Create a simple website: concrete results in terms of conversion
In the two examples above, everything you expect from an e-commerce site is present and in the “right” place. This leads you unconsciously to bring credit to these sites, even though you have probably never visited them. A site that respects the rules of cognitive fluency seems immediately familiar, so no effort is needed to “understand” how the elements of the site are organized. The user can focus immediately on the content and offers offered by the site.
When, conversely, a site creates cognitive disfluency on the Internet user’s side, this is immediately apparent. Let’s take a simple example: the Skinny ties website, which sells ties. This site was redesigned in October 2012. Here is what it looked like before the change of design (the screenshot comes from WayBack Machine ):
Here is what it looks like now:
Three major changes have been made to this website:
- The use of a framework faithful to the prototype of e-commerce sites.
- The massive use of white spaces, significantly improving the readability of the site and its organization.
- The use of images each time presenting a single product, in HD, with contrasting colors.
This redesign has yielded impressive results. Here are the results obtained just 20 days after the redesign (see the case study for more details). The impact on the conversion is impressive.
The design chosen for the redesign has nothing in itself revolutionary, even if it is very elegant. But this is normal: this design responds very exactly to the expectations of Internet users, what users expect from a modern e-commerce site. It is not intended to surprise. In terms of web design, wanting to surprise is the biggest mistake that can be made.
Site Creation — Custom Pricing
La Fabrique du Net has developed a recommendation engine that allows you to obtain a free detailed price estimate and a selection of software and providers tailored to your needs for website creation.
Why a simple website is scientifically better?
The Universities of Harvard, Maryland, and Colorado together conducted a study showing the correlations between aesthetic tastes and socio-demographic profiles of people. This study shows, for example, that PhDs do not generally like sites with garish colors. One of the lessons of this survey is that there is no universal taste. There is only one thing that never changes, regardless of the profiles of the interviewees: the more complex a site is, the less pleasant it is.
The simple websites as to their design are those that are considered the most beautiful. Why? Surely because a simple website requires little effort to the eyes and brain of the user. A simple website, again, is easier to understand and analyze. Recall the general operation of the visual processing of information: your retina converts visual information from the real world into electrical impulses. These pulses are sent to the photoreceptor neurons and transmitted to the other brain cells synaptically for storage and decoding work. This is how visual perception is created.
To return to our sheep: the more a web page includes variations in color and brightness (= visual complexity), the more the eye must transmit impulses to the brain. This is the reason why complex sites appear less attractive to users.
Create a simple website, or the art of detail
On a website, each element, as small as it is, communicates information. The way you space the letters forming the words has a far-reaching impact on the perception of your site.
When you want to redesign your website, you have to be careful about all the elements: typography, logo, color palette, etc. Each choice has a meaning and must have some logic. Nothing is or should be trivial. Each time, the same objective must be pursued: limit the visual complexity as much as possible. You must communicate as much as possible with the least possible elements to optimize the visual processing of information by the eye and brain of your users.
Here is a small interesting example. The well-known emailing solution MailChimp , to accelerate its development, decided to reinforce its content marketing and simplify its site, by integrating a small animation quickly presenting the software, by limiting the text on the homepage … The team's Developers have also decided to change the logo slightly, aligning the letters further. The simplification of the heart of this redesign.
Adapt the website to the requirements of “working memory”
A simple website facilitates the visual processing of information and allows a better routing of sensory signals in the brain. A famous study by psychologist George A Miller of Princeton University showed that the brain of an average adult could store between 5 and 9 “blocks” of information in the short term, thanks to the memory of “work” (“Working memory” in English). Working memory — also called short-term memory — is the part of the brain that temporarily stores information and processes it in seconds. It’s a working memory that allows you to focus on something, resist distraction and — most importantly — make decisions.
In all that we have seen, the main goal is to minimize the amount of “noise” that affects the working of the working memory. Creating a simple, prototypical site makes it possible to limit the number of informational blocks processed by the working memory, to reduce this number to 5, 6, 7, 8 or 9 maximum. For example guarantees, descriptions produced, prices, promotions … Short-term memory, when it has to manage in a few key elements, can more easily process information and solve problems.
When you deviate from the expectations of people (for example by offering higher prices than expected, having a download time too long, using unexpected colors, displaying photos of poor quality …), the memory of Work will tend to deal with these deviations rather than the content (the gap between the expected price and the price displayed, rather than the price amount). The explanatory reason is that the short-term memory, in this case, automatically connects to the long-term memory (whose stored information is the basis of the “expected” brain) to process the information and analyze the gaps. When the long-term memory fails to help the working memory, it generates a break in the processing process: the working memory disengages and moves on to something else. Consequence: to avoid this short circuit brain work and prevent your brain-wasting its time to analyze the gaps, you must offer a website that deviates as little as expected of your users. That is to say, which is closest to the idea that users have of a website in general, and in particular a website in your category.
We will conclude with 7 tips to help you create a simple website:
- Identify your audience and the sites they are used to visiting. Take an interest in the design changes of these websites and the results that this has generated (by reading case studies).
- Get inspired by the design elements and choices of your competitors who have proven their effectiveness.
- Follow the rules of cognitive fluency when developing the design of your website. Place the different elements where your visitors expect to find them.
- Communicate clearly your message, by working the colors, the logo, the typography … Do not overload your site of texts and images: go to the essential.
- Aim for simplicity Prefer a large image to a series of small images, prefer the structures to a column rather than three, use white space as much as possible.
- Check that your site is in phase with the expectations of your audience (in terms of price, aesthetic choice, a speed of loading …).
- Never forget that creating a “prototypical” site does not mean blending completely into a preconceived mold. Your website must express the personality and values of your brand.