Web design from Scratch, free online course in design for the webHome - introduction to Web Design from ScratchBasics - effective web design processTutorials - hands-on, practical lessons in designing clear web pagesCase Studies - useful examples that apply the web design principles
In this section:

Suggest a site

Do you know a site that demonstrates excellent design, or one that really needs redesigning from scratch?

   

Examples of best and worst use of core web design principles

'Best and Worst' is a rolling list of links to sites that demonstrate the importance of quality user-oriented design, either through good design in action, or lack of it.

Have a look, and judge for yourself which sites are most pleasurable to use.

Devil image is ©1999 Ghettostone Publications™

Best use of core design principles

Creative Commons
Simple, elegant, clear and makes me feel happy. This is a 'new standard' web site. Hints of Blogger make me suspect the hand of Doug Bowman?

I Love Jack Daniels.com
Personal blog site of developer/designer Dave Child. Typical blogger layout done very well, with beautiful CSS main navigation, page structure widths in ems, and subtle drop-shadows between content area and nav area make this a really appealing site to browse. Check out the 'View page structure' utility

Jewelboxing.com
I was stunned when I loaded the home page! Excellent tone and colour, with interest provided by first-rate illustration, nice typography. The only shortcomings in my view are due to unconventional layout (nav in an odd place, no page title) (Site by Coudal Partners)

Platt College, San Diego
I liked using this site, it has personality, simple layout and is content-driven. The only serious criticism is the main navigation, which uses GIF files to show tiny pixel text (change it to real text with CSS mouseovers).

i-define living
Dawn Winder is a Personal Branding Consultant (first of a new breed?). Her site is driven by high-value content, and the regular newsletter is an effective and flexible channel. The straightforward design has personaltiy and gives a strong message, although should use a wider colour theme. I'd also place the logo over left.

Oilily (clothing and accessories)
Some excellent use of simple design, particularly letting the product imagery do the talking. Unnavigable in Mozilla, and DHTML drop-down menus could be tightened up. I'd like to see a bit more use of the space. Overall, a great experience (in IE).

John Lewis
John Lewis is a unique UK department chain, and have one of the best sites for a high-street store I've ever seen. Product-driven, minimal screen decoration, and fast-loading. I'd like to see more use of colour to clarify forms, and a slightly bigger default font size.

Cre8asite Forums
This is now officially my new 'web design community' haunt. It's clear, bright, and pretty usable, with refreshingly few graphics. Plus there's a good mix of members talking intelligently about a good mix of subjects. Recommended.

Appliance Studio
A simple site with plenty of personality. This comes through neat writing and 'contentful' imagery. The design features plenty of whitespace, good contrast, and excellent layout. A pleasure to browse.

Binary Bonsai
This design is so pure it hurts! Michael Heilemann publishes his design blog through a minimal UI that leaves me thinking: more Apple than Apple

Dirk Hesse
Designer's minimalist site (in German) uses excellent design principles, just less of it! Very fresh and easy to view.

Oxford English Dictionary online
In its favour: very good layout, right-side nav, and simple CSS-based design. Not keen on the harsh, inconsistent mouseover colours, should be subtler. Word of the Day seems different to the rest of the site.

Adaptivepath.com
Definitely very clean and simple, and highly readable (although default text size slightly small). A little more colour would be welcome. 2nd-level nav oddly starts to the left of 1st-level. Where's the RSS feed?

SimpleBits.com
Really easy on the eye with a delightful colour scheme that's a joy to browse. mmmm

2Entwine.com
Super-simple, square, solid, blocky, soft colours, responsible use of Flash, clear text. Top marks.

Criticalmass.com
Very good site from a highly successful interaction design firm. Very clean site with clearly arranged information, leaves you with a feeling of trust. Needs to bring more information forward to home page, and focus the introductory message better.

BasecampHQ.com
Basecamp is an online project management product by usable design experts 37signals.

Stopdesign.com
Simply stunninng site from California-based design guru Doug Bowman, newly redesigned.

