Improve Your Web Design’s User Experience With Behavioral Psychology & Fitts’ Law

KEY
POINTS

• By providing users what they are conditioned to seeing elsewhere on the web, you can help make your web design familiar and immediately more user friendly.
• It’s important to keep key action points (buttons, calls to action, etc.) close to a website visitor at all times so that they can quickly find and to action on those items.
• Website user experience designers have made significant improvements to commercial websites by being aware of a user’s behavioral psychology before arriving to the website.

There are some web design elements you expect to see on every website you visit. Things like a logo, navigation bar or menu, and a hero section at the top of the page inducing the website’s main theme, topic, product, or service.

You expect to see those things because every website you have been to before has had them. Not only has every website had them, but they generally are in the same area of each website. The logo is in the upper left corner, the navigation is in the upper right, etc.

The formation of your expectation to see those things, and in those areas, is a result of your previous experience with websites. Those previous experiences have conditioned you to assume those web design elements always belong in those areas.

When you don’t find those design elements where you expect them, it stands out. Sometimes it is interesting, but often times it can be frustrating to a website visitor that needs to find something on your website as easily and quickly as possible, resulting in a poor user experience.

The process of learning what elements of a website’s design are expected in certain areas of a web page is the application of behavioral psychology in web design.

What Is Behavioral Psychology In Web Design?

Behavioral psychology is the study of observable behavior, and theory that suggests all human behavior is based on the environment an individual is trained or conditioned in. Behavioral psychology will help you determine how your website’s visitors were previously been conditioned on what to expect from websites in your industry.

Using behavioral psychology will allow you to create web designs that are more usable and easy for your website’s users to understand and engage with.

Research On How Behavioral Psychology Has Evolved Web Design And Improved User Experiences

A 2019 research paper published by Alla Kompaniets, and Hanna Chemerys from the Ukrainian Journal of Educational Studies and Information Technology made the observation that commercial website design has evolved from having “as much content as possible on the interface,” to now offering “the user the right content, functionality at the right time” as a result of user experience designers better understanding “which psychological concepts are fundamental to the design of UX, how cognitive load is formed, and how it affects user experience.“

In short, by understanding how website visitors have previously been conditioned to find what’s important to them on a website, user experience designers are able to create web designs that put that important information in the areas they believe users will look for it.

A lot of this evolution is thanks to custom WordPress sites that are always becoming easy to use. The ease-of-use offered by mobile design sites allow user experience designers to make small changes to help you get the right content in front of the right audience.

Beginning Your Web Design With Behavioral Psychology

By using behaviorism in the beginning stages of your design project you will gain an understanding what your website visitors expect from websites in your industry. These insights will help you create the initial layout, navigation, and user paths for your web design in a way that will seem intuitive for the your website visitors to use.

While behavioral psychology will help your formulate the basics of your overall web design at the start of a project, it can’t be used in isolation if you want to provide the best possible user experience.

To produce the most user-friendly website design you will want to combine both behavioral psychology with the principles of Fitts’ Law. Professional web designers often incorporate these principles by default without always being aware of why they do it.

What Is Fitts’ Law In Web Design?

Established in 1954 Paul Fitts, Fitts’ Law was originally developed by studying an individual’s movement in the physical world. By applying it to graphical user interfaces, Fitts’ Law gives website user interface designers a model for understanding human movement across a web page.

Because of Fitts’ Law, user interface and user experience designers are able to understand that the time it will take a user to complete a desired action is dependent on the distance and size of that action’s target.

A Simple Fitts’ Law Explanation

When it comes to web design, if you want a user to click on a button to complete an action (such as a purchase, lead form submission, etc.) the likelihood of it occurring, and the time it takes to occur, will in part be based on how easy that button is to find on the web page and distance of it from where on the webpage the user is right now.

• If a button is right in front of the user, where they are on the webpage currently, it will take them less time to engage with it. (short distance)
• The large a button is, the less time it will take them to engage with it. (large target)

By using Fitts’ Law in your web design, your website can provide a better user experience by:

• Understanding where on a web page a website visitor is.
• What a website visitor is looking for or hoping to find while there.
• Making sure the target of what they are looking for is both close to that position and large enough for them to quickly find.

