"A few years ago my family went on a little trip down to southern California to hit all the theme parks and the beach. We spent a day at the Wild Animal Park, a day at Legoland, three days at the mighty Disneyland and a day at Universal Studios California. All the park were great, except Universal Studios. Maybe it was because we were tired of walking around but Universal Studios was awful. We got there early, parked and migrated with a couple dozen other people through the narrow hallway of the outdoor mall that leads to the entrance of the park.

Once we finally got there, we were kindly greeted by a gang of employees trying to sell us bags or something. After ignoring them like you would ignore a solicitor on your doorstep, we managed to make it down to a couple of the ride entrances. A couple hours later, after standing in narrow waiting areas, being squooshed into small ride cars and constantly bumping into other tourists we decided to leave – total time spent at Universal Studios: three hours.

The real kicker for us to leave the park was not the constant solicitation by the employees or the fact that they make you walk through a mall to get there, it was more the feeling of being trapped that bothered us. That was my first glimpse into what hell is probably like. In contrast, the three days spent in Disneyland were great. They have all the same types of cheesy rides, long lines, employee solicitations and a mall (downtown) to walk through but the one thing Disneyland did have was space – no not Tomorrow Land, actual physical space. Space between buildings, space between restaurant tables, space between bathroom stalls, space between ride lines, space to park your butt when your legs got tired – space.

Disneyland has negative space built into their park where you could step out of the traffic for a second and breath if you needed to. Web design should be no different. The user needs a little bit of room to breathe, your design needs a little bit of room to breathe and we all know the importance of negative space in design – you don’t want your site to feel cluttered, cramped and disorganized (like Universal Studios). But with increasing display constraints and the amount of content most sites and apps have, is there any room for negative space in web design anymore? The answer is yes, but it’s time we get a little more creative in today’s small mobile display age.

Frame Your Subjects

Every piece of content on your page is important right? So you want to frame it like you would a beautiful art piece hanging on your wall in your living room. But framing your subjects doesn’t mean adding a border around every box of content, instead use some empty space to frame your subjects.

If you have been to modern art museum you’ll notice that most of the art pieces do not have frames around them like the art that hangs on the wall in Grandparents’ hallways. This is because the empty space around the piece of art will focus your eyes on the piece and not the distracting frame. However, in web design we don’t have the option of a forty foot wall to hang our content on, but even a few extra pixels of padding can make a huge difference, screens are smaller, so even a small amount of empty space around your subject can frame it quite nicely.

Use the Empty

Just because there are some empty spaces in your design doesn’t mean that you should fill them up with something. Leave the space empty. The point of negative space is to allow the filled content areas to naturally flow in the entire design area – your display. Pour yourself a bowl of cornflakes cereal and eat a few until you see the milk start to show through, then just watch how the cornflakes naturally rest on top of the milk. So cornflakes will naturally stick together while others will pull apart, but notice the shapes between the cornflakes and notice how it’s almost hard to focus on the space.

This is because this space between cornflakes forces your eyes to focus on the cornflakes, not the space. When laying out your content areas, let them flow naturally and when empty spaces occur, use them by not filling them up. Stand back and let your eyes float your elements to their natural positions.

Allow Your Words to Breathe

Text areas are the most neglected content areas on the web. Most designers and developers completely overlook body copy but these areas consume a huge portion of physical space on the web and most web users spend most of their time online reading. Adding more empty space around lines of text, paragraphs and even characters will go along way to making your text more readable. Add a bit more line-height to your paragraph tags, indent your paragraphs so that you can separate them from other content areas and leave plenty of space on top and bottom of each paragraph.

Also, allow the text on your buttons to breathe a little bit as well. I see too many buttons out there where the text is being scrunched and trapped inside the buttons. If you don’t want to make the buttons larger to create more room for the text just make your text smaller. You want people to read what’s on the button so they know what to do and making the text smaller will allow you text to stand out more than if its crammed inside the confines of the button.

Negative Space is Not Just for Tricky Logos

Negative space is most commonly associated with logos or compositions where the empty space creates a unique shape or represents something – like the arrow in the FedEx logo. But negative space in web design may not be that cool or sexy, but its still very important to the overall design. Just remember that you don’t want your design to feel cramped or cluttered, you want your users to enjoy the experience. If anything, just add a little bit more padding."