O'Reilly.com
Simple, clear, bold, effective use of imagery, good layout using mainly whitespace. I'd like to see it use verdana as body font though.

Firewheel design.com
An excellent example of beautiful content imagery that creates a highly attractive site with relatively little decorative graphics.

Apple.com
Apple's whole design philosophy centres on rich, appealing content in a simple, effective structure. Excellent use of whitespace and imagery make this a great site to use.

Top ^ Next topic »
Comments
Please note: I won't include people's personal sites in the 'worst..' category. I think a lot of individuals won't benefit from that kind of exposure. Please reserve 'worst' suggestions for sites that ought to be in a position to fix their issues. Thanks!
Ben Hunt - 04:37 on 05 Aug 2004
Hi,Got a problem with OED.com - surely being the Oxford English dictionary I should be able to look-up a word to find it's meaning.....have a look at the site, good or bad design???
William Wordsworth - 12:27 on 05 Aug 2004
Your site kicks ass. excellent resource collection!
heather - 08:19 on 07 Aug 2004
On 'Hicks & Company', you forgot to mention the annoying pop-ups
Lance Wicks - 05:31 on 12 Aug 2004
Thanks from CForums!  I told you I'd blab about this....(It's the lead topic in the Cre8pc blog.)  We're happy to be part of such great company and appreciate the recognition. Thanks again.
Kim Krause (Cre8pc) - 04:32 on 17 Aug 2004
Binary Bonsai-'This design is so pure it hurts!'this design is so pure there is no design, just loads of text (think this is a text version?) somethins not right anyway.
mozzer - 02:30 on 29 Aug 2004
What's funny is that the Institute of Technology site has a Web and Graphic Design Specialist program..*shudder*...What are they teaching, Frontpage 98?
Robert Heatherley - 07:08 on 30 Aug 2004
I am a student at Institute of Technology, I am also the one that gave the url to that website to be reviewed. I don't think that sarcastic criticism will help them to understand why they should redesign their site. I have assertively been trying to tell them the benefits of a web standards compliant site since this one was created. By getting the feedback from all of your helpful opinions will fuel the reasons for a redesign and let them know the problem areas of the I.T. site. Respectfully -DS-
David Smith - 04:42 on 18 Sep 2004
David, would a WDFS case study help? If you're looking for real evidence to convince site owners, sometimes you have to have something else to show. Most web sites are bad, which makes it hard to convince an owner that theirs needs to be better. Ironically, that's also why good design can have such great competitive benefits.
Ben Hunt - 10:36 on 20 Sep 2004
Web Doctor, If your case studies are FREE then yes I would like one on the IT web site, maybe I could try to influence someone in charge of the site. If the case study is not free I don't think I would pay due to the fact IT could probably care less if there site looks like crap (yes I know that is a sad thing) but I submitted this site without there knowledge and I am not the one to make changes to the web site anyways. -DS-
David Smith - 06:02 on 22 Sep 2004
DS, yes WDFS case studies are free. Please email me direct to discuss.
Ben Hunt - 10:03 on 23 Sep 2004
Oilily as a 'Best' site? Doc, I understand grading the site based solely on layout, content and color, etc. but this site looks trashy in any other browser but Internet Explorer (which is losing ground in the browser war). How can you rate this site a 'best' when they won't even code their site to work properly in the major browsers? I'm not a purist here, but I totally disagree with your take on this one.
Jay Jones - 01:18 on 29 Sep 2004
Jay, what I love about Oilily is how product-led it is. It looks good, and it uses *content* to do that, instead of designing the non-content to within an inch of its life. And it works, admittedly in IE only. For that reason, it's a great example, but I admit it's not very well executed.
Ben Hunt - 03:03 on 29 Sep 2004
Wonder if you have checked out the new design of John Hicks site, he says it isn't quite finished, looking very good though.
paranoidandroid - 12:32 on 17 Oct 2004
Thanks paranoidandroid. I agree it's a good-looking site, but it's no longer an great example of fundamental design principles IMO.
Ben Hunt - 08:30 on 18 Oct 2004
I've implemented a new and improved layout for Best & Worst.
Ben Hunt - 06:21 on 17 Nov 2004
Hicks Design has undergone another face lift, what do you think of it?

