DON’T MISS OUT

Get updates on new articles, webinars and other opportunities:

6 Rules Every Minimalist Web Designer Should Live By

by Angela Noble

Mies van der Rohe is famous for the applying his motto “less is more” to design in architecture. Since his time, designers of all types have adopted and applied the same mentality to their work. Let’s look at how can we apply this “less is more” principle to web design.

It’s important to remember that adding more elements to your design doesn’t equate to adding more value. Elements omitted from your design are just as important as what is kept. Just as in any discipline, design shouldn’t be superfluous.

Statistics show you have about 5 seconds to grab a viewer’s attention.

If you’re site is so cluttered that the viewer can’t figure out what your offer is in 5 seconds, you’ve lost a potential client.

Creating a clean, simple, minimalist design will quickly show your visitor what your offer is and get your message across efficiently.

1. Focus on the content.

Effectively communicating your content should be the main focus of your design. A beautiful design that has no enticing copy writing, no call to action and no relevant content isn’t going to get many results.

Design should be used to help communicate the content effectively – the difference between a bulleted list and an interactive, pictorial display of information. Both options can be simple and clean, but the latter would be more focused on the content than the former – simple, but not oversimplified or under-designed.

http://timeline.verite.co/

Timeline JS is a great example of a minimalist timeline plugin that focuses on content.

2. Ensure usability.

When dealing with a website, function is nearly always more important than form. Much to “form over function” theorists’ chagrin, if your website isn’t usable, it’s pointless.

Your design should be intuitive for the user to navigate. Be creative with styles and design treatments, but be conscious of how the user will interact with the site.

On the web, links are an incredibly important functional element.  The viewer should be able to easily tell what elements are links and should always be able to navigate back to previous pages.

http://www.pentagram.com/work/#/all/all/newest/

Pentagram’s website has a lot of content, but they manage to pull off very simple and intuitive navigation.

Minimalist design is often stereotyped as tiny, illegible text in a black and white design template. This doesn’t have to be the case. Be sure the viewer can read all the text on your site on all platforms including mobile and tablet.

3. Refine, refine, refine.

You should work through multiple iterations of your design refining and taking away any unnecessary elements that don’t add to the design. Anything that is not adding value is subtracting value.

While designing, ask yourself whether or not you really need each element you’ve included or are thinking about adding.

https://www.google.com/chrome/index.html

Google chrome’s download page is very apple-esque in its simplicity. They’ve refined the design down to only the elements absolutely necessary and have come away with a successful, minimalist  page.

Even after your site launches, you can view user analytics data (such as Crazy Egg) to see which design elements are infrequently clicked and evaluate removing them or moving them to a new location.

4. Be sure everything is intentional.

Every element in your design needs to be cohesive and intentional. The same colors, typefaces, and other design elements should be applied to the entire site. When an element stands out, it should do so intentionally and still fit in with the overall look and feel.

http://www.xprimegroupe.com/

 X-Prime Groupe sticks with just a few splash colors to call attention to select design elements in their portfolio.

Use colors intentionally to denote importance and add hierarchy. Minimalist design doesn’t have to be black and white, but color palettes should be simplified. Using too many colors on a single page can be confusing.

5. Leave room for whitespace.

Just because there is room to add something, doesn’t mean you should! Ever hear a client say, “Let’s get rid of that empty space” or “There’s too much white space”? That’s why they’ve hired you to be the designer! Stick to your guns and communicate that every design element needs room to breath.

http://www.kohler.com/corporate/business/kitchen-and-bath.html

Kohler pairs a large image of a product with simple text and navigation rather than overwhelming the viewer with multiple product offers and heavy copy.

Adding too many design elements on a single page or in a single design will be ineffective. White space helps define content areas and ensures elements don’t become jumbled together. It also helps viewers navigate though the design.

6. Use a grid.

Designing around a grid is also important to aid the viewer in navigating through your site. Designing around an underlying grid – whether it ends up being very apparent or not in the live design – will ensure all design elements align properly and will also aid in establishing hierarchy.

http://www.stof-e-ring.com/

An underlying grid system is still at work even when the grid is broken with a sharp diagonal to add interest and draw the eye around the content.

For more tips and techniques about using a grid – and how to break it (without breaking your design) – see my blog post here.

As with most things, one size doesn’t fit all. If you or you’re client have a brand identity that’s anything but minimalistic, a minimalist website wouldn’t be fitting. Always evaluate your brand identity, target audience and product or service offering before deciding which design style will work best for you.

Know of any websites where less is more? Or perhaps more is not more? Please comment!

4 Comments

DON’T MISS OUT

Get updates on new articles, webinars and other opportunities:

Angela Noble

Angela Noble is a designer and partner at Kovalent who specializes in email marketing, branding, and website creation. Email her at angela@kovalent.co or follow her on Twitter @AngelaNoble_.

4 COMMENTS

Comment Policy

Please join the conversation! We like long and thoughtful communication.
Abrupt comments and gibberish will not be approved. Please, only use your real name, not your business name or keywords. We rarely allow links in your comment.
Finally, please use your favorite personal social media profile for the website field.

SPEAK YOUR MIND

Your email address will not be published.

  1. Brandon says:
    July 27, 2016 at 4:35 pm

    Grid style is always my favorite to use, Thanks for the great article.

  2. Kunle Campbell says:
    July 17, 2012 at 11:32 am

    What comes first?
    Content OR Design?

    • Russ Henneberry says:
      July 17, 2012 at 3:07 pm

      @Kunie — Great question. Personally, I feel like Product and Market come first. Content and design flows from there.

  3. Bryant Jaquez says:
    May 28, 2012 at 11:54 am

    I think white space is the most important element on a web page. If you don’t give people space, they will feel trapped, and uncomfortable (kind of like in real life.) I love sites like Bread and Pepper
    and BrewSEO

Show Me My Heatmap

Really easy to understand the user behavior with the new @CrazyEgg reports! @qubitTV #UX #prodmgmt

Francisco Mingote

@fmingote