Why The Concept Of “KISS” Is So Important

July 18, 2014

Tips & Tricks

Web Design


“Keep It Simple Stupid” is probably a phrase you’ve heard before. It can relate to a number of different scenarios, but today we’re talking about your website. Hick’s Law describes the time it takes for a person to make a decision as a result of the possible choices they have. As you might expect, increasing the number of choices decreases the speed and ease of the visitors decision making.

If you’re lucky you have five seconds to grab a visitors attention when they first get to your site, and if your home page looks like the one below, they’ll hit the back button before the page even finishes loading.

The example above bombards the visitor with choices, and doesn’t give them a clear path as to what the “next” logical choice is for that page. A good user experience should guide the visitor through the site, while also giving them clear options to take their own path if they’ve visited the site before.

Let’s go over a few items that make for a good design that enables the visitor to decide and act quickly, without being overwhelmed by too many choices.

Number of Menu Items
It’s generally recommended that your main navigation menu shouldn’t include more than eight items. To some this seems difficult since they want a home button, a request info button, their terms of use, privacy policy, etc. But a good design can eliminate all of those items from the primary navigation.

In 2014 it’s common knowledge that clicking the logo on a site brings you to the home page, so unless you have a very small menu, there’s no need to include a home button. It’s also expected that links for terms of use and privacy policy can be found in the footer, so there’s no need to waste valuable real estate with those. Lastly, your most important link on the site, request info, should not be placed on the same level as the primary navigation. Remember that clear path we discussed above? Regardless of what path the visitor ends up taking, the end should always lead to the request info page, or whatever the primary goal of your site is. This should be placed in the top right corner, in a clear call to action that is easy to see on every page.

Calls to Action (CTA)
Besides the request info link, there should be other clear calls to action on your site. In the example above there isn’t one single clear call to action. There’s red links, blue links, green links, purple links, and it’s impossible to tell which one is the most important. In the graphic below you can see that our home page has a clear call to action under a clear title with supporting text. Even if you have only one second to view our home page, it’s obvious that we are a Boston web design company. That’s what we want visitors to know right off the bat, and we provide a clear link for them to learn more about that service. It’s important that your calls to action stand out, and are a different color than other links on the page. Each page should have a clear one that leads the visitor to the next page you want them to visit.

Colors
While colors are important for calls to action, they’re also important for the overall design. After the wireframes have been completed, the user experience has been outlined, and the overall goal of the site and each page has been defined, the next step is to discuss colors. As you can see in the guide below, each color provokes a different emotion. Having too many colors in a design can make it very confusing for a visitor, especially if you have conflicting colors. Generally your call to action is a good place to add a supporting color to your color palate. Since you want it to stand out, picking a color that doesn’t blend with the rest of the site makes sense.

Fonts
We all loved playing around with Comic Sans as a kid, but please, PLEASE keep it off of your website! There’s no quicker way to destroy a good design than to slap an ugly font on it. As a general rule of thumb your site should not include more than three fonts. The first font most visitors will see is the one in your logo. I’m sure you love your logo and the font you chose for it, I know I do, but if it’s a really complex font, or doesn’t read well in paragraphs, you shouldn’t use it for the primary text on your site. The primary text should be very easy to read, scale up and down well for different sizes, and should compliment the overall design of your site. If you must add another font, it’s important to make sure it is nothing like your primary font. If it’s a simple variation it may look odd next to the other one. Make sure there is plenty of contrast between the two, while also sticking to the rule that it should compliment the overall design of your site.

We can’t design the perfect website where every visitor makes the same decision in the same amount of time, but we can make the decision making process easier, Like I said in the beginning; keep it simple stupid. The more choices you can eliminate, the more enjoyable the experience will be for your visitors.