Web Storyboard Project

Before going into actual production of a web site, it's wise to prepare one or more mock-ups or storyboards to show the client what a potential web site might look like. It will give them the opportunity to comment on color scheme and overall design before the site is actually produced. Remember, it's easy to make changes in design before you start. It's really tough after you start.

Use Fireworks to make your storyboard. Create a new image file that is 1024 x 768 pixels with a resolution of 72 ppi. Add a layer with the outline of a 780 x 438 px rectangle in the upper left portion of your image. This is the primary area of interest in your website. Many people still use monitors with 800 x 600 px screen size. The area inside the rectangle will be the visible portion of that appears on the screen. All content on the home page should fit within this rectangle. On other pages, users can be required to scroll down, but scrolling to the right is a no-no. Don't include content on any pages further than 780 px from the left margin.

Make use of layers in your storyboard to allow for quick and easy changes. The color scheme is one of the most important factors in a web site. Here are some sites with tools to make things a bit easier for those of us who are chromatically challenged.

• Color Match - Look through some suggested themes or build your own
  
• Color Schemer - Input a pricipal color and see what others will work well together
  
• Web Color Schemes - a collection of color schemes that work well together