3. Choose View > Snap to > Guides
Select Slice tool from the tool box.
Click and drag over the guides to create slices. Slice the top panel and left panel as per the guides.
The body area where the content will be displayed is sliced in one image since it would be deleted in Html editor and replaced by background color or image.
4. After the full layout is sliced, Click on Optimized Button (besides original in the top panel of the layout window).
Choose Windows > Optimize
Optimize window opens. Press Shift and click slices of the top panel & left panel, Set the optimize values as JPEG with quality as 55 colors.
Since the logo slice has more colors and effect as compared to the other slices, so it will be optimized with more colors. Select the logo slice and set the color value as JPEG with high quality as 65 colors.
The center image where the text will be placed can be opitmized with minimum colors as it will be deleted later.
5. The file size of the whole-optimized layout is displayed at the bottom status bar.
The entire file size of the .psd file was approximately 2.2 MB. After optimization, file size of the insidepage layout is 35 KB.
6. Choose File > Save
To preview the optimized layout in the browser
Choose File> Preview in > Internet Explorer
7. Choose File > Save Optimized As
This action converts the .psd file into .html file.
The Save Optimized Window is displayed with the options File Name, save as type and options "Save As HTML File", " Save Images" & "Save Selected Images".
By default the "Save As HTML File", "Save Images" are already checked.
Save the file with the name as inside.html
Steps to Slice, Optimize, and Convert the inside page into html is complete.
Now the page has to be made resolution compatible in 800 X 600 pixels and 1024 X 768 pixels with page linking and content incorporation in Macromedia Dreamweaver*. This is covered in further articles of Professional Steps of Web Designing.
Developer of layout galaxy web site design templates for Photoshop and Flash.
All accompanying logos, brands and product names are trademarks of their respective companies.