Web Design: 15 Important Research Findings You Should Know

Published on January 13, 2007 (↻ February 27, 2021), filed under Web Development and Art and Design (RSS feed for all categories).

A small selection of research findings related to web design, usability, and accessibility, most of them obtained from Human Factors International. With some of them being known, others may add to the understanding of our profession:

Design is a key determinant to building online trust with consumers. For motivated users of an information site, bad design (busy layout, small print, too much text) hurts more than good design helps.

—Sillence, Briggs, et al. (2004).

For online trust and credibility, also see Stanford University’s Guidelines for Web Credibility.

Layout on a web page (whitespace and advanced layout of headers, indentation, and figures) may not measurably influence performance, but it does influence satisfaction.

—Chaperro, Shaikh, and Baker (2005).

Experience matters: Blue links are easier to click than black ones, even though black ones have higher visual contrast and are easier to see.

—Van Schaik and Ling (2003).

It’s important to consider the users when you have a choice of icons, links, or both. Initial performance is best with the link alone. Frequent users can use either equally effectively. Icons are not faster, relative to text links alone.

—Wiedenbeck (1999).

Rules of thumb for icons: Make them as large as feasible, place frequently used icons in a persistent task bar, and arrange them either in a square (first choice) or in a horizontal layout.

—Grobelny, Karwowski, and Drury (2005).

The acceptance and impact of animation is enhanced when users are warned to expect it and allowed to start it when they want.

—Weiss, Knowlton, and Morrison (2002).

Use of whitespace between paragraphs and in the left and right margins increases comprehension by almost 20%.

—Lin (2004).

A format of 95 characters per line is read significantly faster than shorter line lengths; however, there are no significant differences in comprehension, preference, or overall satisfaction, regardless of line length.

—Shaikh (2005).

Applications vs. websites: In general, visual layout guidelines for GUIs also apply to the web, but there are differences to be aware of. For example, dense pages with lots of links take longer to scan for both GUI and web; however, alignment may not be as critical for web pages as previously thought.

—Parush, Shwarts, et al. (2005).

Narrative presentation enhances comprehension and memory. Narrative advertisements produce more positive attitude about the brand and a higher incidence of intent to purchase.

—Escalas (2004).

On sites with clear labels and prominent navigation options, users tend to browse rather than search. Searching is no faster than browsing in this context.

—Katz and Byrne (2003).

Users will wait longer for better content. Users will wait between 8-10 seconds for information on the web, depending on the quality of the information.

—Ryan and Valverde (2003).

Consumer purchase behavior is driven by perceived security, privacy, quality of content and design, in that order.

—Ranganathan and Ganapathy (2002).

In 2001, Bernard found that prior user experience with websites dictated where they expected common web page elements to appear on a page. The same still holds true today: Users have clear expectations about where to find the things they want (search and back-to-home links) as well as the things they want to avoid (advertising).

—Shaihk and Lenz (2006).

When assessing web accessibility under four conditions (expert review, screenreader using JAWS, automated testing via “Bobby,” and remote testing by blind users) those using screenreaders find the most issues, while automated testing finds the least number of accessibility issues.

—Mankoff, Fait, and Tran (2005).

About Me

Jens Oliver Meiert, on September 30, 2021.

I’m Jens, and I’m an engineering lead and author. I’ve worked as a technical lead for companies like Google and as an engineering manager for companies like Miro, I’m close to W3C and WHATWG, and I write and review books for O’Reilly and Frontend Dogma.

With my current move to Spain, I’m open to a new remote frontend leadership position. Feel free to review and refer my CV or LinkedIn profile.

I love trying things, not only in web development, but also in other areas like philosophy. Here on meiert.com I share some of my views and experiences.

Comments (Closed)

On January 14, 2007, 18:41 CET, Nathan said:
Too few people believe in the power of usable web design… And in a professional environment, it is unfortunately usually not the first thing considered for investment…

Pity!

Very nice post! May I forward it to my colleagues and put it on my blog?

Grüsse aus München
On January 14, 2007, 20:17 CET, Jens Oliver Meiert said:
Nathan, of course! And indeed, sensitization is an important aspect of our work.
On January 16, 2007, 23:13 CET, Alicia said:
I am one of the usability and accessibility advocates too, so you can imagine I love this entry you have put up. It sums up what we know, and in the manner we can just flick to those who are still not yet convinced!

We don’t need to sacrifice design for accessibility all the time! The judgement call is always on who your target audience and purpose of the project. Gee!
On January 17, 2007, 10:35 CET, Jens Oliver Meiert said:
Alicia, thank you, and no, we don’t need to sacrifice design for accessibility.
On January 17, 2007, 15:02 CET, dharma said:
Wow, this was really nice. Every webdesigner should be aware of these.
On January 18, 2007, 18:45 CET, chesco said:
Fantastic post! thanks!
On January 18, 2007, 19:47 CET, alex said:
i figured out the following:

compared to grey background color
#555555 to #cccccc
white background really hurts the eyes.
it is derived from book paper color, however monitors are active light sources! background color provides no information, and thus can be reduced to #555555 / #777777 easily.

web designers should stop to see hypertext screen space as ordinary paper.
On January 18, 2007, 21:30 CET, Jens Oliver Meiert said:
Alex, I guess you refer to Meares-Irlen Syndrome, or Scotopic Sensitivity, respectively?
On January 19, 2007, 5:54 CET, Sardionerak said:
Hello,
I work as a web coordinator at a higher education institution. Although I really like your entry, there are a few things that I would not leave uncontested:

