The online landscape is crowded. Competition to stand out, get recognized and engage an audience - and keep them coming back - is stronger than ever. But without the bottomless pockets of mega brands who can continually experiment with the latest web design technologies to make their sites sing and dance, is there a way of having a similarly dramatic effect simply by applying some basic psychological principles?
Why adopt psychology-based design? When designing for the web, considering the psychological drives of a target audience hasn't traditionally been a high priority. However, it can have a surprisingly positive influence on how users will utilize a website, how positively they'll engage and how frequently they'll respond to calls-to-action.
Our psychology affects how we interact with websites. Designers can use this to their advantage. Here are a few ways to use psychology when designing your site.
In order for website visitors to do what you want them to do, they first, on some level, have to trust you. Trust doesn't come easily, especially with constant news of identity theft and digital schemes and scams.
Without stifling creativity, by offering familiar and recognizable patterns, a website will instantly put visitors at ease... or do the opposite. The site's purpose must be immediately clear. Is the site providing information or selling a product or service? Users must be able to easily move between pages of interest. Steering too far away from basic user expectations in an effort to differentiate, can actually be counterproductive.
As designers, we often overlook this as we’re so used to conducting business online. But for our clients, and for their clients, the Internet can still be a big, scary black hole their information goes into.
With this in mind, you can use design psychology to make your website look more trust-worthy to the average visitor. Creating a website that puts visitors at ease means they’re more likely to sign up for an account, buy a product, or otherwise do business with you. This can be done through a combination of design and the language used on the site.
Familiarity and Recognizable Patterns
When someone lands on a page within a website, there are certain things they expect to see right away, pretty much regardless of the kind of site they’re on.
If they don’t see these things, they often feel as if they’ve ended up in some strange wasteland that doesn’t make sense to them (and therefore, isn’t trustworthy). The two big things people expect are the purpose of the site (which could be anything from providing information on a certain topic to selling a product to looking pretty) and some form of navigation.
While tag lines can help with discerning the purpose, the design can complement and reinforce that message. Let’s say, for example, that you’re designing an environmental blog. If your design is all dark and brooding and has a city skyline at sunset in the header, it’s not going to give us even the slightest hint about what the site’s purpose is.
On the other hand, if it’s a clean, modern-looking site with lots of green and natural-looking accents, that’s going to reinforce the fact that this is an environmental blog.
Beyond the elements everyone expects to find on every website, there are additional things people may expect on certain kinds of sites or within certain industries. People expect blog posts on the front page of a blog. They expect products on the front page of an ecommerce site. They expect a search function on any site that’s more than a few pages deep. And in most cases, they expect some kind of “about” information and a contact page.
In addition to the general elements most visitors expect to see on a site, there are often things visitors may associate with your company in particular. While this might not be a concern for a new business, or a very small business, it is a concern for many others.
Think about the colors you use in your offline promotional materials. Those colors should be incorporated into your website in some way, even if it’s just in the header image or as accent colors.
The same goes for your logo. If you use a logo in your printed marketing materials, you need to include it on your website, too. These are very basic things, but it’s surprising how many businesses overlook maintaining consistency between their online and offline marketing efforts.
The majority of sites have logos in the top left corner due to people commonly reading a website in a 'Z' pattern. It's wise to place the most important content within this pattern. In addition, every page on a site should have an obvious focus, whether it's to sell a product or to inform a visitor about a particular subject. Each page design needs to emphasize this focal point, ensuring visitors are clearly made aware of what they're doing there.
Incorporating emotional triggers into your designs is most commonly done through the language on the site itself, with graphic elements serving as a support system for those triggers. Use image and graphics that reinforce the trigger being used.
Well-worded text can be full of emotional triggers and with other design features (i.e. fonts, colors, images etc.), reinforcing the desired communication, user engagement and interaction can be dramatically increased.
Images are useful for reinforcing concepts. With many well-priced, professional online image libraries available, there's no excuse for poor or misleading images on a website. Great image choices make your intent clear and professionalism obvious.
The psychology of color is one of the more complex subjects in design. Needless to say, colors used in a website can have a significant impact on how visitors react and engage. For example, red is fiery and represents both love and anger while white signifies purity and innocence.
Allowing areas of white or negative space can be a powerful aid with this and when combined with properly styled and proportioned elements, can far more successfully direct visitors' attention and encourage a desired action.
The psychology of color is one of the more complex subjects in design psychology, and not something we’ll go in depth on here. But the colors you use can have a heavy impact on how your visitors perceive your site. Make sure the colors you’ve selected reinforce your message and the image you want to portray.
Below is a basic list of colors and their meanings. Of course, the combinations of colors you use along with their exact shade, hue, or tone will also have an impact on their meaning.
Red - Fiery and passionate, can represent both love and anger.
Orange - Shares attributes of both red and yellow. Associated with energy and warmth. It’s calmer than red and more cheerful.
Yellow - A warm, happy color. It can represent either joy or cowardice.
Green - Signifies nature, growth, and renewal. Along the same lines, green can sometimes represent inexperience. On the flip side, green is sometimes associated with envy or jealousy.
Blue - Calming and cool, but too much can be depressing. Often associated with corporate images.
Purple/Violet - Long associated with royalty and wealth. It’s also a spiritual color, and is thought to be creative.
Black - A bit of a chameleon, it can be conservative or edgy, traditional or modern. It can be mysterious and sexy or conventional and safe, depending on how it’s used.
White - Associated with purity and innocence. It goes well with any other color.
Gray - Neutral and balanced. Gray is conservative and sophisticated, but can be seen as moody, too.
Brown - A wholesome and down-to-earth color that denotes stability and reliability.
Focus of Each Page
Every page on your site should have a focus. There should be a purpose to every page, whether that purpose is to showcase a product, tell about your company, or serve up recent news.
Your design needs to put the emphasis on the focal element of every page. The focus of each page should also be immediately apparent, so that visitors know what they’re doing there. This can be accomplished through cues in the navigation or through a header, in addition to the page’s content.
One of the biggest marks of an amateur site is trying to put too much information on each page. Don’t be afraid of white space on your pages, and don’t be afraid of having a defined purpose for each and every page on your site.
Steps for Incorporating Design Psychology
Now that you’re familiar with what design psychology is and what it means to web design, you may be wondering how, exactly, you should go about incorporating it into your own design process. Here are a few techniques you can use:
Figure Out Who Your Visitors Are
Knowing who your visitors are is a hugely important first step in designing a site that will appeal to them. If your visitors are tech-savvy Internet veterans they’re going to have a different set of priorities than someone who only goes online to look at photos of their grand-kids. Figure out who your target user is and then figure out which emotional triggers will work for them.
Interview Your Users
If you’re not sure what your users or visitors want, try interviewing some of them. Find current or former customers and see if they’d be willing to answer a few questions about your site. Then create meaningful questions based on your own site’s specific goals. Most importantly, act on the advice they give you. Too often, companies do interviews or surveys but never make changes based on what they’re told.
Create a Sitemap for Your Site
You need to create a map of every page of your site so that you can ensure each page only has one focus. Make a list of everything that needs to be on your site, first, and then map out which page each item should go on (ideally, it should be one page per item unless things are very, very closely related).
Assemble Your Branding Elements
Make a list or create a file of the common elements used to represent your brand. Most likely, this would include a logo, a color scheme, and possibly a particular typeface. Then figure out where to incorporate these into your site design.
Do A/B Testing
Even if you do it on a limited basis, it’s important to figure out which site elements work best. If you’re unsure of what your visitors would be more comfortable with on a certain page, test it with two versions to see which one gets better results.
Design psychology is something every designer should strive to learn more about and to incorporate into their workflow. It can be the single biggest factor in how effective your designs are, and how happy your clients are as a result. It doesn’t take much time and isn’t particularly difficult, so there’s really no excuse not to take at least some of these principles and put them in practice.