Blog

Website Design & Whitespace

white space and web design - why is it neededHere we will discuss the use of design and whitespace. Firstly, let’s discuss what whitespace is and how it is used so that you can better understand when it is necessary to use it. Whitespace, also commonly known as “negative space”, is the space between elements in a design and/or composition. “Micro whitespace”, as in microscoptic, is the space between smaller designs such as list items, the space between a caption and an image, and even between words and letters. Now let’s break it down of what all whitespace can do and how it is used in designs. Whitespace is a term programmers and designers use to create things like spaces, tabs and blank lines that are used to improve the readability of their code or images(s) and make your scripts and designs easier to read.

Rule of Thumb

A common rule of thumb with designers and programmers is: Whitespace = cheap; More whitespace = luxury. The reason that more whitespace equals luxury is because the more whitespace you use in a design, the better and more clear the design is to see and read. Plain or “generic” whitespace just makes a design work. By adding more whitespace and using it more specifically in a design, the more professional (or “luxurious”) the design appears to be. Whitespace is often used to create a balanced, harmonious layout until the feeling of the layout is perfected.

Example

A perfect example of the use of whitespace is when you see an article online and all the text is seemingly crunched together and the look of it is rather sloppy and, at times, hard to read. This is where the use of whitespace comes into play (also known as “passive whitespace”, but don’t worry about those terms, let’s just stick to the basics for now.) o, how would one actually do that? Well, let’s see: The first thing you would do is add margins, change the type family and weight, and then increase the line-height and you’re done! That, in a nut shell, is a great use of “passive whitespace”. Now, while whitespace is used in scripts such as CSS and XML, we’re going to be getting more into how and when to use it in designs in this article. If you were to surround a block of text with a lot of whitespace, you can actually draw in visitors to your websites layout or design image, especially in a more of a crowded layout such as a blog and even in local newspapers, where every part of an ad is packed with as much informational text as it can possibly hold.

It’s hard to stay on topic of just design, when whitespace is used in various forms and it is important to discuss not only the use of whitespace in designs, but also the different ways that whitespace can be used in other ways to show the importance and wide range of use. So, in closing, whitespace is your friend! It can not only help your design become more attractive and more readable, but it can affect the feeling and the overall look of your design and/or layout. When doing designs, make sure to put whitespace to good use and not only will you love the finished product, but so will everyone else!