I like my way of doing things:
- Photoshop (or other image editor) to create a visual design im happy with. When I'm done with most of it, proceed to 2. This includes at least basic shapes, colors, fonts, positions and sizes. It might also contain example content with proper visual styling.
- Write very basic markup: A header element, a content area, basic navigation, footer, sidebars etc.
- Write basic CSS and apply the most general images from the Photoshop file (for Faux columns or other "big things").
- Write more markup: Add more detail. Add example content to see how every type of element you need will look.
- (If applicable) Again, enter your image editor and get more detail imagery.
- Write more CSS - style what you wrote in 4. and what you pulled out of your image file in 5.
- Iterate through 4-6 until you're done.
After the layout and visual design is more or less done, start integrating your CMS, Blog Engine or whatever you might want behind it all.
This works pretty well for me. I might not always finish all the details in Photoshop before I continue to write markup or CSS, but generally this is what I do. My recommendation is to start at the general level, and move to more detail as you go.
You might have ideas about how details in your page look. If so, create them early in full detail. Otherwise you'll just forget it. Then build more general things around it, and continue as you normally would.