313 Lesson 12, Creating Images for Web and Video
12
4 Select the Preview in default browser button at the bottom of the Save For Web &
Devices dialog box. If you have a default browser installed, your image is opened on a browser page. You can also defi ne a browser using the Preview the optimized image drop-down menu.
Notice that the slices are not apparent and that the code is visible in your preview.
Preview the optimized image in a browser.
5 Click on the slices that you designated as having URLs. You should be connected to the assigned URLs. Use the Back button in your browser to return to your sliced image.
Close the browser window when you are fi nished testing the image. The Save For Web
& Devices Dialog box is still open.
6 Choose Save, and the Save Optimized As dialog box appears. Browse to the ps12lessons folder and choose HTML and Images from the Save as type (Windows) or Format (Mac OS) drop-down menu. Press Save.
An HTML page, along with the sliced images, is saved in your ps12lessons folder. You can now open the fi le in Dreamweaver, or any other web editing program, and continue building the page, or copy and paste the table to another page.
7 Choose File > Save to save your original image. Choose File > Close to close the fi le.
Saving fi les for video
If you are saving into Adobe applications such as After Eff ects, Premiere, or Flash, you do not need to take extra steps to maintain transparency. In fact, you can simply browse, search, and organize native .psd images directly in Adobe Bridge from the other Adobe Creative Suite applications.
When importing into a non-Adobe video application, you need to consider transparency. Each video application has its own set of importable formats. For this lesson, you will open a pre- built fi le and save it as a TIFF with an alpha channel. Video editing applications recognize alpha channels when defi ning transparent areas on an image.
PSCS4.indb 313
PSCS4.indb 313 9/17/2008 2:49:23 PM9/17/2008 2:49:23 PM
314
Saving files for video
Adobe Photoshop CS4 Digital Classroom
12
1 Open the fi le ps1202.psd. The image that appears is intended to overlay a video fi le.
An image with transparency applied to it.
2 If the Layers panel is not visible, choose Window > Layers to open the Layers panel.
3 Position your cursor over the vector mask on the Shape 1 layer. Hold down the Ctrl (Windows) or Command (Mac OS) key and click on the vector thumbnail for the Rectangle Shape layer. This selects everything on that layer that is not transparent.
Ctrl/Command+click to make a selection from a layer’s contents.
4 Click and hold the Ctrl+Shift (Windows) or Command+Shift (Mac OS) keys, and click on the layer thumbnail for the layer named balloon. This adds the balloon layer to the selection.
5 Choose Window > Channels to open the Channels panel.
PSCS4.indb 314
PSCS4.indb 314 9/17/2008 2:49:24 PM9/17/2008 2:49:24 PM
Creating animation
315 Lesson 12, Creating Images for Web and Video
12
6 Press the Save Selection as channel button ( ) at the bottom of the Channels panel. This creates an alpha channel from the active selection.
Create an alpha channel from the selection.
In your alpha channel, the areas that are black are fully transparent, the areas that are white are fully opaque, and any areas that are gray will be varying degrees of transparency. This is the standard way that video editing applications treat alpha channels.
7 Choose File > Save As. When the Save As dialog box appears, navigate to the ps12lessons folder and type ps1202_work.psd into the Name text fi eld. Select TIFF from the Format drop-down menu.
8 In the Save Options fi eld, make sure that Layers is not checked and Alpha Channels is checked. A warning stating that this image needs to be saved as a copy appears, which means that your original fi le will keep layers intact. Press Save. The TIFF Options dialog box appears.
9 In the TIFF Options dialog box, make sure that None is selected in the Image Compression section and leave other settings at their default settings. Select OK in the TIFF Options window. You have saved a TIFF fi le with an area that will appear transparent in your video editing application.
10 Close the original Photoshop document by choosing File > Close. If asked if you would like to save the changes, choose Don’t Save.
PSCS4.indb 315
PSCS4.indb 315 9/17/2008 2:49:25 PM9/17/2008 2:49:25 PM
316