Share this Page URL

Chapter 23. Web/ImageReady > Slicing - Pg. 746

Web/ImageReady This is a hybrid image: It contains both continuous-tone imagery and flat -color areas. 746 Slicing Slicing is a process by which an image is divided into distinct zones. One purpose for slicing an image (especially a large one) is to enable it to download faster. A group of small slices will download more quickly than the whole, large image will. The browser assembles the slices into the overall image in sequence using HTML tables and frames. There are three types of slices : All three types of slices can be combined in the same image. Every document starts out with a default auto slice that is the size of the entire image. It has a light gray label and is numbered "01." · Slices created using the Slice tool are called user slices (this page, and next). · Layer-based slices (page 463) resize automatically to include all visible pixels within the currently selected layer. · Whatever's left of the image after you've created user slices and/or layer-based slices, Image- Ready will divide into auto slices. Auto slices have gray labels. Slices can be created, selected, edited, and displayed in Photoshop or ImageReady, but we prefer to use ImageReady, since it offers more options for slicing. To show the Slice palette in ImageReady, choose Window > Slice or click the Palette toggle button on the Slice Select tool options bar. In Photoshop, click Slice Options on the Slice Select tool options bar to view the Slice Options dialog box. Behind the scenes In HTML, a table can be used as a grid system to control the layout of graphics and text on a Web page. Table cells can be coded to display separate images and data or portions of a large, sliced graphic. Frames function like separate windows within the larger browser window. A frame can display an HTML graphic, page, or site independently from the other frames on the same Web page. To learn more about HTML tables and frames, see: Designing Web Graphics 3: How to Prepare Images and Media for the Web (New Riders Publishing) or Creative HTML Design 2: A Hands-on Web Design Tutorial (Pearson Education), both by Lynda Weinman HTML 4 for the World Wide Web: Visual QuickStart Guide (4th edition) by Elizabeth Castro (Peachpit Press) HTML & XHTML: The Definitive Guide by Chuck Musciano and Bill Kennedy (O'Reilly & Associates) To slice an image using a command: 1. In an image that contains just the default single slice, choose Slices (or right-click/Ctrl-click) > Promote to User Slice, then choose Slices > Divide Slice. Check Preview.