| |
Web pages with Photoshop |
|
| |
|
|
|
| Introduction |
| |
|
| Photoshop provides tools for creating and manipulating static images for use on the Web. You can divide an image into slices, add links and HTML text, optimize the slices, and save the image as a Web page. |
| |
| The graphics tools and features in Photoshop simplify most Web design tasks: |
| |
| Page design |
| |
| Photoshop preset document sizes for pages and banners, grids, guidelines, and smart guides simplify page layout. Photoshop lets you add content to layouts using the text, drawing, and painting tools. In Photoshop, you can arrange and align content using layers, layer sets, and grouped layers. To experiment with different page compositions or to export variations of a page, use the Layer Comps palette. |
| |
|
| |
|
| Slices |
| |
| When your page composition is ready for output to the Web, Photoshop provides the Slice tool to let you divide page layouts or complex graphics into areas and specify independent compression settings (and smaller file sizes). |
| |
 |
| |
| Rollovers |
| |
| The Web Content palette in Photoshop enables you to track slices and their rollover states. For example, you can create a button for a Web page that glows whenever the user moves the pointer over it, and you can manage the button states and activities in those states. |
| |
|
| |
| Animations |
| |
| For creating simple Web animations, Photoshop provides the Animation palette, giving you the ability to determine, frame by frame, the appearance of an animation that can be exported as an animated GIF or SWF file. You can create animation in conjunction with sets of slices, nested tables, percentage width tables, and remote rollovers, where you mouse over one image and a different image changes. |
| |
| |
| |
| Export and image optimization |
| |
| When your page or graphic is ready for final export, the Save For Web dialog in Photoshop and the Optimization palette in Photoshop enables you to precisely determine how the page or graphic should be exported. Additionally, you can export an HTML file with the actual images. This text file instructs a browser how to properly display exported images and rollover effects. |
| |
| |
| |
|