Web Design Is Not Just Visual Design
At the Voices that Matter Conference in San Francisco in October 2007, I heard several designers ask if this structure-driven approach could work for them, as they always start from the visual design of the page and then build from there. First, I think the structural and presentational aspects of the design can develop together, but when coding begins, the structure has to lead, as it’s the framework on which the presentation hangs. So I think it’s fi ne, and even desirable, to have a visual design in front of you as you start to code. Often, I will take a printout of the page design, and start drawing the boxes that represent divs around the elements, grouping related areas of content together. I will give each of those boxes a name that I will later use as a div ID. If you do this, you can treat those boxes as the basis of your wireframe, then you can lead with the structure and let the visual design be added in as you develop the page’s markup.