Chris McCuller wrote:
> I generally write my markup first, and get it looking right as far as
> how I want it to flow. Then I'll begin on the CSS, but I think I
> probably try to do too much w/ the CSS. I'll try and build the entire
> thing, piece by piece, instead of getting certain features/parts working
> how do you folks get it done?
For me, the design process starts in Photoshop and Illustrator. I
complete a full, detailed mockup of the entire page(s) that includes
dummy content and real world examples of how dynamic data might interact
with the layout. I create a complete list of hex colors from my
Photoshop pallet that will eventually make its way to my CSS and I
carefully evaluate how I can best and most efficiently convert the
design from an image to a working XHTML document.
At this point I start to consider how any dynamic page generation, CMS,
or development framework and methodology might impact my work flow and
the desired layout. These considerations will sometimes have an affect
on the overall process, but generally I tend to establish the base
layout first using basic <div>'s. Is it a two column layout with a
header and footer? Three columns with just a header? What's the desired
source order? Do I need full length columns? Is the navigation
horizontal or vertical? Will the navigation require drops? Those are the
kind of questions I tend tackle first and when I have those answered,
everything else seems to fall in place.
When I have the basic layout down, I move on to the markup contained in
each <div>; adding content, lists, headings, and paragraphs to the
navigation, sidebar, and main content <div>'s as I go. As I work through
the markup I begin giving each <div>'s content minimal, basic styling
that helps keep things within the desired layout.
Finally I fine-tune the CSS and markup adding any styling, images,
backgrounds, and colors that help to pull the final design together.
When I've got the layout and styling down, I run back over everything
several times looking for ways to trim fat from the markup and the CSS.
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/