1:00 am MST: I actually love staying up late at night; the house is quiet, the orange cat sleeps at my feet for company, Facebook goes wacky, the internet goes down…what? There’s a red light on my internet modem. Oh crap. I’ll think about that later.

There’s still more to do before the fun part of the design comes in. I start by pulling and unformatting the copy from the client’s old site, from one main page, deleting all the hard returns and soft returns, the italics and the bolds. I use TextEdit on the mac.

Next I’ve got to do some math to think about creating a table for the grid template. I know that the CSS, the font styling part of CSS anyway, can be done inline on the page for a mockup; later I can export it as a style sheet.

The outer box is a container that will hold the header, the footer and the main content. main content is divided into 2 columns: left column (mostly text) is 200 pixels, right column is 560, each picture 160. I’ll but a table inside the right column to hold the products on the grid page and a large photo with thumbnails on the item page.

Now that I know what I want, I need to start building. I look at my recent projects and none of them are carrying exactly this configuration of CSS and tables. I start the CSS code and am too tired to make it work properly, my momentary lapsing into Zs makes me forget crucial keystrokes like ; and /.

I mess with a pre-made Dreamweaver template, but they are only using CSS for the font styling and a long column on the left with a 4-row, 3-column table never works right, the width of the columns changing with new text. (I’m using an old version of DW; certainly they have updated it by now?)

Finally, around 1:45 am, I begin searching the Web for CSS templates. I figure that if I don’t find anything, I can always do the design in Photoshop, save the pages as jpegs and use image map to overlay the navigation. In fact, this is what I usually give a client as an intermediary step. But I find a template that has a structure I can strip and rebuild rather quickly. It is all CSS and although the main content will expand its shape, it still feels more like a website than a blog.

Next step: tinkering, adding content.

. . . . . . . . . . . . . . . . . . . . . .

Find some great free css templates at Free-css.com.