Visual complexity and prototypicality: why simple wins

Key takeaways

A 2012 Google study found that websites with low visual complexity and high prototypicality, meaning they look like a typical site of their kind, were judged most appealing within 17 to 50 milliseconds. For a business, the lesson is to look simple and familiar for your category, then stand out through content and proof.

• Impressions formed in 17 to 50 milliseconds in Google's 2012 study.
• Low visual complexity scored better than busy layouts.
• Sites that looked typical for their category scored better.
• Stand out with your offer and proof, not an unusual layout.

What did the Google study find?

Researchers at Google and the University of Basel, led by Alexandre Tuch, showed people website screenshots for as little as 17 milliseconds. Sites with low visual complexity and high prototypicality were rated most appealing. Highly complex sites and sites that looked unusual for their category were rated least appealing, and the effect appeared even at the shortest exposures.

• How website design influences brand credibility
• Website first impressions: what visitors judge in seconds

What is visual complexity?

Visual complexity is how busy a page looks: the number of elements, colours, images, text blocks and alignments competing for attention. A page with one headline, one image and one button has low complexity. A page with a slider, six boxes, three colours of button and a sidebar has high complexity, and visitors read it as harder work.

• Cluttered website design: what to remove first
• White space in web design: why empty space sells

What is prototypicality?

Prototypicality is how closely a site matches the visitor's mental picture of a typical site in that category. People expect a law firm site to look different from a fashion shop. A site that matches the expected pattern, such as logo top left, menu top, contact button top right, is processed faster and judged more favourably.

• Should you copy a competitor's website design?
• Website logo placement and size: what visitors expect

How do you apply this without looking generic?

Keep the structure familiar and make the substance specific. Use the layout conventions of your sector, then differentiate with your own photography, a precise statement of what you do and for whom, and named proof. Familiar structure lowers effort; specific content gives visitors a reason to choose you.

• Website template mistakes that make a business look generic
• Website value proposition: say it in five seconds

When does unusual design make sense?

Unusual design can work for creative businesses, such as design studios or architects, where the site itself is the portfolio and visitors expect originality. Even then, the navigation and contact route should follow convention. For most service businesses, being unusual costs more in effort than it gains in memorability.

• Distinctive brand assets: be recognised at a glance

What does this look like in practice?

A pattern we see: a homepage carries a rotating slider, a video, four service boxes, a news feed and a partner logo strip, all above the second screen. Reducing it to one headline, one real photo, one action and three services makes the business look more established, not less.

• See client work
• Website Design & Development for UK businesses

Complexity and prototypicality checklist

• Count the distinct elements on your first screen; aim for five or fewer.
• Use your sector's familiar layout pattern.
• Limit colours to a primary, a neutral and one accent.
• Remove sliders and auto-rotating content.
• Differentiate through words and photos, not structure.

• The website credibility score: rate your site out of 10
• Minimalist website design: credible or just empty?

Next step

Compare your homepage with the top three competitors in your sector. If yours is the busiest, simplify first.