IWA-HWG Photoshop Course. Weeks 7 & 8 Review Questions

1. Describe two ways to generate transparency using ImageReady. 
   
   First, make sure that the GIF file is designated as transparent by checking the Transparency checkbox on the Optimize palette. Then do either of the following:
   • If you have a layer that if a solid color that you want turned transparent you can achhieve this by setting the layer transparent in the Layer palette.
   • Otherwise, you can set a color transparent by using the color table by selecting the color (or colors) in the Color Table and using the Maps selected color to transparent icon at the bottom of the Color table palette. If the colors are not showing on the Color Table, you may have to click on the yellow "caution" icon to build the color table.
   
   
   
2. What is the purpose of assigning a matte color to a transparent image? 
   
   Whereas Photoshop supports all degrees (percentages) of transparency, the gif file one will make supports only two levels: transparent or not transparent. For semi-transparent pixels, the matte color will be mixed in to the level that the pixel is transparent with the understanding that the image will probably be on a web page having the same color as the matte color.  
   
   
3. Describe what is meant by the term "halo effect".
   
   If the matte color used for semi-transparent pixels (which are presumably at the edge of the image) does not match the web-page color, then the image will have the non-matching matte color surrounding the edge of the image. And especially when the matte color is lighter than the web-page color, the resulting effect is reminiscent of a halo – a glowing light around the image.  
   
   
4. Describe a simple way to create an animation. 
   
   To make a simple two frame animation follow these directions. Open a Photoshop document in ImageReady. In the Animation Palette, duplicate the frame. With the new frame selected change something in the image.  Save the two frame animation as an animated gif by going to File/Save Optimized As ... on the menu.  Open the animated gif in a browser to see the result.    
   
   
5. In what instances can you have IR automatically tween animation frames?
   
   The animation palette of ImageReady has a tween command that will automatically supply frames between two existing frames provided the frames differ only by position, opacity and layer effects.
   
   
6. How would you optimize an animation (not standard optimization tasks applied to GIFs in general, but optimization of frames in the animation)? 
   
   There are various optimaization settings on the Optimize Palette. Among other things, on finds here the kind of settings one finds when saving a Photoshop image as  gif, such as control over the Color Table. 
   
   
7. What is frame disposal? Which frame-disposal method should you generally use (Adobe's suggested setting)?
   
   If your frames contain any transparent pixels, the frame-disposal setting determine whether the previous frame will show through where the current frame is transparent (Do Not Dispose) or will the background show through (Restore To Background).  A third setting (Automatic, which is the default/recommended setting), discards the current frame if the next one has transparency.  It can help some optimaization procedures.     
   
   
8. How do you edit an existing animation frame?
   
   To edit an individual frame, select that frame by clicking its thumbnail in the Animation palette. Then edit the layer in the image that corresponds to that frame. This will then update the contents of that frame.
   
9. Describe what is meant by the term "Unifying Frames". 
   
   If one apply some change or effect to a frame (e.g. a Layer Style), it can be applied to all of the frames in the animation by using the Unifying icons. in the Layers Palette.   
   
   
10. What are slices? 
    
    Slices are parts of an image.  Dividing the image into separate pieces allows each piece to have its own individual events (mouse-over, click, etc.) Slices can also be used to allow certain images to scale with the size of an interface.    
    
    
11. What are the differences between user slices, layer-based slices and auto-slices?
    
    In a user slice, the selection is explicitly made by user of ImageReady.  In layer-based slices the selection is based on the non-trnsparent parts of layers. In auto-slices, the selection is made automatically by ImageReady based on whatever is not included in one of the previous types of slices.
    
    
12. Describe 5 ways to generate slices.
    
    
    • Select the Slice Tool from the toolbox and drag.
    • To make a Layer Slice, select the layer in the Layer palette and then go to Layer/New Layer Based Slice on the menu.
    • To make a copy of a slice place the Slice Select tool cursor inside of the slice. Then hold down the ALT key and drag the slice. Release when the new slice is in the desired loaction.
    • To change a selection (made with the Marquee Tool) into a slice, go to Select/Create Slice From Selection on the menu.
    • To change a guide (made from View/Create Guides on the menu), go to Slices/Create Slices from Guides.
    
    
    
13. How would you create a slice with boundaries that exactly encompass a small or unusually shaped object?
    
    This uses the approach above where one converts a selection into a slice. So the boundary is dealt with using the Selection tools. There seem to be more Selection options in Photoshop, so make the selection there and save it as a channel. Then you can use Select/Load Selection ... in ImageReady. Finally one can go to Select/Create SliceFrom Selection.
    
    
14. What is the advantage of linking slices/rollovers together? 
    
    Linking slices (in ImageReady) allows you to choose settings/optimaizations for all of the slices at once rather thn one-by-one.  
    
    
15. Describe two different types of rollovers.
    
    
    • One type of rollover involves two images that occupy the same position – one replacing the other. For example, one image displays for mouse-over while another displays for mouse-out.
    • A rollover can cause a change in a completely different area of the page – for instance some explanatory text may appear in an adjacent area.
    
    
    
16. How many states can a rollover have?
    
    ImageReady recognizes eight pre-defined states, most associated with a predefined mouse event (e.g. over, out, down, up, selected, click, custom, and none). Some events supersede other events, so one would never see all eight states in any one example.
    
    
17. Describe a simple way to create rollover states for an image. 
    
    Choose the slice for your rollover state using the Select Slice Tool.  Then go to the Web Content palette (If it is not showing, go to Window/Web Content on the menu).  Click on the Create rollover state icon at the bottom of the Web Content palette.  Right click on it if you want to change the event/state ImageReady provided.  With the new rollover state selected, make any changes to the image.  Repeat this procedure for as many rollover states as you desire.   
    
    
18. Where would you set options for table code and slice names when generating the code and images for rollovers?
    
    The optimization settings are on the Optimize palette (click on Windows/Optimize on the menu if you don't see this palette). There you will have choices like JPEG or GIF and associated settings like Quality or Color Table (respectively).  
    
19. Summarize the procedure for creating an image map.
    
    Bring the image to be used for the image map into ImageReady.  Use the Image Map Tool (which has Rectangle, Circle and Polygon versions) and drag to specify an area which will become "clickable." Repeat for any additional desired clickable areas. Use the Image Map Select Tool to choose one of the areas.  Go to the Image Map palette (Windows/Image Map on the menu if this palette is not showing). You can use the area's name generated by ImageReady or supply your own in the Name textbox. Supply the web site address for the link in the URL textbox. make the target _blank is you want a new browser to open. Repeat for other areas. Go to File Save Optimized As ... on the menu. Make sure the dialog box has HTML and image for the Save as Type entry. Give a file name to the generated HTML file.  The corresponding immages will be in a folder labelled Images.