6 Web Design Tips Based on Brain Science

Share This
Andy Crestodina
4 Minute Read

Some web design tips are supported by actual brain science. Research into the brain reveals tendencies. These tendencies translate into tips for designing websites. In fact, specific parts of the brain relate to specific marketing methods.

The Frontal Lobe (planning, logic, motivation)

The frontal lobe is associated with “executive functions” such as motivation, planning, attention, and short-term memory. It considers options and the consequences of actions.

1. List Order and “Serial Position Effect”

When ordering your navigation (or any lists within your copy), put the important stuff at the beginning and end. The readers’ attention and retention are lowest in the middle. As visitors scan the page, the first and the last items are most likely to stay in short-term memory. [1]

Also, don’t include too many items. Short term memory can only hold around seven items. If your navigation includes more than seven links, break it up into smaller groups.

2. Marketing Copy and “Loss Aversion”

Humans are not efficient cost/benefit calculators. We tend to overvalue losses and undervalue gains. In other words, losses are more painful than gains are pleasurable.

This aversion to losses can be useful to web designers and copywriters. Here are some tips for writing copy with loss aversion in mind. [2]

  • Emphasize the costs of not using your product or service.
  • Group costs together, list benefits separately.
  • Emphasize immediate gains.
  • Create urgency with limited time offers. If the product is scarce, say so.

3. Social Proof and Supportive Content: Herd Behavior

People tend to do what other people are doing. So giving evidence that others have selected you makes choosing your company seem like a good choice. The goal is to make any decision other than using your company seem outside the norm.

Add supportive messages:

  • Testimonials from clients or reviews from customers
  • Social media widgets showing the size of your following
  • Endorsements from relevant influencers
  • “As seen in…” logos of media where your company has been mentioned
  • Trust seals, including association memberships, security certificates, and awards

These elements improve the initial value judgement of your website and your company.

Temporal Lobe (language)

Together with the frontal lobe, the temporal lobe plays a key role in language comprehension. This is where language and meaning is processed.

4. Word Choice and Readability

Labels in navigation and copy in pages must be easy for visitors to understand. Use the common words that visitors expect. Avoid long sentences. Don’t use jargon. Long sentences and fancy words force the temporal lobe to work harder. Not good.

Copy that works well for “low literacy” users works well for everyone. It’s not about dumbing it down; it’s about using simple language that everyone can understand. Even PhDs prefer to read at an 8th grade level. [3]

A big word might make you sound smart, but it risks making the reader feel dumb. A reader who doubts themselves is unlikely to take action. And you want to inspire action, right? Be simple and accessible in your writing.

Occipital Lobe (vision)

This is the visual processor of the brain, handling spatial, color, and motion perception.

5. Colors and “Von Restorff Effect” 

In the 1930’s, German scientist Hedwig von Restorff discovered that when given a list of ten items, people remember items if they are a color different from the others. This is because the occipital lobe is sensitive to visual differences, or “pattern interrupters.”

Web marketer, Paras Chopra, conducted experiments that showed how standout colors aren’t just remembered more, they’re clicked more: 60% more! [4]

Pick an “action color” for all of your links, buttons, and rollover effects. Make it a color that’s distinct from the brand colors used throughout the design (these are the “passive colors”). Use the action color nowhere else but in the clickable items.

Amygdala (basic emotions)

The amygdalae (there are two) are key in the formation and storage of emotional memories.

6. Headlines: Emotion and Virality

According to eye tracking studies, headlines aren’t just the first thing seen on a page, they’re looked at more than anything else. [5] And not all headlines get shared equally.

Headlines and images can quickly spark emotions. Research shows that emotional headlines get shared more. [6] A lot more. The three types of emotions that get shared the most: anxiety, anger, and inspiration.

Especially for blog posts, write headlines that trigger very positive (or very negative) emotions. In the words of Antonio Damasio, “We are not thinking machines that feel, we are feeling machines that think.”

Results May Vary

Web marketing is a science, and science is about testing. Try these techniques in your web design and web marketing, and measure the results. You may find that some tips work better than others. But any technique that takes brain anatomy into account is likely to work well!

Share This

What are your thoughts?

