Chapter 10. Breaking the Design Down into Manageable Chunks
Posted by wd4business on November 11, 2008
In previous chapters, Ken decided to use tables for his layout and he made a sketch of his design. As Ken looks at his design, he wonders how he can easily control the layout with one large table. There will be a lot of rows and columns, with some information spanning several columns. But, what if he breaks the page up into manageable chunks (tables).
The top part can be one table with two columns (cells). The first cell contains his business name and tag line. The second cell contains the main navigation links for the web site. So, for this table and contents, Ken only needs to use the following HTML tags — table (start a table), tr (table row), td (table definition), h1 (heading level 1), p (paragraph), and a (anchor or link).
The three column format under the top part can also be a table with one row, but with three cells. The first cell contains a drawing of a golfer, the second cell contains unique content for the web page, and the third cell has the latest news. The layout works for the home page. For the other pages, Ken will only use two cells — one with the golfer image that he will carry across all web pages and one for the unique content for that page. Since there is not a third cell for these additional pages, the second cell is wider. In addition to the HTML tags used so far, Ken just needs to use an additional tag – img (image) .
The bottom bar, with the contact information will be a table with one row and one column.
Ken finds that he doesn’t need to use a lot of complicated HTML tags to build his web pages. Ken builds a simple prototype page and gets five people that can play the role of consumers looking for custom golf clubs. He gets their input and review comments on the design. Based on those comments, he makes several improvements that will help meet his target audience wants and needs.
The next design step is to use CSS to add style to the web page. This is a fun thing to do.