Web Design for Graphic Designers II

 

Last Updated
01.21.2004

Projects

Dreamweaver Page Layout

Assignment ::
Using the provided layout grids and specifications, recreate each grid design in HTML using Dreamweaver. In addition, create a third grid design from scratch. The design of this layout grid is entirely up to you.

For this project, use Dreamweaver's Layout View (View > Table View > Layout View, or select Layout > Layout View from the Insert Panel), to create the basic layout structure represented in the handout. Apply cell formatting as specified, including cell alignment, background color (Bg), height and width. Do not worry about the appearance of type in the layout.

Be sure to preview your page in a Web browser (File > Preview in Browser, F12). The final HTML layout should look reasonably similar to the original grid layout.

This project is due at the beginning of class on January 28th.

Resources ::

  • GIF snapshots (layout_one.gif & layout_two.gif) and PDF versions (layout_one.pdf & layout_two.pdf) of the grid layout are available for reference.
  • Lorem Ipsum (text file) text can be used in the layout cells where text is necessary.
  • For additional information on Dreamweaver's Layout View, read Dreamweaver H•O•T Chapter 8 (pages 258-265, 284-297).

Requirements ::
A total of three layouts are due: Two based on the specifications as defined by the instructor, and one based on your own creativity. For each layout, ensure that all layout grid components are included and correctly positioned, HTML layout grids match the specifications of the provided grids, files looks reasonably similar to the original grid layout when viewed in a Web browser, document created in HTML, named appropriately for use on the Web, and copied to the Data drive at the beginning of class. (40 points)

top

Home | Syllabus | Calendar | Projects | Good Stuff | References