18 months after my previous Top 10 list, here’s an update.
In 2010, I’m finding more sites with designs that I really love, that I find inspiring, that make me smile… But that won’t get them into this list.
I know that the purpose of a web site is to generate action – and to do that it needs to do more than just impress. It needs to communicate with visitors, identify with them, speak to them both emotionally and with information.
I think this list of 10 sites achieve that balance really well.
You may not agree with me, and that’s fine. You have your own criteria. I see myself as a marketer first, and a web designer second. I’m looking for sites that will really work commercially, not just get my designer juices flowing. Sites that will make money for the clients who paid for them and the designer who created them.
My Top 10 Web Designs of 2010
In no particular order…
I’m a huge fan of Brian Johnson’s Philosopher’s Notes site. Brian condenses the world’s great self-help and wisdom teachings into easy-to-digest audio books. He also has his own book (which you can preorder here).
The site is clean, letting the content really stand out. It makes really good use of imagery, and the compact copy conveys bags of personality.
There are also clear and bold calls to action, which means this site will also sell product. The free offer is a great way to build a list (but Brian, you need to use that list more, I never hear from you).
How do you sell a product that’s so original that nobody’s looking for it? Bolwell is an Australian company with a varied history making anything and everything out of fibreglass, carbonfibre and composite plastics, including some rather sexy sports cars.
When they decided to make an off-road caravan, they did it in style. This tow-along unit is entirely bonded out of space-age materials, incredibly strong, practical and light.
Plus, it looks sexy as hell. So when you’ve got a product that looks that good, you do what these guys did and take some incredible photographs taken.
Our team actually worked on building this web site, but when you’ve got such great raw materials, the pages pretty much design themselves. It’s clean, packed with benefits, easy to read, and it lets the product stand out.
I came across this site during the summer, looking for a family camping trip. I was very impressed.
The Sussex Tipis site engaged me straightaway. The design does a great job of combining folksy style with a clean, grid-based layout.
What really stands out for me is the photography. Where most tipi sites show you tiny pictures of tipis from a distance, this site actually gives you a feel of what it’s like to stay in their tipis.
The photography is colourful and interesting, and does a great job of immersing you in the experience. I just didn’t want to spend too long on any of the other sites I looked at.
The only thing I would change would be to vary the text size. Adding bigger headings would make the text easier to scan.
This e-commerce/marketing site hits you on every page with clear products and their benefits.
Again, it’s clean, making the content the focus. The product shots are rich and colourful, with a nice cross-fader to show the range of what’s on offer.
I also appreciate the way the product photos are zoomed-in, filling the space with valuable content, combined with a consistent angle to add dynamism and interest.
One thing I would change immediately is the green link text colour. Although it matches the brand colours, it lacks contrast and is not as easy to read as it could be.
Read Dan’s more in-depth review of 37signals.com.
Recently redesigned, the 37Signals site continues to be a leading example of forthright branding.
It’s a very light site, which expects people to scroll (now we have mouse wheels, we scroll more). You can’t focus on anything other than the content… because there isn’t anything else!
It makes great use of type, in proper black-on-white for maximum readability.
The company’s personality shines out. You’ve just got to like them (or not like them, but at least it makes you choose).
This is a great example of “getability”. When people come to this site, they usually want to pay for their TV license, so it makes that action easy to find.
The reason this site is on my Top 10 list is that I turned up one day to buy a TV license, and about 2 minutes later I had completed the process with barely a thought having to go through my head. Is was one of the smoothest and most pleasant e-commerce experiences I’ve ever had. That’s good design!
You may think there are no prizes for making what should be obvious obvious… except that you get more happy users, and more profit!
I would suggest a couple of improvements. The text goes lime green on hover. Erk? That’s got to be bad for accessibility. If you have impaired vision, the links could disappear!
Also, the bold colour/contrast change and diagonal texture on the footer draw the eye too much. A plainer footer would make it even easier to focus on the content.
The only Flash site in this list, but it still follows excellent “Save the Pixel” principles.
The navigation choices have been kept to a minimum, and they’re totally obvious. The content has plenty of personality, communicating emotionally and making good use of subtle humour.
If you’re in the target market for what these guys do, you’ll know it! If you aren’t, so what?
This is probably the most complex home page in this group, but the content is interesting enough that you don’t mind having a look around.
It’s a clever twist to make the bike (not the rider) the hero of the piece. The little gimmicks are actually interesting, which helps you feel involved, and the more involved you feel, the more likely you are to support the effort.
I’d probably add an arrow from the headline to the bike. Also, the body text in white over a grey textured background isn’t the easiest to read. It could afford to be bigger.
Giles Revell is a London-based artist. The site focuses 100% on his work.
This portfolio really appealed to me. If you’re going to be drawn in, you will be, because the focus of the site (the work) totally fills your vision and takes all your attention.
Still, the brand isn’t lost. There’s a clear logo, reminding you who did it. There’s nothing too fancy, just letting the content do the work – something a lot of sites could learn from.
This is the web site of a magazine that is given out on BMI flights. The home page does a great job of grabbing your attention, which means you’ll be more likely to find out more about what the carrier offers – or at least think favourably about the brand.
Again, we’ve got good photography, so it fills plenty of space, but not stuffed so that you can’t focus on the words. When you have great imagery, you don’t need to decorate the container.
The text content is also very effective with clear headings, good copywriting, creating plenty of chances to draw you in.
How You Can Master Professional Web Skills
Warning: include(/home/scratchthis/public_html/includes/footer-promo-pwda.php): failed to open stream: No such file or directory in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25
Warning: include(): Failed opening '/home/scratchthis/public_html/includes/footer-promo-pwda.php' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25
Warning: include(/home/scratchthis/public_html/includes/footer-promo-stp.php): failed to open stream: No such file or directory in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25
Warning: include(): Failed opening '/home/scratchthis/public_html/includes/footer-promo-stp.php' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25
Warning: include(/home/scratchthis/public_html/includes/footer-promo-seofs.php): failed to open stream: No such file or directory in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25
Warning: include(): Failed opening '/home/scratchthis/public_html/includes/footer-promo-seofs.php' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/scratchthis/public_html/wp-content/plugins/include-me/plugin.php on line 25