4 Principles of Good Design for Websites

By   |  Stashed in Webdesign


One of my absolute favorite design books is, Robin Williams Design Workshop. It looks into practical design theories and showcases awesome examples. One of the areas of focus that I’ve taken into all my designs are the four major design principles. They include: contrast, repetition, alignment, and proximity.

This post will discuss those four principles as they relate to web design. By keeping these design theories fresh in your mind, you will be sure to design cleaner, more aesthetically pleasing sites.

1. Contrast

Great contrast can leave a very good first impression on a user. Without a focal point, the viewer is generally lost in a sea of equally-sized elements and typography. It’s the designer’s job to create visual elements of significance that guide the user’s experience. You can achieve great contrast on your site by choosing your images, colors and fonts wisely.

Contrast With Images

It’s often very effective to showcase a large illustration next to smaller elements. Here’s what I mean:

The Invoice Machine

This site utilizes a large image to bring in the reader’s attention. Also the monochromatic nature of the site allows the limited use of blue to play a bigger role.



Do the eye test on this site. What do you notice first? More than likely it’s the star on the box. Just like The Invoice Machine, they’ve created a focal point using a large image and limited color.


Contrast With Colors

Sprinkling in color at just the right amount is another way to create effective contrast within a website. It can be created using a different color in headers and text copy, as well as within the colors of an image or illustration.


This site is a fantastic example of almost all of the design principles. For color contrast take a look at the large yellow header versus the smaller light gray copy. Alignment, image contrast, repetition and proximity are all strong throughout.


I Love Typography

Is it any surprise that a website built to showcase typography would give us a great example right in its own header? I love their font choice and how the green color plays nicely off the darker gray.


Contrast With Fonts

If you are trying to create contrast with fonts you should avoid using two very similar font faces and sizes. The similarity of the fonts tends to create confusion and blur the design. However, it can be very effective if you make the font sizes very different, or mix the lightest version of the font in combination with the boldest. Also, you’ll be surprised at the visually impressive combos you can create by using two very different fonts in tandem. For instance a san serif font with a hand-written font.

Fixie Consulting

Wow! I love the typography and colors on this site. Check out all the size and stroke variations on their slogan. I also love the grunge that is sprinkled in, and the limited use of blue.


2. Repetition

Repetition in print design is much more common than it is in web design, however it can be equally effective. Repeating design elements helps create a consistent look and improves branding. In web design a great way to achieve this is by repeating elements in the header and footer. Check out a couple of examples below.

Ten24 Media

Ten24 Media uses a creative grass illustration in both the header and footer.



This site is just awesome! I definitely could have showcased it in the contrast section, but it works just as well here because the theme and branding are clearly used throughout. Check out the use of the bananas as bullets, and the forest illustration at the header and footer.


3. Alignment

Alignment plays an intricate role in taking your site designs from looking amateur to professional. I’ve recently become a huge advocate for designing sites using a grid. Doing so cleans up your designs and gives you an awesome framework to work from. If you’re interested in learning more about designing for a grid, check out my recent post (insert shameless self promotion here), Design A Fresh Blog Theme On The 960 Grid.

Black Estate Vineyard

This site is showcased on the 960 Grid website. It’s alignment is consistent and striking. I love the way the main content is left justified and flush in its column, however some of the larger level headings break the rule and shift into the left sidebar. They also do a good job with generous amounts of white space and contrasting sized fonts.


A List Apart

A List Apart features a visually obvious grid. The columns are well defined and contain everything in very readable chunks. Studies have shown that really wide columns drastically reduce readability. Your eyes will get tired when trying to follow text across wide column widths. A List Apart also features a fantastic article that argues, Good Designers Redesign, Great Designers Realign.


4. Proximity

The last principle is proximity. This has to do with grouping like elements together and separating those that are not. It can really ruin user experience if you group everything into one lump text block. That’s why its very important to use header tags and proper spacing.