Point 8:
This would be a very new revelation. The last time I read about this (I think it was Jakob Nielsen), it said that optimal line lengths were between 55 and 75 characters… who to believe now? The tricky bit with 95 characters is that on some monitors, and also depending on your own distance to the screen, you can start to experience difficulties to get to the correct start of the next line. And that really hinders easy comprehension.

Point 10:
Are they refering to the writing style? Because that would significantly decrease scanability of the text. Or does it relate to product presentation in general, ie with images and all?

Point 12:
I very much doubt that! This would only be the case if users already knew in advance that something good was to come up on their screens. But how should they know in advance? If a web site needs 10 seconds to build, I am long gone… and especially with the high level of substitution on the web, people would flock to the competitor who can offer a similar degree of content without that click-and-wait stress.

Point 14:
I like this point. It would mean that if we found out where on the web our users spend most of our time (like MySpace among students) we could determine quite accurately where they would expect certain things to come up on our site. I will look into that.
On January 19, 2007, 11:04 CET, Jens Oliver Meiert said:
Sardionerak:

Regarding line length—there are different numbers, indeed. Performance and comprehension differ between people, some prefer less, some prefer more characters per line. (There are similar results when it comes to preferred fonts, so assertions in both areas are not “universally valid.”)

Regarding latency acceptance—there also are several studies that confirm the mentioned effect. The load time of trusted sites appears to be perceived differently than that of unknown or untrusted sites. I wanted to include a link to a recent study, but ***, I cannot find it yet.—There’s no doubt that you should nonetheless focus on fast load time!

Last but not least, regarding user expectations—at the end of the day it’s probably all about fulfilling user expectations.
On January 19, 2007, 11:04 CET, Simon Willison said:
Are many of those papers available online? It would be really useful to have links to them.
On January 19, 2007, 11:12 CET, Jens Oliver Meiert said:
Simon—you caught me being lazy 😉 Some studies have been published over at the ACM (not at no charge), but I’ll try to collect and add links. Thanks for raising this.
On January 22, 2007, 17:25 CET, muriel vandermeulen said:
Thanks for this clear and effective post! I’ll talk about it on my French blog…
On February 7, 2007, 18:00 CET, Patrick said:
Thak you for the clues.

There is a very interesting book about it: www.usability.gov/…

Salutation de Geneva (Switzerland)
On May 18, 2007, 0:50 CEST, alex said:
“Use of whitespace between paragraphs and in the left and right margins increases comprehension by almost 20 %.”

I like this one… Very nice article, thanks.
On November 15, 2007, 9:10 CET, Web designer Fredrick said:
wonderful post. Amazing research on webdesign usability. i supposed to agree to this point “Users will wait longer for better content. Users will wait between 8-10 seconds for information on the web, depending on the quality of the information” exactly in your post.

every web designer should aware of this 15 important valuable points while developing a professional website.
On December 30, 2007, 23:59 CET, Lazar said:
Hi,

so here seems to be a contradiction. In one post you advise against Conditional Commenting, while it seems to help for achieving better accessibility, as Dive Into Accessibility book shows in chapter on font sizes.

Do you know any more elegant way of achieving this relative size effect?
On January 2, 2008, 16:46 CET, Jens Oliver Meiert said:
Lazar, what do you mean with “contradiction,” and how may I help concerning relative font sizes?
On January 8, 2008, 5:19 CET, Lazar said:
In his book Mark uses conditional comment type of ‘trick’ to hide certain properties from Netscape, and he does that to achieve consistent accessibility regardless of the browser. I am trying for some time to figure out the best and most elegant (without tricks) way to do this with CSS. I try to avoid using Javascript to solve this font size issue. Any suggestion will be appreciated!
On January 21, 2008, 14:10 CET, Lazar said:
Sometimes I don’t express my thoughts well. Let me clarify it.

Every site that has option for changing font sizes that I have seen so far achieves it with Javascript. Another option is to use php sessions or cookies. Is there a way to do it with only CSS without reloading the page?
On August 19, 2008, 21:34 CEST, Jens Oliver Meiert said:
Follow-up: Web Design: 10 Additional Research Findings You Should Know.
On October 5, 2008, 18:23 CEST, mohamed Hassan said:
I am undergraduate BA student in Mogadishu - Somalia; I am currently under the preparation of the diploma thesis. Therefore, your support is highly needed by Mohamed. For instance, free samples of early written thesis etc.
On April 19, 2009, 16:38 CEST, Ricardo Lopes said:
Hello, I’m starting a classifieds website on my city(Jaraguá do Sul - Brazil) and this post was of definitely great help to me! Would it be possible, if not asking much, for you to give me 1 or 2 tips on my website? Thanks in advance!
On July 22, 2009, 11:37 CEST, The Baldchemist said:
You know, this is a very good article but may I suggest you take a leaf from your own book here and redesign your site!
Your information is all white space and layed out and rendered to the left! Why?
Don’t kid yourselves that users will wait for better content. Users do not want not wait longer for anything let alone better content. They want information a nd quick! Where on Earth does that derive?
Our experience tells us that users do not want to wait and if they are made to will go elsewhere.
Good design is a little like obscenity, you can’t describe it but you know it when you see it.

“Layout on a web page (whitespace and advanced layout of headers, indentation, and figures) may not measurably influence performance, but it does influence satisfaction. – Chaperro, Shaikh, and Baker, 2005.”
Other than that nice article. Thank you.
On September 28, 2009, 15:03 CEST, ohp said:
To only pick a few:
Point 1. To much text? You arrive on your site and what do you see?
Point 12. Are you serious?
To make my comment short. The rules to apply depend on your indent and audience.

oscr
On August 15, 2010, 23:05 CEST, Tony said:
Layout is important but it has also to navigate very easy, also for older people, which is often the problem. More and more older people are going online and often are fighting with websites they do not understand.