The power of "white space" is strong and is a vitally important part of all website design.
Firstly, what is "white Space"?
White Space is the space left between other elements of a page. It covers everything from line and letter spacing, to the space surrounding text and images, to margins and gutters.
When it comes to website design, one of my biggest rules is to utilise white space. It can be so easily overlooked when embarking on a DIY website, as it can be so tempting to pack the space as full and quickly as possible of all of your content. However, using white space, and giving your website design space to breath can make or break the actual message you're trying to convey.
In order to keep your customer's eye focused on the most important content, you must give it the space it requires to shine. You don't want people becoming distracted or overwhelmed - likely missing your call-to-actions and most key tasks entirely. Simply using a little white space allows you to control where your user's attention is going and get them to carry out the desired result.
What can you do?
Buttons - When adding a new button to your website, ensure you give enough space around the text within it. My ideal call-to-action has 16px size text and is 50px in height (the width depends on the text within it!) The bigger the better!
Breaks in the content - With so much infomration to take in, it can become overwhelming for a website user. We must give them a little visual "break" every now and again. This can be achieved by ensuring there are breaks in the content with just white gaps. This could be in the margins, between sections, at the bottom or top of the website and around images.
Plan - Plan the sections you want (or more importantly, your customers want) on your website. This can help as it pushes you to leave a "gap" in-between each section you've created. If you have a clear structure and plan - for example a homepage that has: An image - An intro - An About section - A services section - A testimonial section - A footer - then you can easily create space around each of these individual sections.
It doesn't have to be white - White space doesn't necessarily mean it has to be white! If you have a website that has a grey background colour, then this is also works as "white space". It is simply the concept of giving your core content some space around it. It could be a colour or a light pattern, just as long as you breaking everything up and drawing attention to the most important parts.
Try and try again - A website is constantly evolving, so don't worry if it's not right straight away. Make some changes, let them sink in, take another look, then try again. Ask people's opinions and continually improve!
In summary, what I am trying to say it don't be afraid of white space. It is good, it is your friend. There is no need, however tempting, to squash all of your content together. Give it some room and your customers will appreciate it.
If you found this useful please do share with other small businesses. You can use the graphics below if you'd like: