Photoshop7.0 webpage Image Storage

Photoshop7.0 webpage Image Storage

Photoshop7.0 constantly adds new functions to the tool group to meet the increasing requirements of designers, and uses the most effective method to deal with a wide range of image processing work. We have introduced tools such as "pattern generator" and "repair brush". photoshop7.0 also enhances the web page function, the new webpage image storage allows us to select one or more colors on the image. Press the remove key to remove these colors from the image, so that the webpage elements can be quickly transparent. Using the webpage image storage function in photoshop7.0 and image_ready7.0, we can achieve the transparent color mixing effect (dithered) on the image, remap the corresponding transparent color (remap), and process the transparent color (dithered transparency ). Open photoshop7.0, import an image in the workspace, and select Save for web under the File menu. The page storage dialog box is displayed. Figure 1 In the webpage storage dialog box, we can select the optimal image effect and Preview It. Figure 2 On the left is the tool option, in the middle is the preview area, and on the right is the color processing option. The Toolbox on the left includes: mobile tool, slicing tool, magnifiers tool, droppers color selection tool, and slicing display tool. Slice select tool: You can select a processing area for images that have been cut into the image for transparent processing. We used the slice selection tool to select the intermediate area (03) on the image that has been cut as the processing object. Figure 3 Toggle slices visibility ): in the dialog box, you can show and hide all the stars. What kind of tricks do you have? /P> Eyedroppor tool: You can directly click the selected color in the color to be removed from the image, and then press the Remove button to remove the color. The preview area in the middle has several options, including several columns to preview the image, and an extended menu button. Figure 4 If we select "Hide auto slices" in the extended menu to automatically hide the slice, we will only see the selected slice in the preview area (4 ). The image display ratio option is shown below, and the page is previewed in the browser. Figure 5 Previewing a webpage in a browser not only displays the file size and other information of the processed image, but also the webpageSource codeIt is displayed at the same time. Sat. Figure 6 The right side is the parameter for setting the image transparency. In the settings drop-down menu, you can select an image format and color pixel. Figure 7 In Figure 7, "1" selects the file format, "2" File compression operation menu, "3" mixed color operation menu, "4" transparent mixed color operation menu, and "5" extended function menu. If you select "GIF 128 ditrhered" in settings, the corresponding parameter settings options will be displayed, and 128 colors will appear in the "color table" below, we can delete some of these colors to make them transparent. "Lossy" is the degree of loss of processing images. The larger the value, the worse the image effect (only for GIF format ). "Matte" edge harmonic, select a color to make the transparent image and it fusion. Let's take a look at the comparison below. Figure 8 "Transparency"Option is the most important option for processing the transparent image effect. We can use it to produce a transparent mixed color effect, so that the webpage image can be perfectly integrated with any background, even the pattern background, we do not need to select the color used for edge blending (Matte) in advance. In the drop-down menu, there are four transparency dither (transparent jitter) Options: No (none), diffusion (diffusion), pattern, and noise. Figure 9 is an important tool for making transparent images. In the "color table" color table, we select the color to be removed and press the first button to remove the color. Figure 9 Effect 10: text and images are elements on two layers, but the color can be removed together. Other buttons can be used to lock colors, add colors, and delete colors. Figure 10 The above functions are also applicable to the "optimize" (optimization) panel in image_ready. In addition, click the up and down arrow next to "optimize" and click the Panel to expand a layer, you can open all the function options of the Panel at multiple points. The down arrow on the right saves the result of the optimization panel parameter settings. Figure 11 After learning about the basic operations of the webpage image storage function, let's take a look at its practical application. We need to process such an image as a transparent image and embed it into a webpage. Figure 12 Import this image in photoshop7.0, open the "storage as webpage format" dialog box, select "GIF 128 ditrhered" in "Settings", and set "setings) select "GIF 128 ditrhered", and the "color table" contains 128 colors, with a small hole in the center of the color, which is used to make the image background transparent. Select it and press the delete button to make the image transparent. Figure 13 The effect of the image change is 14th. At last, the image is saved in HTML webpage and image _ format. Photoshop automatically generates an HTML file and an image _ folder, which contains the image in the image _ folder. Figure 14 Change the background color of the webpage to see the actual effect. Through this articleArticleWe understand the basic principles and functions of Web image storage, and will greatly reduce the workload when processing transparent images in the future.ProgramWhen using Photoshop to create a webpage, you can better process the image and obtain the optimal image.