Comments (38)
  • Great job, some of these I suspected, some are new to me, all make sense. Nice to have the science behind it!

    • Great article! I hope many companies and organizations read it and get a better sense of the questions to be asked when building or updating a site.

  • Fascinating article that really gives some “science” behind human behavior on the web.

  • Great stuff.  Love that you emphasize it’s all about testing.  (FYI – the column header in #4 needs fixing per footnote 3.  That’s the stuff I’m interested in following up on.)

    • @mmetzler Great catch. Thanks for the input, Monica. It’s not surprising that you liked this post. You guys are all about science… http://www.illinoisscience.org

      • @crestodina That we are!  I just spent 2 days at conference on Neuroscience and the Law.  Lots of geeking out over the frontal lobe. 🙂

  • Science is for nerds……like me!

  • Perfect timing. Just in the process of re-doing one of my own sites as well as a client’s.

  • I am web developer and web designer, Thanking for this wonderful articles, this article really helps me lot in my work. Looking forward to read more on this same topic.

  • wow wonderful one , good article

  • What an awesome article, I think the best tip is to use testimonials and social signals especially for local businesses.

  • Great article! These tips (some with minor modification) are useful for all types of design (and communication), even though they’re tailored here specifically to web design.
    I particularly agree with item 4. Too often you see people who offer services to the general public, but use such lofty language or so much jargon that it’s off-putting. In terms of lofty language, even if I understand what they’re saying, I often leave those sites quickly in search of a more “real” sounding place to spend my money. Then there’s jargon or business-speak overload, which, most of the time, ends up leaving potential customers wondering, “What does this place even do?”I would change this sentence, though: ” A reader who doubts themselves is unlikely to take action.” Personally, I’m not a fan of the “singular they,” but even putting that aside, this sentence is very awkward to read. Maybe simply making the whole thing plural, as in ” Readers who doubt themselves are unlikely to take action.” would work for you if you’re concerned about not using gender-specific language. I may be the only female who feels this way, but, I really don’t mind when authors write “he” meaning “he, she, whatever”…. I get it. They’re not being sexist, it just flows better. Some of my favorite male authors (David Foster Wallace, for example) use “she” where one might use “he,” which can also be effective…. keeping the flow, not sounding sexist, etc.
    Thanks again!

  • very very interesting tips. Unique approach. http://ebrandingexperts.com

  • Readability is so important. It’s amazing how fast people give up when the reading gets slightly difficult.

  • Best Explanation about brain and web designing

  • Hi Andy, really liked your article on designing a website related to brain science. Just awesome. Would love to read more articles like this.

  • Involving science in web design is a great concept. Who wouldn’t want to know how our brain impacts design process? I surely do, at least.

    I appreciate the involvement in making this post. I will use and share this information.

  • Fantastic web design tips. It is a great pleasure for me to get these great web design tips. I really love these tips.

  • Cognitive ability of a brain is very well related to the aspect of webdesign. A nice theory of explaining the brain function while doing designing. Guess this is how each one comes with a unique creativity!

  • Thanks for the great advices! I concur with you that colors are such an important ingredient for any web design that this cannot be emphasized enough. I believe that different colors affect the moods of people to varying degrees so this will also have an affect on your customers perspective of your company.

  • Nice one, very nice work, really this is fantastic article, thanks for post

  • great article about how our brain works..

  • Web design has gone scientific. This is quite remarkable. When it comes to marketing and design, the two go hand in hand

  • Great and useful tips for web designing and web development . really going to help us to develop a great and effective websites.

  • Inspiring article…the points you have focused above are really helpful points in making a new website and in updating my websites and try to add social signals in that which may help in improving the ranking of website..thanks for sharing an inspiring tip of website development with us.

  • To design a website one must be a creative to make new and attractive web pages so one can hold user for long time on their website. The design of a website is most important part to attract user on search engine.

  • I did learn from this post which is explaining very good points for advanced web designer.

  • This is one of the best articles I have read in a while. I especially liked the section about weighing gains and losses and it’s made look at websites a lot more differently. Thanks for sharing the tips about listing benefits separately and grouping the costs together. Something else I would add is remembering to provide the correct cost information because even though we overvalue losses, we still want to know what we’re getting ourselves and that will avoid other problems in the future.

    • Thank you for the thoughtful comment, Catherine. It sounds like you’re as interested in this topic as I am!

      Earlier today, I was talking to someone about various personality types, the DISC test and how to effectively communicate with people. That conversation, plus your comment about cost information makes me want to write an article about creating marketing programs specifically for different personality types. I wonder if it’s possible…

  • Really!! Very informative post. Definitely you are expert in web design as well as you worked hard to gather the data. Thank you so much for sharing the informative information with us. Keep it up!!!

  • This is nice post which I was awaiting for such an article and I have
    gained some useful information from this site. Thanks for sharing
    this information.

    • This is very useful

  • It’s all about science and design. Great info Andy. Thank you!

  • I have noticed the readability point it spot on. So many sites lack in word choice and many post articles that don’t make sense. This is one very important tip when it comes to designing any website.

  • Great tips to follow, Thanks for sharing this article.

  • Great reading. We are having sliders on our website homepage. Now I understand that slider could be one of the reasons for not having good conversion rate on our website. Thanks for the tips.

Join over 16,000 people who receive bi-weekly web marketing tips.
Share This