- Create a new/blank document
Choose File > New (Ctrl-N/Cmd-N)
Enter a custom width and height values (width 960px and height 800px) - Show rulers
Choose View > Rulers (Ctrl-R/Cmd-R)
(It displays on the top and the left side of the document window) - Pull ruler guides to four corners of the document canvas
Place cursor on horizontal ruler, click and pull down to the canvas
Place cursor on vertical ruler, click and pull right to the canvas
- Extend Canvas (This represents the <body>)
Choose Image > Canvas Size
Change width to 1360px
- Pull ruler guides to specific areas to represent different sections (<div>) of the page. (#header, #nav, #content, #footer)
Resouces
Design and Code Your First Website in Easy to Understand Steps
From PSD to HTML: Building a Set of Website Designs Step by Step
Tutorial: how-to code your PSD into a HTML-CSS layout
Design Rules for PSD to HTML