The first step in building a web site is deciding what your content will be. From there, you must determine what design you will use. This leads to figuring out the best layout, appropriate graphics, and other sticky add-ons.
Think in Metaphors
Design and layout are intimately linked, but before you figure out how you will arrange everything, figure out the design effect you want. The easiest way to do this is to think of a metaphor. Ponder what your content scope is. What metaphors come to mind? Think in pictures and in words. For instance, one site I recently built, Forecast Advisors offers the services of several business gurus in Maryland. An immediate metaphor to use would be business charts and a globe to symbolize global access. But the company administration liked the idea and stability of a "four seasons" metaphor. I created a Flash introduction and animated graphic that illustrated the four seasons literally in the changing leaves of a deciduous tree. This four seasons image became the metaphor that shaped the design, colors and graphics used on the site. Another great example of the metaphoric approach can be seen at the highly respected site, The Beeline. Check out how they used the metaphor of a beehive to design their site.
Thinking in metaphors requires both sides of your brain. You need to sit back, relax and just allow your mind to reflect on your content. Think about your audience too. What would fittingly make your readers instantly think of your content, your product or your service? If you have an art site, you´d likely think of images that represent creation, expression, visuals, harnessing the muses, eurekas and tapping the soul. A health site might bring up images of beautiful bodies, balance, wholeness, treatments, fixing things, building, connecting or caring. And so on.
Making the Metaphor Visible
Once you have decided what your metaphoric image will be, you can begin to plan. Does it make you think of cool or warm colors? Softness or crisp lines? What kind of images come to mind? What style of lettering (font) would suit the mood of your metaphor? Would it be better to use a columns based "we mean business" layout or a soft colorful soulful approach. Does your metaphor suggest movement? Is animation needed to bring it to life? Everything in your site comes from the metaphor. Design. Layout. Graphics. Navigation. It´s what gives you an unique website identity.
A great article on Symbolism is available at Webpage Design for Designers to help you to develop your skill in imagining metaphors and symbolic examples of your content. Another helpful article featured on the Design Formation site shares how design research must look at the inherent metaphor that infuses any design, by exploring the roles, limitations, and benefits of metaphors used in the design process. An interesting study by Elissa Smilowitz on Do Metaphors Make Web Browsers Easier to Use? explores the effect of metaphors on web users.
Philosophe.com offers sage advice in the article A thoughtful approach to web site quality.
Metaphors & Schemas in Design. They advise going for fresh unique metaphors, especially when designing sites for child viewers. Likewise, WebMutant.com outlines the process of weaving your metaphor into a quality, user-friendly site. Dr. Richard Miller adds an academic view of metaphor use in design in his paper, Web Interface Design: Learning from Our Past.
Give this part of your web design the time it deserves. Don´t rush it. You´ll find that once you´ve come up with a metaphor that inspires and excites you, the rest will slowly but surely fall into place. Remember, it´s whole brain thinking that will brew up the best metaphor for your site. So kick back and relax, grab a pen and a pad of paper and let the ideas flow.