In What Makes a Design Good?, I talked about the technical aspects of a good design, like site and user goals, branding, and distinction.
I did not however answer the question of what makes a design look good. What makes one blog visually attractive, but makes another one ugly?
There is no mathematical solution, but there is an artsy one. A good looking design is a combination of a number of factors. If your blog succeeds in each of these areas, then the overall effect will be an appealing design.
Image by Nir Tober.
Structure
I have a friend who won’t go into a certain sports store because the layout is too confusing. Men’s clothes next to the women’s, kids next to adults, football tops out on their own etc. I’m sure there is an order to it somewhere, but I can’t see it.
There is a lot of information on a web page. You can order your page in your own mind, but if the ordering is not blatantly obvious to a first-time visitor, they’re going to be overloaded and leave.
Structure and grid-based design are the corner-stones of a well laid out blog.
Further Reading: Designing With Grid Based Approach
Balance
A good design is easy to take in. It allows your eye to glide around the page naturally, without being continually drawn to a certain area of the page.
Think of a see-saw. If you put too much weight on one-side, it will tilt in that direction. But if the weights are equal, it will balance.
In the same way, the weights of the different areas of your page should be equal. The weight of a specific element is affected by its size, but also by its color, its position, and even the detail within it.
Further Reading: Principles of Design: Balance
Color
Image by Vygotskij.
Color is a scary topic for many people, but it must be braved. The most sure-fire way to ruin a great design is to choose an awful color scheme.
If you don’t trust your eye to pick a good color scheme, there are many tools out there to help you.
Further Reading: Basic Color Theory
Small Details
A person can appreciate complexity in a design. The small details make the overall effect.
You don’t need great works of art in your header, or fancy features in your sidebar. The small details in your site will communicate the level of effort put into a design all by themselves.
It’s working on those details that takes a design from good to great.
Further Reading: Design Is In The Details
Clarity And Emphasis
No reader cares to read all of the content on your page. Most want to read as little as possible. They only need the gist of your points, and then they move on.
Clarity in your design allows one element to differentiate itself from its neighbor, and emphasis on your most important elements, such as post headlines, indicates clearly where the reader should look.
Ample whitespace is a favorite tactic for achieving this. It lets your design breathe, preventing readers from being overloaded and confused.
Further Reading: Give My Web Space
Remarkability
Image by Orgutcayli.
This is Seth Godin’s word. You normally hear about it in the context of products and services, but it applies to web design as well.
There are two routes that a design can take. Safe and not safe. You can choose a simple color scheme, a regular 2-column layout and a normal Arial font, and make a decent blog. It won’t be anything spectacular, but it will do the job.
A great design does something more. It goes further than the regular web site and it makes itself unique. Great designs have a certain aspect that makes them better than other sites. Something about them that is worth remarking upon.
Further Reading: 25 Incredibly Artistic Websites
Functionality
Design on the web is not based solely on appearance anymore. Even on blogs, the functionality on your page plays a large role. What do you think when you see beautifully laid out threaded comments? Or well implemented Gravatars?
A good blog is much more than a diary with comments. It allows for you to interact with the content, and makes your experience much more enjoyable.
Further Reading: 35 New WordPress Plugins for an Effective Blogging Experience
When you see a web page with great functionality, obsessive attention to detail and no flaws to be found, it gives you high expectations for the site. It says a lot about the blogger.
There are far more than 7 elements to a great design. These are merely my favorites. What do you think makes a design great?
Custom Search
Sarah Jo (1 comments)26 June 08
For me, type is really important on a blog. That’s more specific than the principles on your list, but it’s worth mentioning because blogs are first and foremost about content, so reading that content must be easy. I specifically like the type design at A List Apart and Wired.com.
Zhu (4 comments)26 June 08
Very good points!
To me, some blogs are a turn-off, no matter how good the writing is. I hate slow-loading websites, flashy pictures everywhere and worse, people who pile things up (awards etc) in the sidebar.
Web design takes a lot of effort and I’m not a specialist but I hope we can all follow your basic advice!
Deron Sizemore (34 comments)26 June 08
Great article Michael! I too think the small details can make or break a site. I’m usually obsessive about very small details that the average person wouldn’t even notice, but I think it makes a big difference.
As for the functionality, I agree there too. People are doing some amazing things with navigation bars, threaded comments and the gravatars you mention these days. Really adds that something extra to the site that you probably wouldn’t even think about.
Steven Snell (24 comments)26 June 08
Michael,
Thanks for the link. Personally, I find clarity and emphasis to be especially important. Blogs are all about content, so it needs to be readable and the right content needs to be emphasized.
Brad Blogging.com - Daily Blog Tips For The Masses (2 comments)26 June 08
Quite Personally – Design Comes Second in a blog. (but a very close second)
If the content was useful to the reader, why should it matter what is around it?
Having said that, I have read a blog that was nothing but ads but their content caught the attention of my feed reader, so I can say that their design was flawed, but it was what the title was that attracted me.
I mean you look at these new “Minimalist” templates that are springing up in blogs, and they aren’t bad to look at, just a little plain.
ajay (1 comments)27 June 08
you can also add that providing the news source is also a good pratice.
liam (5 comments)2 July 08
So very, very true. And each point as important as the next I’d say. Its all about working these elements together, you can never rely on one single element.
greven (2 comments)8 July 08
Nice article.
Always nice to read some tips concerning the appearance of our blogs.
If you guys don’t mind could you rate the readability and look of my blog? Because it’s a dark theme and some people don’t like to read white on dark.
Trevor Bradley (1 comments)8 July 08
Hi.I’ve just made my very first website using weebly.com.I know that using a hosting site isn’t ideal but as I said,it’s my first and i’m just learning.If you could give me some feedback,be it praise,criticism,tips,links,it would be greatly appreciated.Thanks in advance!
Tech magazine (2 comments)20 July 08
i like using simple themes with minimum graphics
Ashutosh (2 comments)7 October 08
Hey i am looking for wordpress theme… now i will evaluate the themes using these tips… thanks for the tips…
MARK Z (3 comments)2 November 08
I agree that if the design isn’t right, people won’t take the time to read your content. So you might have the best blog in the world, but if everyone is turned off by your color scheme, then nobody will take the time to read your great blog.
jingquan (1 comments)17 November 08
Agree, unless you’re provding dowloadable contents then it doesn’t matter how bad your site looks, information is still king here, althought not many would want to stay on your site for long.
Thanks for the tips I’m working on my own wordpress theme.
john - laptop (8 comments)27 November 08
i agree with your opinon. thank you for this post. very intresting. i like it.
bodsVombtam (1 comments)27 November 08
Cheers!
xoxo
I made on photoshop animated myspace banners.
have a look at them:
http://tinyurl.com/5w2eqc
Thanks for your website
TutorialCompiler (5 comments)15 January 09
Handy guide for my ebook. Thanks
maggie (1 comments)18 January 09
Great Ideas, I know if I see a black background I immediately leave no matter how great the content, it’s just to hard for me to read..
Thanks
Maggie
Robert "Butch" Greenawalt (2 comments)20 January 09
Some very valid points made here and color, affiliate ads and comments that go on forever just tend to stress people out and distract from the purpose of the post. I’m attempting to redesign my template myself so getting tips from more experienced people is always a plus. Nice work, appreciate the advice. Cheers, Robert “Butch” Greenawalt MRHYPERPCS
Robert "Butch" Greenawalt (2 comments)20 January 09
Wow i just noticed something else which I wanted to comment on…. “The Tags” so you use the tags rather than the categories themselves? Do you find that a more structured method over say using a dropdown menu of categories or categories listed in the side bar for example?
I was just curious about your opinion. Thanks.
Not attempting to be critical here
Kampanye damai pemilu indonesia 2009 (4 comments)10 February 09
Yes for me layout is number 2 after site content. It’s better to make it eye catching
masipan (1 comments)21 February 09
Thanks, nice article.
Anthony (2 comments)28 February 09
I think the spacing of elements can greatly help the user understand the content hierarchy too.
Gez (1 comments)20 March 09
Thanks for a good read! And you show it off by the way you layout the article with spacing and emphasizing copy – easy to read. Cheers! I’ll be back for more…
Xtence (2 comments)23 April 09
great post, i especially like the part of Functionality, lots of people forget this one
SJL Web Design (10 comments)26 April 09
Thanks for the great article, really useful for anyone starting a blog design.
jimmy switch (2 comments)28 April 09
I have many blogs which are all free,and they are all used the template,some is very good,I think when design a blog, the style is important,I like a generous blog.
AlexG (1 comments)30 April 09
Functionality is very important for sure.
Adis (9 comments)3 May 09
Too much color is not good for their eyes…
Adis’s Latest Post: My Wedding Photos
baloot (11 comments)9 May 09
very great ideas.
need to repost on my blog too.
don’t worry, i’m using totally diff language..
baloot’s Latest Post: Joomla Tutorial Video: Creating Content (Part 3)
Mozette (1 comments)11 May 09
Thank you for the new ideas for my blogs. I’m relatively new at this and I’ve got two blogs that are taking off; yet the best-looking one hasn’t got any followers at all. So, I was wondering what I was doing wrong – which ironically is nothing. However, I think I’ll leave my other two blogs the way they are and just change the font and the size of the font on ‘The Book Craze’ because it is a little small.
Thank you again. You’ve written a great article.
Mozette’s Latest Post: Art Vandals and Job Offers
blog design cape town (1 comments)12 June 09
Brilliant article! I’m adding a link to it to show that not only what design is all about but even well written copy.
Great work. Give us some more
r4ds (2 comments)6 July 09
good info, Thanks for your sharing this information
.-= r4ds´s last blog ..R4i-SDHC Revolution for NDSi/NDSL/NDS =-.
zeb (3 comments)11 July 09
Thank you for this post.
.-= zeb´s last blog ..Sountrack de Los Hechiceros de Waverly Place La pelicula =-.
mobile phone (1 comments)16 July 09
Brilliant article! I’m adding a link to it to show that not only what design is all about but even well written copy.
Great work. Give us some more
baloot (11 comments)8 August 09
hey, love your new design. long time u didn’t change this blog design. to be frankly speaking, i really fall in love with your new blog design.
cheers problogdesign.. u’ve been my design inspiration..
Web Host Right (16 comments)19 August 09
Some great advice there, sometimes i find great blogs, good design, everything is right except that it has a dark background
if i like the content i will force myself to use it though.
buybatteryca (14 comments)20 August 09
these pictures are very nice.
petermccurt curtiss (1 comments)22 August 09
Great article, I agreed with your opinion.
Thanks.
Web design UK (1 comments)25 August 09
Truly agree with everyone points yes that is so true small things make an effect these are very basic but important tips before one starts a blog
all-batteries-shop.com (3 comments)25 August 09
I have more things to do.
Webdesigner (4 comments)30 August 09
I agree with all your suggestions and I can see them well implemented in this blog. Well done!
Avery (11 comments)31 August 09
I think there is a big problem,some people can not code,they just use the whole themes they get from the net,they can not change anything after installing their blog.
discount web design (3 comments)2 September 09
great article here. i love the site here.
Walther (1 comments)8 September 09
Hey, Thanks for the great article! Its very helpfull for me!
valves manufacturer (3 comments)29 September 09
A blog is very beautiful not not very well.simply.look well.
Web design company (3 comments)9 October 09
Thanks for useful tips. I appreciate them very much.
pari sportif (1 comments)21 October 09
This is informative and useful, thanks for this great post !
A.R Zico (4 comments)28 October 09
Great job and these are very helpful for me.
Muqtada Khalid (3 comments)28 October 09
I like the descriptive form that you defined in Colors and Functionality, after this i make my mind to reconsider my blog and make some movements and definitely i keep these 7 elements in my mind.
dt (1 comments)7 November 09
Hi, The design float code does not seem to work and i cant seem to figure out why!
Can you help?
Thanks.
dt
Hans (17 comments)10 November 09
can you give the tutorials details? May you add new tutorials about your articles.
Gerry (1 comments)14 November 09
Very great help your article! Thanks a lot!
jenny (5 comments)16 November 09
Good Job, thumbs up!!
handbags (11 comments)17 November 09
this article is very hot.
mod converter (2 comments)22 November 09
nice one.
fsadf (1 comments)23 November 09
thanks/ a lot./
nubutbu (2 comments)23 November 09
may be it is right.
bwin fr (1 comments)25 November 09
Excellent post very informative, thanks !
m3i zero (1 comments)30 November 09
i surely i could have excellent design skills as you guys…thanks a lot
ring (1 comments)16 December 09
Thanks for sharing this great article! That is very interesting Smile I love reading and
I am always searching for informative information like this.
rivière (1 comments)17 December 09
Great!!
free online advertising (2 comments)25 December 09
great this article is very hot.
hosting (1 comments)26 December 09
I like your idea’s.
Happy Holidays
Jena K
Autai ptfe (17 comments)30 December 09
Great Poster !!@
burning calories (3 comments)30 December 09
great and interesting site I think. thanks a lot for sharing it.
Cozza (1 comments)3 January 10
Niceeee site, Awesome tips
sticker printing (9 comments)3 January 10
your amazing article there… thanks…
custom printing
北大青鸟 (1 comments)4 January 10
your amazing article there… thanks…
nfljersey (5 comments)6 January 10
Structure+color:)
unibet fr (1 comments)6 January 10
Excellent article, thanks for information.
custom stickers (4 comments)8 January 10
Great Articles thanks for share it.
There is great information in this article.
Rodger (1 comments)9 January 10
Thanx, useful.
betclic.fr (1 comments)11 January 10
Great post very interesting, thanks for information.
betclic fr (1 comments)11 January 10
Great article, thanks for sharing.
WondaMichelle (1 comments)13 January 10
Hi…I am going back to school at 40 starting January 25th. I would like to start my blog that day. I do not know where to begin. Help me please
Ferienwohnungen apartments Oberammergau (2 comments)14 January 10
Nice article, excellent tips! Thank you
Ferienwohnungen apartments Oberammergau (2 comments)14 January 10
Nice article, ecellent tips!
Thank you
paris en ligne (1 comments)22 January 10
Thanks for your interesting article.
website addons (3 comments)25 January 10
These points are universally true and not only confined to blog. Choosing a color and theme for a blog is crucial and difficult as peoples tastes are variable. Color completely depends on the targeted traffic , their age and sex etc.
unibet (1 comments)29 January 10
Article very interesting and informative, thanks.
Dog tags for dogs (2 comments)2 February 10
I still prefer html sites though, they last longer without updated content.
Bonus Unibet (1 comments)3 February 10
well worth the read.I found it very informative as I have been researching a lot lately on practical matters such as you talk about…
fotografia ślubna Bielsko (1 comments)8 February 10
Nice fun on this pictures.