Examine the design comp

Examine the design comp

Typically, you don’t begin building a website by opening Dreamweaver and laying out pages right away. The first steps to creating a website begin on a piece of paper, or in a graphics-editing application like Macromedia Fireworks. Graphic designers usually sketch out a piece of comprehensive artwork (also known as a "comp") for the website in order to show it to the client and make sure that the initial ideas for the site meet with their client’s approval.

A comp consists of any number of page elements that the client has requested for their website. For example, the client might say, "I want to have a logo at the top of the page, a navigation that links to these other pages, a section for an online store, and a place where I can insert video clips." Based on that discussion, the designer begins planning the layout of the site, and makes sketches of sample pages that fulfill the client’s requirements.

This tutorial provides you with the completed and approved comp for Cafe Townsend, a fictional restaurant that requested a website. As the web designer, it’s your job to transform the comp into a working web page (most likely with the help of other graphics designers and Flash developers).

This is a picture of the feature being described.

You’ll notice that the graphic designer provided you with a web page comp that includes a number of content areas, as well as some graphic ideas. In the next sections, you’ll use Dreamweaver to lay out this design.

You can also open the original comp file if you want to see it on the computer screen. You can find the comp, homepage-mockup.jpg, in the fireworks_assets folder of the cafe_townsend folder that you copied to your hard drive in Tutorial: Setting Up Your Site and Project Files You might even want to print out the comp so that you can refer to it as you build your page.

Getting Started with Dreamweaver
Dreamweaver Basics
Working with Dreamweaver Sites
Laying Out Pages
Adding Content to Pages
Working with Page Code
Preparing to Build Dynamic Sites
Making Pages Dynamic
Developing Applications Rapidly