An Example Of Fitts’ Law Applied To Web Design Navigation

It’s not an accident that a website’s navigation is almost always in the same place on every website you go to.

Fitts’ Law dictates that since it is one of the most used elements on your website, it should be close to where your eyes will naturally gravitate to, and large enough for you to immediately identify. That means the top of the page, and since most people read left to right, it’s the second thing you identify after the logo (which is where it is so that you first understand what website you are on.)

By it being there, it will be a target that you can easily find and use to get to the product or information you are looking for.

It is also a function of behavioral psychology that we are conditioned to and now expect to find the navigation in that area of a website.

An Example Of Fitts’ Law Applied To Web Design Call To Actions

When you arrive on the homepage for most websites you will find a hero section just below the navigation bar that has a website’s primary offer featured on it.

If the website is owned by a company that offers one particularly line of services or products, there will almost always be a call to action button in that hero section for users to engage with.

This is also a result of Fitts’ Law. When your website visitor first arrives to your homepage, you increase the likelihood that they will engage with your primary offer by making it a target that is immediately viewable (short distance), and with a button that is easy to see (large target) and engage with almost immediately.

If you as a web designer have always put the hero with a call to action there and didn’t realize why you did other than “That’s where it goes” – that would be evidence of behaviorism in action. You’ve always seen it there, so your observable behavior is to also put it there because of your previous conditioning.

How To Use Behavioral Psychology To Improve Your Website’s Design

Here is a simple three-step process you can follow to help improve the user experience with your web design with behavioral psychology.

1. Review Your Competitors Websites Taking Note Of Common Design Themes

Record things like:

• What they are offering in the hero section.
• Where they prominently feature their products and services on their homepage.
• How their navigation and information architecture is constructed.
  • How they categorize products or services.
• What their checkout or lead generation forms look like.

These observations will be used to understand website visitors’ previous conditioning with other websites in your industry.

2. While Reviewing Competitors Websites Determine If You Are Able To Find Everything You Want Or If There Is Room For Improvement

• You may find that certain products or services are harder to find than others.
• You may find that there is so much information in one area of a website that you would have difficulty with completing a transaction if you were a customer.
• You may also find that the wrong information is in the wrong place of a webpage and creates too much distance between the top of a page and the button (or target) needing to be used to take an action.

Also make note of any of these observations so that you improve upon them in your web design.

3. Construct Your Web Design To Be Unique To Your Business, But Also Familiar For New Customers

To not have your web design feel like a copycat of a competitor’s website design, you need to ensure that it offers styling and visual communication that is unique and specific to your business.

Beneath that superficial aesthetic layer, you should take what you learn about the information architecture of your competitor’s websites and construct yours in a similar fashion where is makes sense. Obviously you don’t want to duplicate poor web design choices should you find them, but you do want your website to feel naturally intuitive to use for customers that may have previous experience with your competitors websites.

Finally, be sure to optimize your web design’s primary action points so that they are close to the top of the page and large enough to identify quickly as the visitor moves through your website’s layout and design.

Final Thoughts On Using Behavioral Psychology In Web Design

By understanding how your customers have previously been conditioned to use website’s in your industry, you can create new web designs that feel easy for them to use.

Combined with Fitts’ Law and making your action targets easy to quickly find and use, you will put your web design in a much better position to create a rewarding user experience, leaving your customer with a position impression of your business.

Resources:

• Generalization of the experience of using research on psychology of behavior for designing UX design software products. 30 September 2019, Alla Kompaniets, Hanna Chemerys, Computer Science, Ukrainian Journal of Educational Studies and Information Technology
• Acquisition Speed with Targets on the Edge of the Screen: An Application of Fitts’ Law to Commonly Used Web Browser Controls. 1 October 2001, J. S. Farris, Keith S. Jones, Brent A. Anders, Computer Science, Proceedings of the Human Factors and Ergonomics Society Annual Meeting

Do You Want A Partner That Understands Web Design At A Psychological Level?

We are always around to be your secret competitive advantage if you need us. All you have to do is say hi.

Your name

Your email

Your Phone Number

How Can We Help (optional)