The Five Steps for Building a Web Site [con't]
Step 3: Prototyping
Until now, you haven't written a single line of code. The client must be getting anxious about when they will see the first pages. At the end of this step, you will show them something in the browserbut not what they are expecting. They will want to see the design first. You will show them a prototype site instead.
A prototype site is a fully functional site with all pages containing the necessary content. If the site has a navigation, it must figure somewhere on the prototype pages. The "Contact Us" form must be wired up to send the data by mail to the required address.
But how is this different from the final site?
Step 4: Designing
Looking at the prototype, the designer knows the site structure and what goes on every page. In Step 1, you defined the target audience and the purpose of the web site. These are vital input for the designer. She now has most of the input that she needs. In a few days, she will come up with two or three template designs for the site. At the end of a few sessions with the client, one of the designs is chosen.
Remember, the designer doesn't design in HTML. She will use Photoshop or a similar application. She will provide one template for each type of page.
Step 5: "HTMLize" the Design
After building the HTML templates, test them on various browsers. You are bound to be confronted by browser issues. The earlier you fix them, the less you will need to replicate the corrections.
Once the HTML template pages are ready and tested across browsers, you can replicate the prototype pages with the new design. While replicating, use inclusions judiciously. You can include common chunks of code such as headers and footers. This reduces code on each page and makes the entire web site code base more manageable.
That's it! You have gone from the idea of a web site to building one in five steps. If you are interested in digging a bit deeper, you might want to read up about the following topics.