Here at LookThink, we spend our time working on user-interfaces for a wide variety of industries and user-types. From government to health care to consumer facing businesses, we have jumped into the shoes of countless user types and faced just about every challenge you can imagine when it comes revamping an interface or creating one from scratch.
Settling on fonts and colors and making sure all of the desired functionality has its home is of course critical. But there are many other elements to factor into your plans to make sure that your users can intuitively use your website, application, or tool without frustration.
This series of posts will cover four imperative, yet often ignored, elements of user-interface design that can make the difference between a final product that is just average and one that truly stands out in the crowd. If you are interested in anticipating users needs and balancing content and design for a beautiful, functional end result – read on!
Crucial Element #1: White Space
White space or “negative space” refers to the empty space in a design or page layout. It’s often ignored or overlooked – or worst of all filled with content – but it’s sacred and should be preserved.
It’s tempting to assume that white space is wasted space but this breathing room is critical for readability and usability because it gives you the room you need to present content in a prioritized manner.
One common argument for limiting whitespace is that it pushes elements and content “below the fold,” meaning content won’t be seen if it isn’t immediately visible upon page load. This might have been true 5-10 years ago, but the concept of the fold is outdated in a landscape of devices (think smart phones and tablets) that have trained users to scroll without question.
Let’s take a look at two fitness clubs websites to compare good and bad use of white space.
Exhibit A:
Feel overwhelmed? Don’t know where to start? We’re with you. Crossfit’s site is cluttered and loud. There is far too much content shoved into a small space which creates a stressful experience because users don’t know where they should focus their attention.
Now try this on for size…
Exhibit B:
Feeling calmer already? The empty space on the Equinox site allows copy to breathe and helps its readers absorb information. The white space also gives this elegant design the ability to guide the user purposefully from one element to the next.
Legibility and usability issues can often be resolved by judiciously implementing whitespace. Especially on the web, users want to scan content – and properly balanced white space allows for just that.
So if white space is so great why isn’t it universally implemented?
Crafting the content that your users will see first takes a great deal of strategic thought so it’s common to shove copious amounts of content to the top of the page to avoid making any tough editing decisions. The important thing to remember is that the modern web and app user knows there is always more to see “below the fold” and that getting there only requires a quick scroll.
Remember – white space will let your content sing so spend the necessary time to develop strategic content that can be presented in a prioritized manner throughout the page.