This site does a beautiful job of organizing it’s content into three major categories. They are well spaced and clearly defined.


Paradigm Reborn

This site is well structured. The headers are clear and concise. The spacing is good and the content is separated into logical chunks.


Final Thoughts

It’s unbelievable how much better your designs will become when you take into consideration these four basic principles. There are always more things to consider, but a foundation of contrast, repetition, alignment and proximity will improve your designs dramatically.

Your Turn

Join the discussion. What do you think of these design principles? Are there more that you’d like to share?

About the Author

Andrew is a primary contributer for MyInkBlog. He is a full time web developer for Niagara University. When he's not working there, he's a blogger, twitter'er, wordpress'er, silverstripe advocate, blessed father and husband.

More posts by


  • http://sashaendoh.blogspot.com/) Sasha

    just like K.I.S.S. – simple principles lead to great results. Great article!

  • http://www.creativewhirlwind.com brian

    Great List! I know quite a few businesses that could do well to pay attention to these principles.

    brian´s last post was… If you don’t know who Paul Rand is…

  • http://www.suberapps.com Ben

    Very good article, all the good principles of design has been explained here, I can’t agree more with having enough contrast in a site to make it more appealing.

    Ben´s last post was… Lounge – Twitter App for Mac and iPhone

  • http://www.wpdone.com WPDONE

    Some new ideas here. Good examples too.

  • http://www.redcubemarketing.com Gemma Went

    Spot on! Very useful article

  • http://iniwoo.net T-Law

    Good work useful, inspirational.

    T-Law´s last post was… Photo manipulations inspiration: Li Wei

  • http://www.isean.co.za Sean Nieuwoudt

    great post! spot on!


  • http://phiredesign.net AJ Troxell

    Great article!

    AJ Troxell´s last post was… 10 Useful Twitter Articles

  • http://tutsearch.net Art Webb

    I always loved Robin William’s books. Basic concepts that we all sometimes forget.Great post.

  • http://www.thonyconde.com Thony Conde

    Great post! Gratz :)

  • http://www.metropoliscreative.com Michael Flint

    Nice collection of nice designs. Of course, your principles apply to print design as well. One more and you’ve got all of the Gestault Principals.

  • http://www.element3media.com joshua murphy

    Great post, great sites and great advice. I hope that people really listen up and start to impliment these things in to their own sites very soon.

  • http://www.thisinspires.me Brandon Cox

    It’s pretty obvious you’ve put a lot of time and effort into this article – awesome work! Gonna feature it in my favs tomorrow!

    Brandon Cox´s last post was… Inspiring Design Links for Creatives for 2009-03-21

  • http://www.janpaultenwolde.nl/ Jan Paul ten Wolde

    It is such a good collection I am actually sending it around to inspire my web designers. Thanks!

    And a nice plugin below you have!

    Jan Paul ten Wolde´s last post was… Coder needed #1

  • http://www.myinkblog.com Andrew Houle

    Love all the great feedback on this post, thanks guys!

    @Brandon Thanks for the feature :)

    @Jan Thanks so much, I hope it does inspire some good design, remembering these principles has always helped me.

  • http://osweb.dk Michael

    Great site, will use it for my classmates

  • srinin

    This is CRAP!

    I mean Contrast, Repetition, Alignment and Proximity!

    U hv KISSed it! LOL!

  • http://misterfaster.com MisterFaster

    nice basics! :)

  • http://www.myinkblog.com Andrew Houle

    @srinin Yeah I noticed that acronym too, I was wondering if anyone else would :) Sure makes them easy to remember!

  • http://thedesignsuperhero.com aravind

    Great article.
    You should have posted this article before one week!
    I just redesigned my site. :P

  • http://www.1klang.de frank katzer | 1klang.de internetagentur / fulda petersberg

    nice list and important to remember when designing a new website!

  • Meshach

    Thanks for this article, very helpful.

  • http://chedonline.com Ched

    Well said. Great examples. While websites IMHO don’t all have to follow these principles to be effective, these are tried and true principles that speak the language of web design.

    Ched´s last post was… Magazines Reborn in Music Video Form?

  • http://www.teddy-o-ted.com teddY

    I’ve seen long lists of what it takes for a design to be considered good – and yours is simple, short, concise, elegant and easy to remember. I will have to say that indeed, contrast is one of the most important aspects of design. We aren’t lacking any negative examples of contrast (I bet everyone would have stumbled on at least one webpage that has pink background and lime-green fonts) and typography (Comic Sans MS, anyone?) out there, but when it comes to getting awesome examples, they’re hard to come by. You’ve listed excellent examples of webpages that can proudly strut their stuff :) thank you so much for sharing!

    *Note to self – when I’m in for a redesign, I’ll definitely return and read this article over again, just in case.

    teddY´s last post was… Tilt-shift Time Lapse Photography Video – Oh my darling!

  • http://alankun.com Alan

    Thanks a lot Andrew! I’m a self-taught web designer, not even an intermediate but this post is awesome, I’ve bookmarked it as soon as I read it, congratulations, you’ve taught me a lot in this post and I’ve suscribed to your blog.

    Cheers :-)

    Alan´s last post was… Spotify, música gratis y la revolución musical

  • http://aarondommer.com Aaron

    very good article. i like your objective perspective. great examples. thank you.

    Aaron´s last post was… Try a new perspective.

  • SS

    Good read, thanks!

  • http://romaspace.wordpress.com roma

    Very useful post indeed. Thanks for clearly explaining each point with examples.

    roma´s last post was… OUTLIERS by Malcolm Gladwell– A Review

  • http://www.frigidhair.com Rebecca Geiger

    Great Post! I have homework to do and perhaps overhaul my website. Thanks for the post I found this an inspiration and new goals to achieve.

  • http://xemanhdep.com Anh dep

    Good list, I like this post!

    Anh dep´s last post was… Ảnh đẹp cầu vồng-Awesome rainbow photos

  • http://www.csskarma.com Tim Wright

    Good list. I’d like to see more than 4, but overall pretty good.

    Tim Wright´s last post was… SXSW Notes pt. 4 – Managing “Expert” Clients

  • http://www.cancelbubble.com cancel bubble

    Ah yes, the C.R.A.P design principle, very fundamental. It’s interesting how many designers don’t know this – at least from interviews I’ve been in on.

  • http://www.thebaublegarden.com Angela

    Nice hints, thanks. I love the Black Estate example, very classy.

  • http://thecartoons.net Donna Barstow

    I love Robin Williams’ books, too, although I haven’t read this one. But she has those rules in her early ones, but I believe she calls them CARP…or at least, I’ll take that, since a commenter recently suggested I sell carp rather than cartoons.

    Donna Barstow´s last post was… I only use Paul Newman’s legendary salad dressing.

  • http://www.wordpressgala.net WORDPRESSGALA

    Very good work, very useful!

  • http://dailycycle.co.uk tim

    Great article, some of these sites are very inspiring.

    tim´s last post was… Lightbox Extension For BlogEngine.NET

  • http://www.faridhadi.com Farid Hadi

    Although these might just be the basics, I found this article as a helpful reminder. Being more of developer I’m constantly trying to improve my design skills.
    Thanks for a really great article Andrew!

    Farid Hadi´s last post was… PIXY gone CRAZY! Post your Freelance Gigs on PixyJobs for $1. Offer valid till 1st April 2009.

  • http://www.redsan.com Redsan

    Very good!!!!

    Redsan´s last post was… Logofi, logos à gogo!

  • http://www.zenelements.co.uk/blog/ Zen Elements

    Great article and I especially like the point that was raised with image size / placement against text when discussing contrast.

    Keep up the great work!


    Zen Elements´s last post was… Coding XHTML & CSS Sprite Navigation

  • http://www.DreadKnight666.com Dread Knight

    Neat article :)

  • http://www.timothybsmith.com Tim Smith

    Awesome post andrew!! I needed something like this!

  • http://www.flickr.com/photos/danielgilles/ Tanaka13 – Créations du Net

    Very interesting article!

    Tanaka13 – Créations du Net´s last post was… The Legacy

  • http://10steps.sg/ Johnson Koh

    I enjoyed this. Thanks!

    Johnson Koh´s last post was… Create Powerball Effect for Movie Poster

  • http://alisonfoxall.com Alison

    aka CRAP! =D

  • http://www.andrislinz.ch Andris

    Excellent article. Thanx a lot for sharing your thoughts.

    Andris´s last post was… Kris Roe of The Ataris plays Blue Skies…

  • Matt

    principles of crap!

  • http://designmovesme.com Roy Vergara

    these are actually the basic principles of design. these would apply to anything you’re designing.

    Roy Vergara´s last post was… 40 Beautiful PSD Slicing Websites

  • http://sharpiechronicles.blogspot.com Tiph

    Thanks for the inspiration: great ideas!

    Tiph´s last post was… explanations, please

  • http://www.batterylink.us jane

    Kool, great idea

  • http://www.arunjlab.com Arun J

    Thanx a lot for the post…It was of great help for me….

  • http://www.crearedesign.co.uk Danielle Ingram

    Having just started to get into web design I have found that there is a lot to learn.

    Previously, I have played around with creating websites of my own and one of the main things that I have learnt is that simplicity is key.

    This is a great post, it outlines everything you need to know in order to create a professional looking website without necessarily being a technical whizz!


  • http://www.cdweb.it web agency

    very very good article!

    web agency´s last post was… fishermilano.it

  • http://www.justsimple.com.au John

    Super-Duper site! I am loving it!! Will come back again – taking you feeds also, Thanks.

  • http://www.webdesigner-kochi.blogspot.com/ Binoj Xavier

    Cool. I Like it. Thanks :)
    .-= Binoj Xavier´s last blog ..Running iPod / iPhone OS on Mac Pro =-.

  • http://www.mcrrentals.com Rob Lewicki

    Awesome article. Going to use some of these tips in our redesign. Thank you.

  • http://www.webdesign-guru.co.uk/icon/ Nikolai

    Nice and simple – as design should (often) be.
    .-= Nikolai´s last blog ..External Link Icon =-.

  • http://www.wichmandesign.com Nick Wichman

    I like this article. It gives a great overview of a couple of the foundations of the web design process. These are just a few of the things to think about when designing. I think “repetition” would be better titled CONSISTENCY since it is referring to the design style of a site being overall consistent. Great article, though!

    .-= Nick Wichman´s last blog ..Design for client, not yourself! =-.

  • http://www.nburmandesign.com Media Designer

    Nice summary – Design 101 :)

  • Nope

    This to me seems like a duplicate article I read on Smashing Magazine…from the content to the example sites used. You very well could have been the original author, but mentioning it was posted somewhere else would be nice. Unless you stole the idea.

  • http://revenuerobot.com Revenue Robot

    amazing stuff… very useful and worth the bookmark!
    .-= Revenue Robot´s last blog ..How to view someones URL Statistics on Bit.ly =-.

  • http://www.luisramirez.org Luis Ramirez

    love the article forwarding it on to a couple of folks that can benefit from these examples… i may have to give the book a go as well.
    .-= Luis Ramirez´s last blog ..Coburn Yoshida Award =-.

  • http://www.redesignyourbiz.com/ I Love My Work

    oh yes, you are correct.

  • http://www.granercreative.com AC Graner

    I hate, abhor and detest reverse type, especially on the web. Studies prove reverse type is hard to read–and often isn’t. (You can look it up.) Sure, designers love reverse type because it looks cool. But the purpose of communications is to communicate, and anything that inhibits that is a waste of time and money.

  • http://www.jm-experts.com Chetan Madaan

    Nice guys! this is cool!
    .-= Chetan Madaan´s last blog ..The JM-Experts =-.

  • http://www.myinkblog.com Andrew Houle

    @Nope – The article was not stolen from anywhere, to say that you’ve found other articles on what makes up good design is like saying you’ve found another design blog. This post was inspired mostly by the book that I clearly mention right at the beginning of the post. I did a quick search for a Smashing Mag article you may have been referring to, and found this: http://www.smashingmagazine.com/2008/01/31/10-principles-of-effective-web-design/ It’s a very good write up, but by no means did I steal any content from it.

    @AC – I suppose if you are making a corporate type site you may want to avoid reverse type, however, I still like it. And certainly with designer sites, apps sites, and personal blogs, reverse type works quite well.

  • http://www.haul.com.au/_catalog_38702/MacBook_Sleeves Scott Kilmartin


    A very timely piece. We are in the midst of redesigning the haul website to both build brand and sell product. Often this is a hard balance to find.
    Your article simplifies key points very well.

    Our web designers will enjoy this post.


  • http://www.singleviews.com Derek Leblanc

    Great tips, I will definitely try and use these in all future sites I deisgn :)

  • http://www.russelluresti.com Russell Uresti

    C.R.A.P., or Contrast, Repetition, Alignment, and Proximity are often taught as the 4 basic principles of design. That’s all design, and not just web design. This article might better be titled as examples of how those 4 principles of design are used effectively in web design.

    This article is well constructed, and uses good examples. The explanations are simple and easy to understand. I think it’s a good article for beginners. Often people think “web design” is “look what I can do in photoshop” and don’t pay attention to the actual principles and elements of design. So it’s good to remind people that there is a starting formula for what you create.

    I think some of the explanations are a bit lacking. You did a good job covering Contrast, explaining that you can create contrast via size (though you spoke only about images, ignoring that you can also use different sized fonts), color, and typography.

    The description of Repetition I find to be extremely lacking. You only talk about repeating elements in a header and footer, though you do mention that it’s important for consistency. Repetition is used tons of ways on a site. For example, making all the headers the same / color. Or making all the links the same color and all hover with the same decoration. Or having a certain treatment to the horizontal rules you use to divide the content sections of your site. Or using icons in the navigation and then repeating them in the content. There are tons of examples of Repetition in web site design, and you skipped over quite a bit of it.

    Alignment you covered well. I feel there’s not too much you can actually say about alignment, other than “Hey, make sure your s*** lines up!”. The examples were good examples, and I definitely agree with using a grid as the starting point of a design (I always start my designs with a 3, 5, or 7 column grid).

    Proximity is also well described with good examples.

    When I was in school, I was actually taught 7 principles of design. Balance, Contrast, Emphasis, Movement, Rhythm, Pattern, and Unity. Others teach things like Gradation. There is actually no official “Elements of Design”. They seem to vary from philosophy to philosophy.

    I really think Emphasis and Movement are principles of design that are worth stressing. Emphasis being the focal point (what’s the first thing you see when you come to a site), and Movement being how the eye travels along the page from one content section to another (does anything tie the sections together, or are they kept apart). They’re both extremely important in effective web design.

    But this post has definitely given me an idea or two, so thanks for posting.

  • http://www.twitter.com/sr77in shine

    Nice ones..Especially I like the typo one and Instabox…but can’t agree on fatburgr..
    .-= shine´s last blog ..sr77in: wify had her first day in school as a teacher..her long nursing dream come true.. =-.

  • http://www.graticle.com Shawn Hooghkirk

    Thank you for the article! Great work — keep it up!

  • http://www.orphicpixel.com Mars

    envato website is really very clean

  • http://www.2xpertsdesign.com Akhtar

    Out of this world, fantastic andrew!

  • http://www.gigglecomputer.com Phaoloo

    Great principles. They are all basic stuff but if you follow all of them, your design will rock!
    .-= Phaoloo´s last blog ..PeaZip – Flexible And Powerful Archive Manager For Bloggers =-.

  • George

    Great article has a lot of good tips, some are pretty obvious however it is always good to reinforce the basics.

  • http://twitter.com/dSine_Lab d*Sine Lab

    Can’t skip the basics. I’ve seen some amazingly complicated artwork for websites that lack the basic math.
    .-= d*Sine Lab´s last blog ..dSine_Lab: Working on the Mac today. Ahhhh, miss these expedient shortcuts. #apple =-.

  • http://www.stage5studio.com Danny Silva

    Hey Andrew,

    Nice write up, and thanks for the kind words. First time stumbling across your blog…good stuff. I’ll have to stop by more often.


  • http://pelfusion.com PelFusion

    really nice tips…keep the good work up
    .-= PelFusion´s last blog ..15 Free High Quality Magento Templates =-.

  • http://www.daydesignz.com dayaday

    This a wonderful article, I’m a self taught web developer that went to school for Information systems. I didn’t formally go to school for design so this article is essential for some of my new projects. Thanks so much for this!

  • http://divyasharad.blogspot.com div


  • http://www.sjlwebdesign.co.uk Sam

    Very interesting article, with some exceptional examples! Thanks for posting :)

  • http://kourtesy.blogspot.com Kourtesy
  • http://www.vinfotech.com/ Viscus


    These are really good design principles. Although at first sight they may not look so great but these rules are quite significant for a good website design. Amateur designers should memorize these design principles

  • http://www.northstar-website-design.com/ Fred Campbell

    Love it. Bookmarked it. Digged it. Tweeted it. Thanks.

  • http://www.webdesignfromscratch.com/ london web designers

    Great article… Bookmarked!

    Keep up the great work!
    .-= london web designers´s last blog ..How to Use Keyword Research to Boost Search Engine Rankings =-.

  • joseph m bott

    I like using concepts such as contrast, alignment, repetition and proximity and can see how they are valuable tools. One thing I noticed in the examples is there appears to be a relationship between each concept and page space when rendered. This relationship appears to be a 3 to 1 ratio. To achieve the desired focal point is the page conceptually divided into thirds and each section divided into thirds again? Will continuing dividing the area into this golden ratio produce alignment, repetition and proximity?
    Is contrast associated with objects shapes as well as color.

    Some thoughts about the article. joe

  • http://www.hgh-growthhormone.com HGH

    Very interesting article, with some exceptional examples!
    .-= HGH´s last blog ..The Real Truth About HGH That You Must Know =-.

  • http://www.samsungomniapro.nl samsung omnia pro

    Great examples, I like the gorilla and the easy invoice website the most.

  • http://www.vouchersmarter.co.uk voucher codes

    Very helpful! one thing I noticed in the examples is there appears to be a relationship between each concept and page space when rendered.

    .-= voucher codes´s last blog ..CC Fashion voucher codes =-.

  • http://www.neotericuk.co.uk Website design

    Beautiful collection of designs i truly agree with the fact that contrast, font selection both are crucial half of the job is done if we choose the right colors and right font , the one here i liked is envato and the first one black design i liked them very much

  • http://- Scott Carson

    Hi – I am a secondary teacher teaching basic website design to yr 8’s using Dreamweaver. This site is fantastic. A free site that actually is useful. Well done!!! I will use this to explain the Principles of Design to my Yr 8’s (CRAP)!

    Thanks again,


  • http://www.nomiinfotech.com/ Web Development India

    This is good information for us.
    This info help us.

  • http://www.psprint.com/postcards Ashley Adams : Postcard Printing

    Wow……now this is what I call an informative article. I just loved the way you have explained each principle. Great effort. I believe both the beginners and the professionals will benefit from these examples. Thanks

  • http://www.lekmer.se/ Schleich

    Good article. The website examples you showed had great designs. It´s reminds me that I have to work on my design knowledge and this was a start.

  • http://onlineparfume.dk Nikolaj Bomann Mertz

    Awesome blog! Very nice!

  • http://stevenwscott.com Steven W Scott

    For typography I like Arial font (it looks real nice) or if you really people to read your words then Georgia font is great because that font is specifically designed for people to read print (similiar to some major newspapers).

  • http://www.discountmole.co.uk/ Discount Mole

    good fonts make a website, naff fonts ruin a good design.

  • http://www.timecenter.com/blog/ Daniel The Scheduling Wizard

    I love these kind of lists. I have seen The Invoice Machine before, it’s really pure. The buttons remind me of Nintendo Wii. =)

    I think the hardest part is to find the design language that will suit the purpose of the site. But at the same time being different enough to get noticed. +1 Follower on Twitter!

  • http://www.owendevelopment.co.uk Manchester Web Design

    Great post. I love clean designs, and this article has reaffirmed that less is certainly more.

  • bivinci

    nice info..this is great knowledge..

  • http://www.blogigo.co.uk/Composite_Doors composite door news

    For color contrast take a look at the large yellow header versus the smaller light gray copy. Alignment, image contrast, repetition and proximity are all strong throughout.

  • minh


  • http://www.kaplang.com/blog Michelle

    Great article, thanks

  • http://www.impactbnd.com Impact Branding & Design

    Love the styles… especially the first three. Nice Job!

  • http://www.loopwhole.co.uk web design suffolk

    Great Article! Some times you just forget the basics when you have a deadline to meet. You have just solved my problem.

  • http://www.onlinedatingportfolio.com/ Online Dating

    That is good post keep it up thanks

  • http://www.tj-todo.com Thibault

    Great article. Thanks for sharing.

  • http://www.neotericuk.co.uk Neoteric web design

    This has been the most tremendous post someone on the top mentioned that in order to meet the the deadlines we sometimes miss the basics which is very important..

    Thanks mate!!

  • http://www.benstokesmarketing.co.uk Ben Stokes

    Excellent post. thank you very much for the collection.

  • Jeff

    Awesome post. Thanks!

  • http://www.glendelmdesign.co.uk Matt Lewsley

    Hi, having just got into Web Design seriously, I’ve been realising just how important it can be to keep it simple. This article really outlines all the key things for creating a website without having to write technically challenging code :). Thank you

  • http://www.card-recovery-software.net/ card recovery

    This is really a very good post. Liked the way you have presented this.

  • http://www.web-design-folkz.com/ Bespoke web design

    Excellent !!

    Color contrast and color choice may differ visitor to visitor, so i take vote. When I design a layout i design more than two then I show it to my client and my friends and my co workers asking their opinion on color selection and typography, i just take vote and the design get much vote I complete it for my client.

  • http://www.graphicdesignclassesonline.com/ graphic design classes online

    Incredible post I am such a big believer in white space. It can have such a huge impact on your design and how easy it is to read.

  • http://www.glasgoweb.co.uk web design glasgow

    white space, is back , a few years ago people where just craming stuff in , now any website that wants to look sleek needs some clean lines

  • http://seoworking.blogspot.com Seo Pakistan

    Thanks for offer great principles of good designing.

  • http://www.lyonssolutions.co.uk Web Design from Lyons Solutions

    Great Stuff, A good resource for everyone who is not well versed with this side of things.

  • http://www.fpolitics.com/ Politics

    These are very cool designs.I will have to say that indeed, contrast is one of the most important aspects of design.

  • http://www.infoboxmedia.co.uk Lenny

    The Silverback site is fantastic, if only I could come up with ideas like that!

  • http://www.nadjaeberhardt.com Graphic Designer London

    Great article and selection of websites, thanks!

  • http://www.beverleyhall.co.uk/web_design Colin Hall

    Hi Andrew,

    Thanks for this article. Good solid points and well illustrated with some great looking site.


    Colin :-)

  • http://www.bondmedia.co.uk/ Web Design London

    Hey great information. Thanks for sharing.

  • http://www.designn.co.uk/ Web Design Norwich

    There is alot to learn when it comes to GOOD web site design and I think you have pretty much hit the nail on the head here.. keep up the good work!

  • http://www.everythingcebu.com Troen

    This is probably the most helpful four-point instructional I have read on web design. Thanks!

  • http://Hectoronline.info Austin web design

    Good description of your points the illustrations helped alot thanks for sharing

  • http://www.webdesignshowroom.co.uk Web Design Dorset

    I really love the large image idea to catch the users attention. They also give a website real personality and brand. The most difficult thing is of course coming up with an original idea – and being competent enough to design it! A good example is Mail chimp – it helps you to remember the company name because the first thing you think of is the little chimp in a postman uniform.

  • http://www.soloibiza.com Hotel Ibiza

    The black background is not my favorite but I know that is very effective in contrasts

  • http://www.brillcreative.co.uk Web Design Bristol – Rich

    Nice web design principles. I would definitely agree with the use of white space in all sites and don’t forget the Golden Ratio or rule of thirds as grid guides, always a useful one when it comes to any kind of design.

  • http://www.le1webdesign.co.uk Dan::LE1~Web design

    Great examples of the four design principles.
    I have just finished reading Robins book, and thought it was simply and straight to the point.
    Good idea to show some more examples to complement the book.
    Be brave be bold!

  • http://www.schoolsearch.in nik

    great examples. Will try implementing… thanks

  • http://www.kronikmedia.co.uk/ KM Web Design

    Great article. I like the fact that instead of listing down hundreds of items you have chosen to focus on 4 factors and have included in-depth example to illustrate each of the points. Use of white space is another very important factor; perhaps the 5th point in the list..

  • http://www.junowebdesign.com Juno Web Design

    The four things you have discussed are simply the best! Alignment aspect is my favorite. Thanks a lot!

  • http://www.sjlwebdesign.co.uk SJL Web Design

    Great article, good work on the chosen examples too, they really help to illustrate your points.

  • http://www.techdesigns.co.uk Techdesigns web design

    Thanks for this – some great example websites (and info) here

  • http://www.petermoss.com Peter Moss

    After reading your points, I think I have to redesign my site (again!).

    Excellent points BTW. Thank you for sharing this.
    You are bookmarked.

  • http://www.fivesquids.co.uk Thomas

    Those examples are fantastic. Makes me wanna give our whole website a revamp.

  • http://www.hollandproducthouse.com Richard Kruk

    I would name “Details” as the fifth basic principle.

  • http://www.vekta.co.uk Vekta

    Some great tips there Andrew! I started out as a graphic designer which really teaches you about alignment and font usage. I also use grids but tend not to switch them on until after I’ve created the visual layout.

  • Mike

    Is it just me, or is the ape in the Silverback strangely disturbing?

  • New York Production Company

    Nice, love it!

  • Rockit99

    Very very nice. Thanks for taking the time and trouble to find good web site designs and the reasons why they are!

  • bullet camera

    I really hope my designer had read that before I fired him, it would have saved us so much time.

  • PSD to CSS

    Great Post, Very informative. Thanks!

  • altın çilek

    Those examples are fantastic. Makes me wanna give our whole website a revamp.

  • http://www.perfiles-msn.com/votamicuerpo/ Votamicuerpo

    Black Estate Vineyard it’s my favorite! Great examples!

  • Web Design Preston

    Great inspiration for all of our websites! Nice work Andrew.

  • amor y amistad

    Great list of themes! It’s a good inspiration for our sites!

  • Website Design York

    Well simplified. I think great design has simplicity, clarity, and the 4 things mentioned here go towards supporting that. Great work Andrew. Thank for stimulating some interesting thoughts.

  • http://www.mojowebdesign.com.au Anna Green

    This is a good post with some nice website included, however is there anyone els who can already see some of the sites becoming dated? I don’t think it will be long before some of these sites are very old hat.