The Psychology of Web Design

Jon-Mikel Bailey — November 26, 2016 Follow @jonmikelbailey

There is a psychology to web design that is often overlooked. We still hear clients talking more about what web design they like and not enough about what works.

Personal preference is fine. It will factor into the design of a website. Your personal preference, however, may not produce a design that moves your target audience to action.

The initial decisions made online are based on emotion and the subconscious. Users will make a judgment about your website before they read a word of text.

1. Is this a safe website?
   
2. Do the colors make them feel warm, excited, sad, amused?
   
3. Does the website feel like the right place?
   
4. Are the choices available clear and appropriate?

These factors are evaluated within microseconds. Let’s take a look at 3 of the subconscious design influencers:

1. color
   
2. composition
   
3. attitude

Your Website’s Color Palette

The colors used in your design elicit emotion and drive action. I don’t want to get to into what colors mean (you can read more about color meaning here). There are so many variances that can affect these rules.

For example, blue generally means stable and trustworthy. But, what if your brand colors are in the yellow family? Do you really want a yellow and blue website? Maybe, but it could get ridiculous.

You can get so fixated on color meaning that you miss opportunities to stand out or drive conversion. Also, some color palettes can go in and out of style.

Websites today are often very clean and bright using transparent overlays and bold accent colors. But, a few years ago, everyone wanted a more rich and earthy palette.

So, if you want to look modern, you’ll need to do some research and see what other successful websites are doing. You can also look at blogs like Vandelay Design (I’ll just assume this is a Seinfeld reference). They offer lots of great resources for digging deeper into color and design trends.

When picking a color palette, don’t fixate too much on the colors you like. Instead, pick your colors based on the following…

1. Branding – generally your brand will rely on one or two main colors and a handful of supporting colors. If you don’t have a brand guide (or brand book) that dictates colors, fonts, and styles, you might want to start there first.
   
2. Industry – are you in IT? Then maybe blue makes sense. Are you a “green” business? Maybe greens and/or earth tones. International? Maybe some reds, oranges, and other vibrant tones. But, you don’t want to look like everyone else…
   
3. Competition – this is where it can get interesting. What are your top competitors using? Maybe you want to do something similar. OR… maybe you want to stand out from the pack. If you’re trying to brand yourself as different or an alternative to the rest, try using a completely different color palette. But, be careful. Sometimes you can overdo it and design yourself right out of your industry. Pay attention to how strong certain colors are for certain industries. Maybe all you’ll need is a subtle shift.

Whatever colors you use, you’ll want to do your research. Colors have a powerful effect on people and can elicit very strong opinions both for and against.

The Composition of Your Website’s Design

Basic elements of composition are often overlooked. But, they can make a huge difference in the performance of your website.

The arrangement of information on your pages can have a huge impact on whether or not the user takes action. They won’t act on what they don’t see.

Some simple elements of composition that can have an impact on your design include…

1. Contrast – use complimentary colors or light/dark contrast to draw attention to the important elements of a page. A light element against a dark background will be more noticeable than one on a slightly darker background.
   
2. Balance – symmetry and asymmetry can help lead the user’s eye to the places you want them to go. Our brains want to create balance. So, set something slightly off balance and the user will be drawn to it. Just be careful. Too much asymmetry might trigger a bad OCD response.
   
3. Spatial arrangement – elements like the rule of thirds, leading lines, foreground/background are all great ways to lead the eye to where you want it to go.

Here is a great resource on design composition.

Wireframing and mood boards are useful ways to map out the use of these elements before getting too far down the design rabbit hole. Think of this as having a floor-plan before you move all the furniture in and hang curtains.

Does Your Website Have an Attitude?

The images, tone of voice, and colors you use can all put forward a certain attitude. But, before you start throwing attitude around, you have to know who you are?

Does your brand have a certain voice? Are you serious, funny, sad, hopeful? Forget about the SWOT analysis for a minute and really ask yourself…

What is our attitude? How do our clients perceive us?

One of the worst things you can do is lead with an attitude that simply does not match your brand’s voice and reputation.

Ever seen a website trying to use humor for a company that is not known for their sense of humor? It’s usually awkward. Be careful with humor. You need to be a) good at it and b) sure your audience will get the joke.

Instead of forcing something, go with what’s natural. Match colors, images, and voice with your reputation. You can shake it up when you want to have something really stand out.

Being authentic will always win over being forced. Match your culture to the audience’s needs and you have the perfect attitude. You want your website to feel like an extension of your company:

1. Voice – the language you use and the overall tone of your content and calls to action
   
2. Brand – see above; the color, images, and design styles you use should match your brand
   
3. Core Values – the design should relay feelings that match your values, i.e. quality, service, value, whatever they may be

Before you design your site, you should have an opportunity to detail your “attitude” to your designer. It’s so much more than just design or layout. If the designer knows the attitude, and they’re good at what they do, that attitude should come through in their designs.

Your website is still your marketing hub. Don’t skimp on design because it’s the first impression your organization can make.

(48)