Is it an improvement over version 2? The navigation is in a more standard place, but is it just me or does it seem awkward with the vertical text?
paranoidandroid - 11:45 on 19 Jan 2005
paranoidandroid, I like the latest hicksdesign less than the previous redesign, which I thought was a step back from where it was before. I know the last one was well received on Stylegala, and I do love Jon's logo work, but for me it doesn't work. It seems like a bunch of nice bits floating together in space.
Ben Hunt - 10:26 on 21 Jan 2005
just submitted redhatwine.com for consideration in 'best'

one of the most impressive sites I have seen for a long time
paranoidandroid - 08:04 on 25 Feb 2005
Thanks paranoidandroid. Keep 'em coming.
Ben Hunt - 09:27 on 25 Feb 2005
ferrispainting.co.uk found this site a while back, but then lost it.

Submitted for 'best'

Less is most definetly more.
paranoidandroid - 08:16 on 17 Mar 2005
Hi, I am so glad to have found your site. I teach web design at a small technical college in the States and up to now the only site I could find that even hints at a list of poorly designed sites was 'websitesthatsuck.com'. Ironic, since websitesthatsuck is utterly horrid, and unusable as a reference.

A couple of notes, it might be nice if each of the good and bad listings also included 2 dates. One for the most recent review of the site, and one for the site itself to note when it was most recently re-designed.

Interflora is also a mess for another reason. They do NO error checking on the forms. I just input a bunch of gobbledygook for the sender info, and it happily processed the junk and took me to the next page.
Duh!!
Scott Boyer - 06:17 on 24 Mar 2005
I like Basecamp so far, I've only reviewed up to Cre8asite Forums, but I'm still trying to decide if it appears too much like a search engine doorway page.

Speaking of Cre8asite Forums, the forum looks pretty much like the default skin for phpBB -maybe phpBB should get the praise?

Also, I'm proud to say I was a member of Kim and Carol's clubs at Yahoo back in the day!
JamesV - 02:54 on 05 Apr 2005
Wow some fabulous sites here. I seem drawn to the UK sites and designers all of a sudden. There is a clean easy to use feeling which is lacking from US/Canada originated sites. Thanks for the inspiration.
eSearing - 03:00 on 05 May 2005
Hi.

I must admit that I am beginning to feel a little frustrated by all those 'web design' sites and blogs.


For example:

Go on and validate www.scratchmedia.co.uk/, www.webdesignfromscratch.com/ or even this page
www.webdesignfromscratch.com/best_and_worst.htm


My question is: who are you to decide what is good and what is not if you can't even make your sites/pages HTML valid?

Thanks
Frustrated - 12:26 on 17 May 2005
Frustrated, we're talking about different areas.My Best and Worst page is a rolling collection of sites that *I* think illustrate the principles of web design. I refer to my own standards and personal preferences on this. If it works for me, or fails to work, I try to explain why.Validation is one aspect of the web production mix, but  it's totally separate to what this page is about. And importantly, a web page doesn't need to validate to succeed, and if it fails to validate it doesn't mean it fails in its own objectives. The only exception is if it claims to validate to some standard. I'm making no such claim on this web page (apart from my meta doctype of xhtml transitional).I have produced web sites to the strictest standards, where that's part of the success criteria.
Ben Hunt - 09:58 on 18 May 2005
Thanks for your answer.
Frustrated - 11:00 on 18 May 2005
cool site   it  helped me on my Home work1!!!!!

i had to find good pages and u did it!
Rom - 03:36 on 24 May 2005
awesome entry! love your eye for good design.
Myk - 06:00 on 03 Jun 2005
i really think oed.com needs new layout. its not bad the way it is but i think it needs to demonstrate what a great site it is by its look. and it doesnt seem to do that with the current design.
sazzad.iamshipon1988@gmail.com - 09:10 on 11 Jul 2005