There’s no such thing as information overload, only bad design.
—Edward Tufte
The internet is a great source for finding information. It works so well that for most topics there’s far too much information than we know what to do with. In fact there’s often so much information that it’s hard to know what is and isn’t true. Sadly most of the information we encounter is noise. It’s useless or untrue and mostly makes it harder to find the signal, the information we want and trust.
When the noise becomes so dense it can seem impossible to find the signal. It can be like trying to find the proverbial needle in a haystack.
The term signal-to-noise ratio is one likely familiar to you. It’s used mainly in science and engineering to measure the desired electromagnetic signal as compared to the background noise. While the term has its origins in radio it has come to serve as a metaphor for a wide variety of things and here we’ll consider it to mean the ratio of relevant to irrelevant information in a design.
The highest possible signal-to-noise ratio is your goal as a designer.
What is Signal-to-Noise Ratio?
There are a series of steps in any communication. It begins with the creation of a message, followed by the transmission of that message, and ending with the reception of that message by another party. At each of these 3 stages the signal itself degrades some and noise is added.
In analog and digital communication signal-to-noise ratio (S/N or SNR) is a measure of the signal strength that is received relative to the background noise that is also received. If you’ve ever tried to fine tune the reception of an AM/FM radio so you could better hear a station amidst the static you were doing what you could to increase the signal-to-noise ratio.
For our purposes as designers the signal is the information you want to communicate to your audience, the message you are trying to convey. Noise is pretty much everything else. It’s all the extraneous information that doesn’t serve to communicate your message.
The higher the signal-to-noise ratio of your design, the more clearly your message is communicated to those viewing your design. Your goal with every design should be to strive for the maximum S/N possible.
How to Improve Signal-to-Noise Ratio in Your Designs
In order to improve the S/N in our designs we can increase the signal, reduce the noise, or ideally do both.
To maximize the signal we want to communicate as clearly as possible and have everything in our designs work together in harmony, in unity toward a single purpose. Any information not presented clearly, any information that is presented inefficiently or inappropriately degrades the signal and adds noise to our designs.
Emphasize your most important design elements. If the main thing you want to communicate on the page is your contact information, then make sure your contact information stands out. Don’t bury it inside a paragraph of extraneous information. Make it big and bold so it’s the first thing people notice.
Even before you begin to design the visuals take some time to develop a design strategy so your elements can work together. Think about why the page will exist in your site. Think about what information that page needs to communicate and then prioritize the different elements that need to be on the page in order to communicate your message. Once you’ve prioritized page elements you’ll know which needs to be the focal point of the design and where the design should flow from the entry point.
Follow the principle of Occam’s Razor in web design. All other things being equal, the simplest solution is the best.
Use whitespace to create simple uncluttered designs. Only include what’s necessary on the page. Remember every mark on the page (from a simple line to a complex image) that isn’t contributing to the signal is noise. Remove all those unnecessary marks. Don’t try to cram everything you can into a design thinking more is better. More signal is better, but most of what you’re cramming into the design is noise.
In the image above there’s a small circle near the center of all the shapes. How easy is it to notice? If that circle was your signal how well do you think it gets through to your audience?
Compare the image above to the one below. The same amount of information (shapes) are in both images. In the image below the shapes have been moved away from the circle representing our signal. The whitespace surrounding the circle helps it (our signal) to shine through the noise.
There’s an equal amount of noise in both images above. Notice how in the second image we didn’t add signal or remove noise. Instead we moved elements around on the page to help the signal show clearly.
What is Signal? What is Noise?
The questions above aren’t as easy to answer as they might seem at first. What’s signal to one, may be noise to another.
Not everyone landing on your page is looking for the same thing. You have a message you want to communicate. Your visitors have different tasks they hope to complete. Two different visitors to your site might see completely different things as signal. The signal-to-noise ratio of your design will be different to those different visitors.
Use contrast, repetition, alignment, and proximity to make your design easily scannable. Make it easy for visitors to find what they consider signal. Develop hierarchies in your design elements to further aid scannability.
When it comes to noise is every unnecessary element truly noise? Perhaps. Some elements though may not be completely necessary, but do end up supporting another design element that is necessary. I would suggest if you can’t argue a good reason why an element is in your design then it is noise. If you can defend it’s presence in some way then it crosses into signal.
It’s unlikely that your design will be 100% signal and 0% noise. Don’t worry or stress over that fact. Just strive to increase signal and reduce noise wherever you can. Have a reason and be able to defend all of your design choices.
Signal-to-Noise in Maketing
I’m guessing a large number of you reading do your own marketing so let’s talk briefly about signal-to-noise as it relates to marketing your business.
Earlier I said most of the information you come across on the web is sadly noise. Don’t be part of that noise. The more you can stand out as signal the better. Be the purple cow, be remarkable. Cut through the noise and become the signal.
If you blog spend an extra hour to refine and craft your post instead of publishing what’s really a first draft. Strive for the highest quality in everything you do.
You want your design elements working together. The same should be true of your marketing efforts. Think brand above everything else. How do you want people to see your brand? Do you want them to see you as friendly and easy to approach? Then don’t get into silly arguments on forums. Don’t attack others in a blog post even if your attack will be likely to bring droves of traffic. The traffic will be temporary. The damage to your brand won’t be.
Instead of trying to pull any traffic you can to your site, try to pull targeted traffic. Instead of acquiring 10 new visitors, acquire one new subscriber.
When it comes to building links into your site keep in mind that some will be signal and most will be noise. Focus on acquiring signal links. Write an article for a high profile site instead of emailing requests for link exchanges to everyone on the planet.
With social sites like Twitter or Facebook a few important contacts who you genuinely interact with are worth much more than thousands of followers who pay no attention to you nor you to them.
Ultimately you want to develop a marketing strategy instead of chasing after the latest tactics. Your business has a story to tell. A story that will resonate well with a specific group of people that makes up your potential clients and customers. All of your marketing efforts should be reinforcing that story. Whenever you deviate from that story you introduce noise into your marketing.
Examples: Two Ecommerce Sites
Compare the two ecommerce sites below. Which design allows more of the signal to show through? Why?
Ritz Camera crams quite a bit of information on their home page, particularly in the header. It’s hard to know where to look and nothing specifically stands out. Text has little room to breathe and different messages compete with each other for attention.
Opera Ma Gè on the other hand makes great use of whitespace on its home page. Even without speaking the language it’s easy to tell what the site sells and your eye can easily fall on different parts of the page. Page elements aren’t competing with each other.
Of the two designs above which lets more signal show? Which contains more noise?
Summary
Signal-to-noise ratio is a relatively easy concept to understand. Despite that there’s a tendency on the web to cram every possible bit of information that can fit on a page.
Better would be to only include what’s necessary on the page to communicate your message. Trying to communicate too many things at once only leads to the message being lost. Your signal has to stand out. It has to be noticed if you want it to be received.
Make use of solid design principles to emphasis the signal and reduce the noise in your designs. A certain amount of noise will inevitably find its way in, but try not to let it overwhelm your signal.
As visual designers we want to communicate something to our audience. That something is the signal. Everything else is noise and our goal should always be to seek the highest signal-to-noise ratio possible.
Download a free sample from my book, Design Fundamentals.
I always wanted to know more about signal to noise and how it works in design, really informative article. Thanks!