Download the agency overview...
View our Agency Overview
Agency Overview

Expert Resources

Build A Website You Can Be Proud Of: Website Shopping 101

If you’re getting ready to kick off a new website project then please keep reading.  Consider this your homework before your homework. What I want to do is arm you with direction, something which your web agency is going to be asking of you in the weeks and months ahead.  Instead of being reactive, let’s be proactive! All you have to do is know how to surf the web.  That’s it.  If you know how to navigate your way using Internet Explorer, Firefox, or any other web browser (except Netscape…if you use Netscape then please stop reading), you can do this exercise.  Let’s go Website Shopping.

What Is Website Shopping?

I’m sure you’re familiar with window shopping.  You see products in a storefront and exclaim “I wish I had that.”  Of course window shopping turns into actual shopping once you purchase the product, but the idea of browsing around storefronts can be used for this exercise.

At its core, it’s really a series of pointing exercises – the purpose is to identify examples that can be leveraged for the website you are building. The goal is not to settle on one particular design or piece of functionality, rather it’s to browse these examples for your own use.  Once you’ve compiled your “website wish list,” your web agency can use it as a frame of reference and determine which of those pieces will help to optimize your website experience.

So Website Shopping Is About Finding Designs I Like?

Yes and No.

This exercise is much less about design and much more about functionality, architecture, and flow.  Design is a part of it, but the intention here is to identify the little things that make a website great.  In other words, the little things are the objects on the page that function in the manner you’re looking to achieve, or the way the website is architected that allows you to easily navigate the pages.   But, if you find a great website design you like, mark it down.  If it fits the look you are trying to achieve then it needs to be recorded for future conversation.

But back to the little things.

Any type of cool functionality, free widget, or design treatment, should be considered.  Other items to keep on the lookout for are the use of tabs, how calls to action are handled, and the ever popular expanded footer navigation (personal favorite).  These are just a few examples mind you, but all relevant to the Website Shopping exercise.

What Do You Mean Record Websites?

Now don’t go busting out the VCR just yet.  What I am referring to is recording the object on the page with a screen shot or screen grab, and then pasting it into a Word document to use as a reference later.  It’ll be like keeping a running tally or record of the many functions, widgets, and designs you may want to use for your own website.  Also, while it might be a bit time-consuming, you should write a short description about what it is you like.  This will help later on when you’re trying to explain your thoughts to a boss or co-worker.  And lastly, don’t forget the address of the website.  Your web agency will want to visit these sites first-hand, and you may want to reference them again yourself.

But How Do I Find Great Website Examples?

It would be best to start looking at your competition.  Chances are they have something on their website you would like to emulate (but never duplicate).  That slick calculator.  Their sleek ordering system.  The Web 2.0ish way they use their bread crumb navigation.  These should be looked at under a microscope to determine whether or not they would actually bring value to your website.

Once you’re done looking at your competition, try visiting the following websites for some additional ideas:

Delicious: This social bookmarking site allows you to view the most popular websites being bookmarked, and the tags or keywords people are using to describe those bookmarks.  Try searching on words like “awesome websites” or “cool websites” or “unusual websites.”  If you want to find the best, you have to use the lingo that people are using to tag these websites.  And the articles and websites you’ll find are ripe for the pickings.

Smashing Magazine: While this website is very design focused, you can still find lots of great inspiration.  It’s easy to get lost in their articles, but remember, you’re on the hunt for the little things.  Do you see any RSS Feed icons in their examples?  What about clever uses of primary navigation?  What is the latest trick to display user-generated feedback?

Koala Template:  Yes I am directing you to a website in which you can buy website templates.  But it’s really a great warehouse for sifting through some architectural ideas.  Depending on the industry you are in, you can use the navigation on the left hand side of the site to filter via category.  Before leaving the site, I would recommend checking out the Architecture, Business, and Clean Style template categories.

Web Design From Scratch: This is the personal website of Ben Hunt and a great resource for design related information.  Check out the Website Architecture and Web Design graphics section – some excellent examples are waiting to be captured.

This Seems Like a Lot of Work Before I Even Start Building My New Website.

It is.  And it isn’t.

During the web development process you will no doubt be asked, “What websites do you like – and why do you like them?”   This will be asked by your web agency, co-worker, or both.  And Website Shopping seeks to help you answer these questions more thoughtfully.  This is just like shopping for paint, carpet, or even a new outfit.  Screen-grab objects on a website you like and record your observations.  Leave it up to your web agency to bring together your thoughts through strategy, architecture, and design.  And if there are a few stumbling blocks along the way, your Website Shopping document is great to look back on for reference.

Ready.  Set.  Go Shopping!

Who doesn’t like to go shopping anyway?  This is probably the only time you won’t have to use your credit card.  Just know with all projects you undertake (website and non-website projects) the more time you dedicate in the planning phase, the more prepared you’ll be.