Improve Your Website by Enhancing the Signal to Noise Ratio

— January 2, 2017

User interfaces exist to help users perform tasks. Each and every element of an interface should exist to help facilitate the completion of a task. If you think back to times when you were frustrated using a website, mobile app, or other device, it was most likely the result of a poorly designed interface.


Keeping usability in mind, when you approach your next website design project, remember that you want to create an interface that helps facilitate the completion of tasks. To do this you want your user interface to be clear, intuitive and user-friendly. Reducing the amount of noise on an interface will help boost the signal and improve usability.


These 5 tips will help you create a user interface with an improved signal to noise ratio:


Design mobile first


There are many benefits to approaching a website from a mobile first perspective. By starting with mobile first, you are able to concentrate on the most basic user requirements because of the constraints presented by the mobile platform. Mobile devices are not only smaller in terms of available real estate, but they also have lower connection speeds or even limited data usage due to data plans that must be considered. These limitations force you to be more focused with your content and help produce a quick, concise and relevant experience that will transition over to your desktop version.


Often designers will try to shoe-horn desktop sites into mobile device designs but the result is often a website that creates a poor user experience for mobile users since they often end up having to scroll downwards extensively to find the content they are looking for. A better approach is to start by carefully considering the information architecture and necessary content for mobile users. Ask yourself, what content is most important to the mobile user and what challenges will they face while accessing it? By doing this, it allows you to design from the content outward. Often designers will try to create content to fit a layout and then shoe-horn their desktop design into mobile, but by thinking mobile first it allows you to concentrate your efforts on essential content and reduce clutter and noise.


Don’t randomly place elements


Your interface should quickly let users know where they are and what they can do on your website. To do this you need to properly place not only your branding elements but your high-priority items. Since visitors typically look to the upper left corner for branding elements it works well to start by placing them there. Next, give your high-priority items a prominent location, such as the upper portion of the page just below your navigation and make sure they are not competing with other elements for attention.


The most challenging part of this is determining what the high-priority items are from your users’ point-of-view. To do this you will need to develop an understanding of your users’ needs. Remember that if your website is difficult to use, visitors will leave. Focus on creating a website that meets your visitors needs and is easy to use and you will improve results. You can only do this if you know what your users are looking for.


From there, you can help reduce clutter by moving utility navigation out of the content area and general navigation and placing it on the upper right of your website. This placement has become a generally accepted position for utility navigation and is highly visible to users looking for items like log in, contact us or search.


Use color purposefully


When a visitor first gets to your website they won’t automatically understand your color scheme. They most likely understand that your color choices indicate relationships between various items and you want to make it easy on them to quickly understand what those are on your website. Every website has a different feel and based on that, each tends to require a different color scheme. When it comes to colors, there isn’t a single right answer.


Generally the dominant color on a website is driven by the branding; often this color will be part of the larger elements of the design. From there you will need to select a highlight color to draw attention to key elements of the design. You can use this color to pull your visitors’ attention in a particular direction, such as buttons or calls-to-action. When it comes to selecting this color, A/B testing can be invaluable in finding which works the best for your target demographic.


While some designers like to use colors such as green since green typically is associated with “go” in many cultures and stay away from red since it is often associated with “stop” it is better to try to stay away from conventions such as this. Many businesses have found through A/B testing that red was the right color for their buttons and calls-to-action. Key here is that the color you choose is able to grab a visitor’s attention and provide a consistent message to visitors.


As you are choosing colors remember to make your choices purposeful as users will be trying to understand the relationships they represent. The random use of colors throughout your design will not allow users to do that and will reduce the quality of the user experience, meanwhile, carefully selected and well-used colors can boost the signal within your design.


Utilize meaningful icons


Meaningful icons can help you convey ideas to your website visitors at a glance. But keep in mind that a visitor’s ability to understand your icons is based on their past experiences. The use of icons can help save space and clean up your interface allowing visitors to focus attention on high-priority parts of your website while also helping improve the aesthetic appeal of your interface.


When you are selecting icons for use, make sure you remember that icons must most importantly convey meaning to visitors. If the information they represent is not instantly clear to users, the icon can confuse and frustrate users, amounting to little more than visual noise. Poor choices of icons can in fact create friction that hinders users from completing their intended tasks. It is best to begin by familiarizing yourself with commonly used icons so you understand what will be easily understood by your users.


Focus on benefits to users, not features


When looking at your user interface are you merely conveying functions or are you letting your users know the value you provide to them? It is a generally accepted principle of good marketing that you identify benefits to users and not just features. By identifying benefits and highlighting those, it will help you improve sales and reduce the clutter from your interface.


If you are not aware of the difference, a feature is a factual statement about who you are and what you offer, such as saying you have been in business since 1988 or that your product comes with a 25 page owner’s manual. Factual statements are not why customers make purchases; customers make purchase because of the benefit to them. Rephrase what you offer in terms of the benefit to consumers. For instance, instead of talking about being in business since 1988 mention how reliable you are, since reliability is a benefit customers are eager to buy. Instead of mentioning your product comes with a 25 page owner’s manual, tell visitors that they can find answers to their product questions quickly and easily.


Benefits are what sell. If you are having a hard time understanding the difference, remember that benefits answer the simple customer question of “What’s in it for me?” By focusing on benefits you can help reduce the noise on your website.

Digital & Social Articles on Business 2 Community

Author: Kimber Johnson


View full profile ›

(46)