Principles Of Minimalist Web Design, With Examples
Minimalism is achieved by reducing a design to only the most essential elements. Expressions of minimalism span multiple disciplines, as well as other art forms such as music and literature. For website designers, though, minimalism can be intimidating and difficult to master.
But anyone can master minimalism. Essentially, minimalism is about breaking things down to the barest elements necessary for a design to function. It’s about taking things away until nothing else can be removed without interfering with the purpose of the design. Below are a number of principles of minimalist design, as well as an exploration of current trends and additional examples.
You might also enjoy our previous article “Showcase of Clean and Minimalist Designs.”
Less Is More
“Less is more” is probably the most well-known catch phrase of the minimalist movement. It was popularized by architect Ludwig Mies van der Rohe in describing the minimalist aesthetic.
In Web design, less is more is achieved by using only elements that are necessary to a given design. Using less to achieve an effect that’s more than the sum of the design’s parts is the goal.
Examples
North Kingdom
Simple, straightforward typography and a bare use of color make for a design that’s aesthetically pleasing but minimal.
Sleepover
A simple design that puts content above all other elements. The simple double-border above and below certain areas helps to delineate the content without cluttering the design.
Lindvall A&D
The simple line-drawing of a chair, barely visible if you’re not looking for it, exemplifies the “less is more” ideology.
Your Neighbors
Another simple design, this one with many more graphics.
Sharpenr
Simple navigation and graphics add to the overall minimalist feel here. The graphics are bold enough that they have visual impact without adding clutter.
Omit Needless Things
In their book The Elements of Style, Strunk and White coined the phrase “Omit needless words.” It has been adapted to minimalist philosophy as, “Omit needless things.” In other words, don’t include unnecessary elements in your designs.
Think of what’s necessary to the content and function of your website. Then focus on only those things, and omit anything that doesn’t directly contribute to either the content or function. Remember, though, that certain design and graphical elements will directly affect the readability or usability of your website.
Examples
up&onward
A simple gray background, white borders around the images and simple typography are the minimum elements necessary for this page. If any were removed, the website would not have the impact that it does.
Lachlan Bailey
A single image and vertical navigation are as simple as it gets.
Sarah Hultin
Another example of a single image and vertical navigation.
Aleksei Dubrovsky
This website goes a step further and omits any images, opting instead for just a header and simple navigation.
Subtract Until It Breaks
When crafting an extremely minimalist design, try subtracting elements until the design stops working the way it should. When the website is on the verge of breaking, you know you’ve achieved the most minimalist design possible.
Remember that “breaks” is relative in design. Technical functionality is only one way to gauge whether something is broken. Usability considerations are equally important. Make sure your website is still user-friendly and delivers the experience you want visitors to have.
Examples
Anothercompany
A minimalist design with a single-column body and three-column footer. If any element was removed, the website would be less user-friendly.
Works in Silence
The elements of this information architecture, including the borders between sections and posts and the white space between columns, are vital to keeping everything visually pleasing, organized and readable.
Brett Arthur Photo
Another great example of using a minimum of elements.
Danny Guy Photography
The black background sets this apart from many other ultra-minimalist designs. Notice the full-screen option in the lower-right of the image.
Brian Danaher
Another website that opts for a single column and bold typography.
Every Detail Counts
In a minimalist design, every detail has significance. What you choose to leave in is vital. A border around an image, the color palette, the white space, every part becomes important to the overall look and feel of the website when the elements are few.
Think of the feeling you want your website to give visitors, and then decide on the details that would impart that feeling. While many designers view minimalism as one size fits all, there is still room for different emotions based on individual design elements. A minimalist website can easily be funky and modern, fresh and clean, reserved and sophisticated, elegant and refined, or anything in between, based solely on its details.
Examples
Executive Edits
Details like the oversized typography in the header and the thin borders between elements make the Executive Edits website stand out.
Christine Szczupak Photography
The stylized arrows and subtle drop-shadow are important details that increase the visual appeal of this website.
Kha Hoang
The effect of the details here—circles, gray box, red typography—definitely add up to a lot more than the sum of the individual parts.
The Rules of a Gentleman
Everything from the thick black border at the top to the mix of typography make this website elegant and sophisticated.
Ryan Willms
The spacing and arrangement of content here, along with the elegant typography and simple lines, make for a fresh design.
Visual Craftsman
This has more detail than many minimalist websites, particularly with the border and other subtle graphics.
Electricgecko
The subtle colored box behind the content sets this design apart.
Color Minimally
Color takes on added significance in a minimalist design. Choosing the right palette or accent colors is vital. Many designers opt for a simple black, white and/or gray palette, but minimalism has room for any color in the rainbow.
Like details, color becomes critical with fewer elements. Pay attention to the meanings of the colors you choose and how they interact with one another.
Examples
Kyle Sollenberger Design
Subtle pastel colors set apart certain content here.
Pixelbot Webdesign
Bright colors stand out against this otherwise black-and-white design.
MattBango.com
The shades of blue are subtle but highlight special areas of this otherwise black, white and gray design.
Second and Park
Muted colors work well in a minimalist design, particularly when combined with gray.
Glinga
A simple website with a gray background and colored accents.
Deartoy
Another simple design with colored accents.
Superawesome
Magenta is a popular accent color for minimalist sites.
Thinking for a Living
A website with a lot more color than many other minimalist websites, but the palette is well thought out.
Nation
Another colorful website with a great palette.
White Space Is Vital
White (or negative) space is the backbone of any minimalist design. What you leave out of a design is just as important as what you put in. White space is critical to emphasizing certain elements over others.
White space “makes” a design minimalist to a large extent. Without it, you’d end up with a grid design or grunge or some other style that’s not truly minimalist.
Examples
Rikcat Industries
Ample space between elements keeps this website from feeling cluttered.
Straightline
Another example of a ton of white space around elements.
52 Weeks of UX
Filling every column on the page is not necessary, as evidenced here on the 52 Weeks of UX website.
Metro Gallery
The Metro Gallery pays a lot of attention to white space, right down the spacing of letters in its category headers.
Blank Studio
Ample white space is used here.
Trends
There are plenty of trends in minimalist design. Some have been around for so long that “trend” is probably not even the right word to use. In any case, the following elements are being put to good use in a variety of minimalist designs.
Gray
Gray is fundamental to minimalist design. Shades of it are used for backgrounds, text, images and pretty much all other elements, often combined with black and white or other colors.
Brian Hoff
Gray can be used as an accent, not just for typography or backgrounds.
Michael Cronin
Of course, gray also makes for a great background color, and it takes on a cool tone when combined with icy blue.
Ross Gunter
Another very simple design with a gray background.
Sort Design
Medium gray allows for good contrast with typography, while also making a stronger impact in the background than light gray.
Jack Osborne
Gray lends itself particularly well to gradients.
5-Squared
Combining multiple shades of gray lends visual interest without cluttering.
Big Typography
Big typography is often used in place of images to add more graphic interest to a website.
Blake Allen Design
Oversized typography is used throughout this website.
Kyle Steed
Big typography is a popular choice for minimalist headers. It makes an impact while also conveying vital information.
EndGrain
Another example of oversized type in the header.
Dunnodt
Combining different-sized fonts is a great way to add visual interest without clutter.
Words Are Pictures
Large typography is also popular as an accent, rather than a focal point.
Ryan Evans
Another website that combines multiple font sizes. It’s a great fit when the page has little content.
Tiny Villain
Varying the size and color of type makes for an arresting design.
Division Paris
Another great example of big typography in the header.
Background Patterns and Images
Subtle background patterns and bold images can add a huge visual interest to a minimalist design.
Jeroenhoman.com
A subtle grunge pattern gives this design an edgy feel.
Neiman Group
Keeping the background image in grayscale adds visual interest without adding clutter.
IdeaPaint
A large background image is still minimalist when the rest of the website’s content is very simple.
Bunton
The subtle texture and pattern in this background is aesthetically pleasing without being overwhelming.
Francesco Fonte
Another subtle grunge pattern.
Caitlin Worthington Photography
This taupe grunge pattern is unexpected.
Simple Grids
Grids aren’t necessarily minimalist by nature, but simple ones can bring order to a bare design.
Fitzroy & Finn
Simple grids make sense for organizing equally sized images.
Brand New
A simple grid like this organizes without adding complexity.
Design Woop
A more traditional grid design that has plenty of white space to keep things looking minimal.
Fortyone
Another great example of using simple grids to organize images, this time including text.
Things
This simple-looking grid belies the careful thought that went into it.
Corporate Risk Watch
This grid is set apart by the roll-over effects in the navigation (visit the website to check them out) and the subtle grid lines.
Positively Melancholy
A simple grid like this works well for organizing different-sized images, too.
Circles
Circles can be found on many minimalist websites. I’m not sure whether designers who like circles are more inclined to have a minimalist aesthetic or whether they choose circles because they fit minimalist designs particularly well. In any case, circles are often found in headers and are also used as accents in navigation.
iLTD
A simple circular logo in the header.
Simon J Hunter
Another circle in the header, this time with a monogram.
Frank Chimero
Another circular monogram for a logo.
Indextwo
And another.
Leica
Leica’s logo is a bright red circle, used across its products and marketing materials, including its website.
io
And another.
Bless
Circular badges like this are also popular.
Alex Cornell
A circular logo with a more abstract design.
Royale
Circles aren’t just used for logos, though. Here’s a great example of a circle used for content.
Bonus: Transparency
This isn’t really a trend per se, because it’s not often seen in minimalist designs. But it can make a huge visual impact and should really be used more by minimalist designers.
Slideshow Press
The subtle transparency in the logo gives this design an added dimension without creating clutter.
More Examples
Here are some more examples to inspire you.
Further Resources
- Minimalist Web Design: When Less Is More
A comprehensive introduction to minimalist design from Webdesigner Depot. - A Guide to Creating a Minimalist Website
A look at minimalist websites, from both a design and content perspective. - Understanding Minimalism in Web Design
A good introduction to the concept of minimalism as applied to website design. - “Minimalism” Is Just Designer-Speak for Laziness
A great breakdown of the differences between minimalist and simplistic designs. - The Anatomy of a Minimalistic Web Design
Breaks down what goes into the design of a minimalist website.
(al)
Valter
May 13th, 2010 2:30 amSweet stuff, made me think about some aspects on my own website.
luke
May 13th, 2010 2:45 amfantastic compilation, thanks from joover!
Federica Sibella
May 13th, 2010 2:47 amWow! Big collection, very inspiring. We also have a minimalist website, but we’re thinking of a little redesign this summer. It will remain minimalist of course!
Thanks for sharing.
Creative Mashup
May 13th, 2010 2:57 amNice showcase. A lots of new, never seen, examples…Anothercompany is my favourite.
When I was designing my studios website: creativemashup.pl I was inspired by sites similar to Bless and SkilledConcept.
:)
abhishek
May 13th, 2010 2:59 amSimplicity is a feature.
And this is the top priority.
Rilwis
May 13th, 2010 3:02 amI see the minimalist websites often have great typography. Would it be considered as a principle of minimalist design?
Thanks for the article.
tejas
May 15th, 2010 7:29 pmRilwis,
When you have only five or six major design elements on a page, you have to make sure everything follows the principles and look nice.
Jaina
May 13th, 2010 3:20 amSimplicity is what really appeals to me and these are lovely examples.
April
May 13th, 2010 3:24 amBeautiful websites.
I think Antoine de Saint-Exupery said it best: “You know you’ve achieved perfection in design, not when you have nothing more to add, but when you have nothing more to take away.”
Peter Repta
May 13th, 2010 3:27 amLove this article. It’s my passion to create simple, fresh and minimalistic designs. In the past, I wasn’t fan of minimalism, but I recently realized it’s great way to attract visitor and there’s always a plenty of space to loose imagination and create something very unique.
willian
May 13th, 2010 3:32 amWhy don´t you explain the PROCESS of getting minimal?
I guess most of those websites didn´t reach this level of perfection by seeing showcases.
I give up Smashing Magazine.
Smashing Editorial
May 13th, 2010 3:59 amActually, the article describes the process and covers some principles that will help you achieve a minimal design. Please read the article more carefully.
willian
May 13th, 2010 4:31 amTopics and a few lines.
Nothing that deep.
Bertrand
May 13th, 2010 5:21 amYou have to admit it’s at least better than those “30 minimalists websites” list, no?
Thanks for the article.
willian
May 13th, 2010 8:27 amtrue, true
mondo
May 13th, 2010 9:38 amI don’t know. I do see the intro paragraph to each section, but its kind of self defeating to the concepts explained in not keeping it minimal in the *volume* of examples – and rather putting more into the decomposition of each – that the little paragraph (or two) get swallowed up in the same feel of *”those “30 minimalists websites” list”*. I felt like it was the same endless scrolling (though I’m a gluten for punishment and indeed did all the scrolling) from the list-type posts, only broken by a short blurb. Now mind you, I’m too damn lazy to write that 2 paragraphs myself… so thanks for that and all the linking. I’d love to see more analysis or even discussion.
Now for analysis/discussion, it may be my natural aversion as a photographer to the color Cyan, but I feel like the Lindall A&D is really just an eye-strain. I think Nation site did a bit better and using the minimal color for emphasis by the use of more contrast[ing elements]. I think the Tiny example tries to use the Cyan as an emphasis element through its minimal color usage, but its again hard to read because of all the white around it, becoming an eye-strain. I think this brings up a good point that when using minimalism as an enabler of emphasis/importance, then we have to be much more picky on the choices/elements we are contrasting. … That ends my “i hate cyan rant”
MightyM
May 13th, 2010 9:14 amIf you don’t have it, you won’t get it!
It’s called creativity.
Ted
May 13th, 2010 4:23 amBob Venturi said, time ago “Less is a bore”.
rburch
May 13th, 2010 4:51 amGreat post, I just updated my portfolio website to make it more minimalistic. The goal was to take away as many distractions from my artwork as possible. http://www.robertburchillustration.com
CoryMathews
May 13th, 2010 5:07 amMinimal FTW!
John Smith
March 9th, 2011 12:04 pmI really appreciate all your work, thank you so much providing such a valuable pages.
Glenn Sorrentino
May 13th, 2010 5:09 amGreat collection. It’s more difficult to design minimally than one may think and all of these are great examples of how to do it right.
blurkness
May 13th, 2010 5:11 amamazing :D
love it ^^
Simone
May 13th, 2010 5:19 am“It was popularized by architect Ludwig Mies van der Rohe in describing the minimalist aesthetic.”
It’s totally wrong, totally nonsense. Please stop quoting Mies about minimalist design. Mies was an architect and is work is not minimalist -see the glyphs on the roof of his museum in Berlin-, he didn’t care less about minimalim. So please stop quoting Mies when you know nothing about architecture and art.
and sorry about my english, I’m not a native english speaker.
S.
Bertrand
May 13th, 2010 5:23 amI know Wikipedia isn’t always accurate but if the guy said the quote, well, it’s his :
http://en.wikipedia.org/wiki/Ludwig_Mies_van_der_Rohe
Also, it doesn’t mean all of his work represent that single thing he said.
SlowX
May 13th, 2010 5:34 amI’m tired of “clean and neat” and “minimalism.”
Bring back “dirty and busy” and big, hearty MAXIMALISM!
:D
div
May 13th, 2010 5:38 amMindblowing concepts. Thanks for the post.
Tim
May 13th, 2010 5:50 amI think you missed Aisle One, Keyboard driven Blog (Shortcuts for different Grids and a Dashboard), with a nice, simple Design + Logo:
http://www.aisleone.net/
Jonathan B
May 13th, 2010 6:12 am“Glamour is back, but with a minimalist touch.” – Gianni Versace
sam
May 13th, 2010 6:12 amDoes anyone know how I might make a horizontal scrolling page like Thinking for a Living (http://www.thinkingforaliving.org/topics/curated)? I like how each post made creates a new column, and older posts get archived.
I’m assuming this is done using something like jQuery Scrollable, but it’s something I know little about. If anyone can point me in the right direction I’d really appreciate it.
Sorry for going a little off-topic.
METRAPACH
May 13th, 2010 6:26 amThank you! Love this post.. It’s like a tutorial… 100% inspiration!
Vincent
May 13th, 2010 6:54 amThat up&onward and Dracula Studio websites are very basic Cargo themes (cargocollective.com). Almost no customization involved or very little. The credits should go to Cargo team for the design work, not these sites. Thank you.
Kyle Steed
May 13th, 2010 6:55 amThanks for including my site in this post.
Angelee
May 13th, 2010 8:49 pmI like your site too, its so neat and cool.. Congratulations!
Matt
May 13th, 2010 7:14 amHere’s an excellent minimalist black&white blog: http://mediatinta.info/
Edial Dekker
May 13th, 2010 7:22 amThanks for the mention in this blog post, we highly appreciate it!
Watafak
May 13th, 2010 7:55 ami have a circle in my site haha
Federico Capoano
May 13th, 2010 8:12 amDoes a web-site have to have a monochromatic color scheme to be considered as minimalist?
If you look at those web-sites, the majority use just black, white and gray scales.
Imagine minimalist would become a successful trend in web-design.. omg it would be so boring to see just black and white web-sites!
Thank god for the colours!!
Peej
May 13th, 2010 9:32 amIsn’t this whole minimalism thing in design just because everyone uses WordPress?
KGA
June 22nd, 2010 3:44 pmNo, not at all. You can do whatever you want with WordPress – it doesn’t cause any confines in design.
Christopher Anderton
May 13th, 2010 9:58 amGreat inspiration! I’m working right now on a couple of projects that gonna be minimalistic.
http://bayimg.com/image/eamhcaack.jpg
Adam B
May 13th, 2010 10:01 amAnother great portfolio that was featured on QBN a few weeks ago is http://www.viixii.com. It’s very clean and the work stands out.
Karl Z
May 20th, 2010 12:42 amYawn… really? Less is more for sure…. but the majority of these websites are boring as h3ll. Commercial websites are about making money – i.e. – Branding.
Design by CSS completely – will always be boring – I don’t get the fascination… and whats the point since – there are no Browser Standards, anyways….
Yawn
Alyda
May 13th, 2010 10:45 amGreat article, but I was hoping to find Quality Peoples (http://www.qualitypeoples.com) included in here. But i think this list is very thorough and quite inspiring, thanks!
Jaken
May 13th, 2010 11:02 amGreat ideas, I really like cronin and flow market, here is another that didnt make the list: http://www.sureElements.com
Konrad
May 13th, 2010 11:49 amThis is a real nice collection.
I tried so make a simple portfolio webpage for me. And black&white contrast is a real powerful but not easy to handle design element.
Stuart Hobday
May 13th, 2010 12:28 pmHello
Thank you for featuring the Executive Edits, Ryan Willms, Works In Silence (now http://www.stuarthobday.com), Positively Melancholy sites that I designed. It isn’t so much about minimal for the sites I design, it is about an effective use of whitespace and using the grid layout in a way that publications around the world use it.
I just launched the new site for Inventory Magazine at http://www.inventorymagazine.com and one’s that maybe should be on the list (not designed by me) are http://www.swisscheeseandbullets.com and also http://www.atelier6.co.uk
Thanks
Stuart
Thelma
May 13th, 2010 1:53 pmGreat inspiration!
Johnny Picture
May 13th, 2010 4:06 pmNice Collection. Love the diverse typography.
Luis Craik
May 13th, 2010 5:30 pmLove this site. You know, I was just trying to find some inspirationg some hours ago, but when SM published this article… bingo! Everything made sense. Bravo.
Thank you SM!!
Angelee
May 13th, 2010 8:50 pmWow, designers of these sites should be very proud!
Jason
May 13th, 2010 9:11 pmSometimes though being a minimalist isn’t needed. In my opinion the most important thing is getting the content that has to show up first than design with a purpose in mind.
Brett
May 14th, 2010 2:08 am…..meh
Alrik
May 14th, 2010 3:37 amThanks Cameron, nice read and list of examples! Cool to see http://www.brettarthurphoto.com/ included in the examples, Brett created and manages this site with a Viewbook Pro Account. I guess great images and words just demand space and centre attention, which leads to a minimalistic design. To give it the right character and make it balanced is really in the subtleties and details then, which is the art I guess. We design our formats and tools with this in mind. Some more examples of quite minimal portfolio sites are on http://www.viewbook.com/examples/
Andrew
May 14th, 2010 3:41 amWe had a minimalist site. HAD one! Some people just don’t get it’s beauty. I don’t think ‘these’ people appreciate the skill involved in producing this kind of work. This is proper design. It’s also a shame that most of these sites are portfolio/design companies and not in the commercial world. Need to educate the clients more! Grrrr, small rant over. Nice post.
Reiz
May 14th, 2010 4:06 amMost of the websites in this compilation aren’t minimalist at all.
Alrik
May 14th, 2010 4:15 am@ Andrew, many people I worked for do appreciate the sophisticated and some began to see the light after some explaining;) Keep it up!
p. thompson
May 14th, 2010 4:37 amThanks :)
dmmaxwell
May 14th, 2010 5:59 amFD: I’m not a designer, but more of a design appreciator. With that in mind –
These sites all look very nice and I appreciate the simplicity. It’s something I strive for in my profession as well. However, I think more than a couple of these sites could benefit from better contrast. In particular, I find the Lindvall site darn near impossible to read, even at full size. Grey text on a teal background? Ouch.
Nice compilation, though.
Jesse Myer
May 14th, 2010 6:10 amUsed this post and associated sites as inspiration for my own revision ver. 3.0 to my own site: jessemyer.com/
Thanks Smashing for more great work and inspiration!
Maine
May 14th, 2010 10:37 amMinimal at it’s best: http://www.rockmetommyboy.com.ar
Di
May 14th, 2010 12:36 pmI have a minimalist site. I’ve gotten a great response from it – people really do like a clutter-free environment. http://www.adunate.com
O'Ryan
May 14th, 2010 1:24 pm@smashing
the site “Blake Allen Design” may or may not have been hacked. I get a virus warning every time i try to view that site.
i would probably advise removing that link and if some one knows the owner let them know. bummer cuz from the thumb it looks like a snazzy site.
jakob
May 14th, 2010 2:03 pmAvoid background colours
Avoid images
Avoid borders and hard dividers (hr)
Avoid too many fonts and typefaces
Avoid a large color palette
Avoid information overload (each page/screen serves a singular purpose)
Avoid more than three levels of nesting (navigation/breadcrumbs, lists, h1/h2/h3)
Use plenty of white space (margins, padding)
source: http://aleembawany.com/2008/12/04/minimalist-design-guidelines/
oppd
May 14th, 2010 6:58 pmJust wanted to show off our site’s design which is very simple as well… suggestions very welcome (just use our feedback link).
http://www.onepageperday.com
Visual Craftsman
May 14th, 2010 9:04 pmMuch props to SM for the reference/example. Bravo on this post!
Yasmin Chopin
May 14th, 2010 10:49 pmThis makes for great reading if you are thinking about a new website or are about to redesign one. Thank you, Cameron, for putting it all together and helping us think new thoughts!
Yasmin Chopin Interior Design
Jason
May 14th, 2010 11:12 pmOne important note about what makes a good design truly minimal is the fact that it is indeed irreducibly complex (ahh the irony). Meaning, you can not take away any element within the composition w/o breaking the integrity and relationships of the design.
Eko Setiawan-dynamicwp.net
May 14th, 2010 11:35 pmWe love simplicity too…
Great article, adding my knowledge of how to design a web with minimalist style.
Thanks for share
Gui
May 15th, 2010 3:34 amI love this ! http://ww.agence-logo.fr
Roger
May 15th, 2010 5:48 amThanx for featuring our website.
- – - – - – - – - – - – - -
http://www.fortyone.ch
jaques
May 15th, 2010 7:55 amAn other minimalist webdesign site here : http://www.nesk.fr
Jay Dalisay
May 15th, 2010 10:57 amCheck this out:
http://www.dsignart.org
Zed
May 15th, 2010 11:08 amYou really should stop googling for minimal web sites and then write about it like the 10,000 before you already did.
Time to evolve because this type of posts are circular ones. And remember, not always the stuff you find in the net its correct….
Ole Marius
May 15th, 2010 11:55 amNice article!
Bree
May 16th, 2010 6:47 amI love minimalistic websites, I really do. I even went that route with my own website. I just wish I didn’t have to see the same exact websites being mentioned over and over all the time. Obviously the whole “Great minimalist websites” has been done many times, but it seems that everyone always lists the same websites/designers in them. There has to be some new people out there that deserve a little spotlight, right? I’m not saying those that get mentioned aren’t great, but where’s the love for the not so recognized little guy/girl?
Great post, of course =)
Gerhard
May 16th, 2010 7:24 amAnother cool example is somebigideas.com
I just love a minimal clean layout, it puts the focus back on the content (where it’s supposed to be)
qra
May 16th, 2010 8:13 amBeautiful post!
In your opinion is this site http://www.studiovisuale.it minimalist?
Max Black
May 16th, 2010 8:47 pmMicrosoft is the antithesis of “minimalist” in everything it does: for years, its badly designed Web site(s) have personified the idea of “overmarketed corporate slop.” Having said that, Microsoft’s redesign actually takes some of the ideas of minimalist design and implements them into a nice design:
http://www.microsoft.com/en/us/default.aspx
Please note, I am NOT saying that Microsoft has given us a “minimalist” site, I’m saying it has adopted some of the principles to craft its new design. It’s much less “corporate overlord” in its look and feel, and as a result, far more user-friendly (to my eye). Other large, overly busy sites (anyone been to http://espn.go.com/ or CNN’s site lately?) could take a page from Microsoft’s book and employ some of the principles of subtle color schemes, large(r) areas of whitespace, and the overall idea of “less is more” to revamp their sites.
But some things don’t change; IE still sucks. :)
Tyler Herman
May 16th, 2010 9:22 pmHard to call simplicity a trend but definitely getting tired of the bland white websites, its been over 3 years of this… I guess you can appreciate people taking care in their font selections and what content they do use but damn its getting boring, or has been boring and terribly stale for a while now.
I guess I spend to much time looking at websites but I’m dieing to see something frest and new, its been such a long time since anything has had WOW factor, and none of these “minimalist” sites are ever going to do it.
Guest
May 17th, 2010 12:44 amMany of those sites using small serif font, which is bad for readability.
Box
May 17th, 2010 12:50 amGreat list, thought we might have made the list but maybe next time.
Matthias Wobrock
May 17th, 2010 1:46 amI’m a big supporter of minimalistic web design. I just like the look, feel and resulting accessibility and usability of these sites. I am also an online marketer, and stripping down landing pages to their core content greatly helps to get people to do what you want them to on a certain page.
A thing you’ve mentioned and that I’m not that sure about is the use of circles. Circles by nature always draw a lot of attention from the eye. If there are too many circles in your design the page will look extremely busy. That’s why I think they are great, but should be used with care and to draw attention to key elements of a page rather than sit in headers or footers.
Kim Rejström
May 17th, 2010 2:24 amReally compelling list and great examples. I love how it wasn’t just a list post, but you included real information and grounds for picking the examples you did.
mamdouh reda
May 17th, 2010 12:39 pmcan tell your opinion about my portifolio vanyrow.co.cc
lentinca
May 18th, 2010 4:42 amThanks for the interesting post!
What do you think about these two example?
http://ariannacampa.com
http://www.fabiobarile.com
Greetings from Italy! :))
Audrey
May 18th, 2010 12:08 pmCan’t believe no one mentioned Beatrice Warde’s “The Crystal Goblet” here.
http://www.typographia.org/1999/graphion/crystal-goblet.html
“Type well used is invisible as type…”
Just replace the word “type” with the word “design”.
George Lucas
May 18th, 2010 12:40 pmI think this post is right, simple can be effective and you don’t always need to have a fantastic fancy design, this reminds me i wrote something up a few days ago here it is: webnutter.com/?p=70
Jordan
May 18th, 2010 2:03 pmLovely list!
http://www.santacruzpizzas.com is another favorite.
Jules
May 19th, 2010 5:31 amGreat article. “It’s simplicity that makes things beautiful ”
Good book : Information Dashboard Design: The Effective Visual Communication of Data > Steven Few talks about “no-data pixel” : every elements that not help to use the interface.
freshness
May 20th, 2010 3:54 amReally great article with very impressive websites.
It’s funny, because we’ve just launched our brand new website. Yeah, it’s a minimal, too.
Hopefully we can be here on the next post about this :)
Please visit if you have time: http://www.freshness.hu
Sean
May 20th, 2010 5:18 amAlthough not completely up to date and will soon be changed to a new design, my portfolio site fits the minimalist design to the T.
http://www.seansdesign.net
enjoy.
Edy
May 21st, 2010 11:31 amVery nice examples and explanations, thanks for the well put together article.
We did also release a minimalist theme for WP
http://www.vivathemes.com/wordpress-themes/minimaliste/
and looks like the popularity of minimalist designs is increasing every day. ‘Simple is beautiful’
John
May 23rd, 2010 2:54 pmAnother great example of minimalist design http://deusdictum.com/
pete
May 27th, 2010 7:49 ami want to add http://www.mkirste.de a minimalistic photography site
Jeremiah selengia
June 1st, 2010 5:32 amGreat inspirational stuff here. It got me well excited, think i will stay in and work on some stuff.
Tom
July 14th, 2010 10:46 amGreat post!
Check out my collection of minimalist web designs: http://newevolutiondesigns.com/30-outstanding-minimalist-web-designs
Adam
July 31st, 2010 11:43 pmI tried to also keep it clean and simple by using as little imagery as possible and just letting the content be the design. Check out reversedout.com and let me know what you guys think and if there is an opportunity for me to improve or even simplify more. Thank you.
Gunisigi Balaban
August 3rd, 2010 1:51 pmwow great collection!!! Thanks.. I think, vertical nav and single image pattern is overdone and look little bit boring for me.
S Quinton Green
August 21st, 2010 5:23 am“When crafting an extremely minimalist design, try subtracting elements until the design stops working the way it should. When the website is on the verge of breaking, you know you’ve achieved the most minimalist design possible.”
What? You have got to be kidding me.
Nataly
September 5th, 2010 2:15 amThank you. Used the Elegance template with minimalistic design
Yuriy Zaremba
September 24th, 2010 9:33 amMinimalism can be powerful, yet It’s very easy on the eyes. I went for a more minimalist approach on my design portfolio myself- let me know what you think yuriyz.com.
Pavan Kanwar
November 1st, 2010 9:08 pmInspirational. Too many comments! Fell obligated to come back and read them all but just having skimmed through I have found this immediately impact on my work. Favourite saying: “Subtract until it breaks”. Smashing once again. Pun completely intended. ;-)
Danielle
December 1st, 2010 8:59 amHow about this treat from an illustrator who seems to love typography
http://www.alancaseydesign.com
The home page is breathtaking!
stivenlarson
February 7th, 2011 3:44 amThank you! Love this post.. It’s like a tutorial
Darcel Reckley
March 8th, 2011 8:18 amThis is a GREAT post! I hope you not mind.I published an excerpt on the web site and also linked back to your own blog site for people to read the full version. Thanks for the advice.
Rainleader LLC
June 23rd, 2011 3:16 pmI really liked the Gray design and PixelStudio — both perfect examples of a Minimalist Website design done right! I wrote a similar article on Why a Minimalist Website Design is Better, check it out:
http://rainleader.com/2011/06/less-is-more-why-a-minimalist-website-design-is-better/