Operation Manual
358
Web graphics
Last updated 9/13/2015
Background matting, supported by the GIF, PNG, and JPEG formats, simulates transparency by filling or blending
transparent pixels with a matte color that matches the web page background. Background matting works best if the web
page background is a solid color and if you know what that color is.
To create background transparency or background matting in the optimized image, you must start with an image that
c
ontains transparency. You can create transparency when you create a new layer or use the Background Eraser or Magic
Eraser.
When working with GIF or PNG-8 files, you can create hard-
edged transparency: all pixels that are more than 50%
transparent in the original image are fully transparent in the optimized image, and all pixels that are more than 50%
opaque in the original image are fully opaque in the optimized image. Use hard-edged transparency when you don’t
know the background color of a web page, or when the web page background contains a texture or pattern. However,
keep in mind that hard-edged transparency can cause jagged edges in the image.
Preserve background transparency in a GIF or PNG image
GIF and PNG-8 formats support one level of transparency—pixels can be fully transparent or fully opaque, but not
partially transparent. (By contrast, PNG-24 format supports multilevel transparency; that is, you can have up to 256
degrees of transparency in an image, ranging from opaque to completely transparent.)
1 Open or create an image that contains transparency, and choose File > Save For Web.
2 In the Save For Web dialog box, select GIF, PNG-8, or PNG-24 as the optimization format.
3 Select Transparency.
4 For the GIF and PNG-8 formats, specify how to treat partially transparent pixels in the original image. You can blend
these pixels with a matte color, or you can create hard-edged transparency.
Create a matted GIF or PNG image
When you know the background color of the web page on which an image will be displayed, you can use the matting
feature to fill or blend transparent pixels with a matte color that matches the web page background.
1 Open or create an image that contains transparency, and choose File > Save For Web.
2 In the Save For Web dialog box, select GIF, PNG-8, or PNG-24 as the optimization format.
3 For GIF and PNG-8 format, do one of the following:
• To keep fully transparent pixels transparent, and blend partially transparent pixels with the matte color, select
Transparency. This option prevents the halo effect you see when you place an anti-aliased image on a web page
background that differs from the image background. This option also prevents the jagged edges of hard-edged
transparency.
• To fill transparent pixels with the matte color and blend partially transparent pixels with the matte color, deselect
Transparency.