10 tips on designing a minimal website

Thanks to the rapid rise of mobile and tablet browsing, more and more websites are now being purposefully designed in a simple to navigate, 'stripped back' format that places content firmly centre stage. The new [Manchester City Council website][0] is an especially well-executed example of this.

There's a common misconception that going with a minimal concept like this is an 'easy answer' that's quicker to design and simpler to develop than a more standard site. But, while things might look uncomplicated on the surface, in reality, as much -- if not more -- work actually goes into a creating a clean and simple website, and plenty of tough decisions need to be made along the way.

With this in mind, I thought I'd put together some guidance on the best way to keep things minimal.

1. Is a minimal approach the right solution?

This style isn't right for everyone, so the first thing to decide is whether or not a minimal approach is actually suited to your client. The project brief should give you some indication of their expectation; if not, you could ask them to provide some visual references.

Most importantly, if you do come to the conclusion that a minimal design is the way to go, make sure the client's fully on board with the idea from the beginning.

2. Plan -- then plan some more

Don't just dive straight in-- it pays to put in plenty of research and planning to get an overarching picture of what the finished site should look like up front, and taking the time to map out the project early on will provide you with the right foundations.

Here at Code, our designers usually work alongside User Experience (UX) to come up with wireframes so that each page is planned out in advance; this saves us the time and effort of addressing a load of oversights and mistakes later in the design process.

3. Usability shouldn't be an afterthought

An easy-to-navigate website keeps visitors around longer, so there's never a good reason to choose design over usability. A good website perfectly combines both.

4. Don't forget the fundamentals of functionality

You should always start a new project with a fresh outlook in mind. However, there's certain design rules that you should always stick to:

  • Links should be easy to identify and click on

  • Always provide a way to go home

  • Never disable the back button

  • Add close buttons to pop-up windows

  • Clearly indicate what page the user is currently on

  • The navigation should be consistent and intuitive to use

  • The content should be readable with clearly defined headings.

5. Get the details right

A minimal design leaves you with nowhere to hide, so there's no room for mistakes; if you're just one pixel off, it'll be immediately be obvious to your users. Success depends on everything coming together effortlessly, so make sure you dedicate time to getting it right. Everything on the page should be balanced; items should stand out because you want them to, not because they don't mesh with other elements on the page.

It's vital you get distances/measurements right too; use a grid to keep everything exactly aligned.

6. Don't lose sight of the projects original intention

As the project progresses and things get more complicated, it's easy for you to find yourself moving away from the original minimal concept/ideas.

One way to try and prevent this is to create a vision board of strategy documents, wireframes/sketches, brand guidelines, designed pages, inspiration, etc. near to your work area.

You'll find that having physical copies of reference materials on hands really helps you to keep things on course.

When designing the site, try not to dilute the intended impact by cluttering it with unnecessary items; if you want to keep things clean and simple, you should only include things that are essential to your overall aim. Ask yourself the question: 'Do I really need this?' before adding it to the page. Which leads us on to my next point...

7. Stick to your guns on white space

Empty space isn't empty when it comes to minimal design; the elements on the page need room to breathe, and blank areas play a vital role in defining separate areas.

We often find that clients are nervous about having 'too much' white space on their website, so they'll ask us to start bringing in extra elements to fill it up. However, this quickly leads to the site becoming overpopulated and means the original benefits of a minimal design is lost.

8. Create a visual hierarchy

The user should subconsciously feel that they're always moving in the right direction through the site. You can help guide their journey by using different sizes and weights of page elements to create a clear hierarchical path.

9. Use colour carefully

Small splashes of colour on a black and white palette will immediately draw the user's eye. However, bold colours can also be distracting, make the site harder to read and ultimately take away from the intended message -- so proceed with caution.

10. Test it out

When you're going through the design process, it's vital that you don't forget about the most important person: the end user. That's why it's a good idea to perform user testing at key points throughout the design process to get feedback and ensure you're still on the right track.


10,000 jobs and counting