This step is very straightforward, you take your PSD mockup and code it into HTML.

A few things to note:

• for me it’s easier to add some creative elements like styling of links, borders, size adjustments directly in HTML (instead of designing it pixel-perfect in PSD)
• drop shadows are now easy! yes!

   .shadow {
   -moz-box-shadow: 2px 2px 5px 2px #ccc;
   -webkit-box-shadow: 2px 2px 5px 2px #ccc;
   box-shadow: 2px 2px 5px 2px #ccc;
   }
  

• to make your container elements stretch the full height of the page, use this (I always need to re-google it):

   min-height:100%; overflow:hidden
  

• I initially code all styles inside the HTML page and then once they are done, move them into CSS file(s)
• there’s a neat “lorem ipsum” text generator for Mac, called Little Ipsum
• I hand code everything in Coda

Now it’s starting to look good!

Here’s a link to the simple coded HTML, zipped (not 100% perfect).

Next step: moving your code into WordPress templates and creating your theme