Higher Logic Blog - Banner

Reducing Cognitive Load: The Best UX Design for Your Community Site

Written by Molly Talbert | on February 8, 2016 at 9:00 AM

ReducingCognitiveLoad_800x300.jpg

Have you ever given up on using a website because it takes too much brainpower to figure it out? Or even find what it’s for? This happened to me last time I flew and tried to check in online. The problem: if I did give up, I wouldn’t have been able to get on the airplane. So I grumbled through the process and finally figured it out. Why was it so bad? Their user experience was poor and I couldn’t figure out what steps I needed to take -- the extraneous cognitive load was too much.

We’ve all had that kind of experience and know how frustrating it is. And you definitely don’t want this to happen to your community members when they use your site. Because unlike my experience with that un-named airline, if members give up, the consequences feel pretty small for them -- they just won’t use the community. They have no idea what a wealth of information they’re missing out on.

What are user experience and cognitive load?

First, let’s start with user experience (UX). UX refers to how a person reacts and feels about your website, whether it’s their first or hundredth time there. Is it intuitive or difficult to navigate through? Are the colors calming or jarring? Every detail plays a part in a person’s experience and shouldn’t be overlooked.

Cognitive load refers to the amount of energy used when learning something, like how to navigate a new website. There will always be some intrinsic cognitive load -- that’s unavoidable. But what you can work on is extraneous cognitive load; that’s created by adding unnecessary details that make learning more difficult. Google has a very low extraneous cognitive load -- when you go to their search engine, you know exactly what it’s for and what action to take. A big software program like Adobe Photoshop has a high extraneous cognitive load, because it takes time to learn how to use it. If a website is too confusing and the extraneous cognitive load is high, visitors become frustrated and leave.

So how do UX and cognitive load fit together? Good UX makes a site easier and more intuitive to use. The more natural it is to use, the less cognitive load is put on a user and the better their experience is. That’s what you want.

What causes cognitive “overload”?

No matter what, there will always be a certain level of intrinsic cognitive load -- it’s unavoidable. Rather than trying to eliminate cognitive load, you can become more aware of it and take a good hard look at your UX. The better your UX, the less cognitive load you’ll put on your members and the more people will enjoy using your community.

Before diving into UX and cognitive load, here’s a quick example for poor UX:

Poor_UX.png

 

Even though it’s easy to understand what information Spirit Airlines is getting across (tips for flying with them), the yellow background is very jarring. The black font contrasts with the yellow, making it clear, but the font size is small. Overall, reading this page isn’t enjoyable and could be difficult for some people, depending on their eyesight.

Here is a well designed website that won a Webby award for best home page:

Good_UX.png

The TED website is so well designed because it helps users dive right in. Why do you visit TED? To watch videos. The first thing you see on their homepage are videos that are easy to click on. The white background is calming and doesn’t clash with anything on the page. Over all, it’s intuitive, makes sense and is easy to navigate.

So how do you make your website easy to use?

Reducing cognitive load may seem like a daunting task, but it doesn’t need to be very technical. There are a few things you can do to get started:

1. De-clutter

Nothing like a dose of tough love to get your website in shape and reduce cognitive load. Take a good, hard look at everything, even the cool widget you spent days perfecting -- what adds value and what doesn’t? Now for the painful part: take out everything that doesn’t matter. If it doesn’t add value or is redundant, it will only get in the way of your users’ experience, making them use more brain power than necessary.

How do you know what adds value and what doesn’t? First, think about the purpose of your community and subsequently the specific page you’re on. Let’s say you’re looking at the homepage as a logged in user. What do you want them to do? Probably dive into conversation and register for next month’s event. Does everything on your homepage -- each photo, banner, line of copy -- progress these three goals? If not, take it out and highlight the actions you do want your users to take.

2. Steal like an artist

You don’t have to think of a totally new, original, revolutionary website design to make yours great. You’re welcome to, but that’s a tough task. Instead, steal like an artist. What are some of your favorite websites? (I love Vimeo’s design) Why do you like them? It could be the slick layout, the color scheme or the fonts they chose. Now ask yourself which aspects of those sites you can adopt. Also look at your least favorite websites. What do you not like about them? What makes them clunky or unappealing to look at? Make sure you don’t replicate those mistakes.

3. Minimize choices

True, you want to give your members the world, but too many choices actually paralyzes rather than liberates. You probably know the feeling -- is it easier to pick an ice cream flavor from three or 30 options? With that in mind, make visitors’ lives easier by eliminating redundant options and spreading choices throughout the site in places that make sense.

4. Group similar things together

Rather than searching all over the community for something similar, group items together so it takes less brain power to find them. Here’s an example: I often search through blogs before deciding to subscribe. Sometimes I have trouble finding the search bar. The subscribe button is usually very easy to find -- they want more subscribers -- but I want to look around before committing. So, if I were redesigning a website to reduce cognitive load, I’d probably put those buttons together, clearly marking which is which, since there seems to be a connection between those actions. 

5. Think about readability

 It’s not just about what you write. It’s about how it looks on the page. Here’s what I mean: How do you feel when you see a large chunk of text with small font on a page? Do you really want to read it? That’s why it’s important to break text into smaller chunks, add sub-headers if needed and make the font larger. Spread out copy on the website so it’s easier to read and less intimidating.

6. Keep accessibility in mind

Many people use assistive technologies when using their computer, like magnifiers or text-to-speech software. Imagine the cognitive overload on a person who relies on these programs and can’t access your site? That’s why it’s important to keep accessibility in mind when designing your community.

Accessibility goes beyond assistive technologies, though. Similar to readability, it’s important to think about how easy your website is to use for all sorts of people. For example, can a person with color blindness read the font? Rather than seeing this as an added task or drag, remember accessibility tends often make a site look better overall, benefitting all community members.

7. Be consistent

This may be obvious for some, but it’s important to keep consistency in mind. Create a style guide and stick to it. Don’t switch up the fonts or text size, don’t play around with colors that aren’t in your brand package. Even if it doesn’t bother you, it will bother someone -- which will make using your site slightly more annoying.


Any little steps you can take to reduce cognitive load will not only make your community look better, but it will allow users to get even more value out of it. If finding the resource library or posting a blog is a constant struggle, then why would members spend the time to do so? Making simple tasks even more simple will go a long way.


 

Topics: Community Management

There are 0 Comments.
Share Your Thoughts.

Subscribe to the blog by email

Subscribe to the blog by RSS

rssHigher Logic Blog Feed

We're Featured

Association Universe