Video tutorial:Web Design Using Photoshop slicing page

Using photoshop to create page layout's look and feel then slice it.
Note:  open a new file with background transparency,from

1. file menu--> place to place all the image element to put each element in layer on the canvas. (drag the corner of image to resize; then click on move tool to move the object) 
2. After place all the elements, file-->merge down to preserver its transparency, 
3. then use slice tool from the tool bar (newer version photoshop is grouped within crop tool) to slice and create the block of layout place holder.
4. from menu file-->save for web and device, save as a html file plus a image folder
5. open with Dreamweaver, delete image text and replace it with text filler http://www.lipsum.com/
6. create a style sheet and new rules or copy from other CSS file and 
7. link from html page to CSS style sheet and edit it from CSS panel on Dreamweaver

http://webdesign.tutsplus.com/tutorials/complete-websites/basics-create-a-clean-magazine-blog-theme-day2-slicing-and-markup/