Open an image and choose File > Save
For Web.
Last updated on
May 17, 2022
- Photoshop Elements User Guide
- Introduction to Photoshop Elements
- Workspace and environment
- Fixing and enhancing photos
- Resize images
- Cropping
- Process camera raw image files
- Add blur, replace colors, and clone image areas
- Adjust shadows and light
- Retouch and correct photos
- Sharpen photos
- Transforming
- Auto Smart Tone
- Recomposing
- Using actions to process photos
- Photomerge Compose
- Create a panorama
- Moving Overlays
- Moving Elements
- Adding shapes and text
- Quick Actions
- Guided edits, effects, and filters
- Guided mode
- Filters
- Guided mode Photomerge edits
- Guided mode Basic edits
- Adjustment filters
- Effects
- Guided mode Fun edits
- Guided mode Special edits
- Artistic filters
- Guided mode Color edits
- Guided mode Black & White edits
- Blur filters
- Brush Stroke filters
- Distort filters
- Other filters
- Noise filters
- Render filters
- Sketch filters
- Stylize filters
- Texture filters
- Pixelate filters
- Working with colors
- Working with selections
- Working with layers
- Creating photo projects
- Saving, printing, and sharing photos
- Keyboard shortcuts
- Keys for selecting tools
- Keys for selecting and moving objects
- Keys for the Layers panel
- Keys for showing or hiding panels (expert mode)
- Keys for painting and brushes
- Keys for using text
- Keys for the Liquify filter
- Keys for transforming selections
- Keys for the Color Swatches panel
- Keys for the Camera Raw dialog box
- Keys for the Filter Gallery
- Keys for using blending modes
- Keys for viewing images (expertmode)
About the GIF format
The GIF format uses 8‑bit color and efficiently compresses solid areas of color while preserving sharp details like those in line art, logos, or type. You also use the GIF format to create an animated image and preserve transparency in an image. GIF is supported by most browsers.
The GIF format uses LZW compression, which is a lossless compression method. However, because GIF files are limited to 256 colors, optimizing an original 24‑bit image as an 8‑bit GIF can subtract colors from an image.
You can choose the number of colors in a GIF image and control how colors dither in a browser. GIF supports background transparency or background matting, by which you blend the edges of the image with a web page background color.
About the PNG‑8 format
The PNG‑8 format uses 8‑bit color. Like the GIF format, PNG‑8 efficiently compresses areas of solid color while preserving sharp detail like those in line art, logos, or type.
Because PNG‑8 is not supported by all browsers, you may want to avoid this format when you are distributing the image to a wide audience.
The PNG‑8 format uses more advanced compression schemes than GIF does, and a PNG‑8 file can be 10% to 30% smaller than a GIF file of the same image, depending on the image’s color patterns. Although PNG‑8 compression is lossless, optimizing an original 24‑bit image as an 8‑bit PNG file can subtract colors from the image.
Note:
With certain images, especially those with simple patterns and few colors, GIF compression can create a smaller file than PNG‑8 compression. View optimized images in GIF and PNG‑8 format to compare file size.
As with the GIF format, you can choose the number of colors in an image and control how colors dither in a browser. The PNG‑8 format supports background transparency and background matting, by which you blend the edges of the image with a web page background color.
Optimize as GIF or PNG‑8 format
GIF is the standard format for compressing images with large areas of solid colors and crisp details like those in line art, logos, or type. Like the GIF format, PNG‑8 supports transparency and efficiently compresses areas of solid color while preserving sharp detail; however, not all web browsers can display PNG‑8 files.
-
-
Choose GIF or PNG‑8 from the optimization format menu.
-
To display an image at low resolution while the full-resolution image is downloading, select Interlaced. Interlacing can make downloading time seem shorter and gives viewers feedback that downloading is in progress.
-
Under the optimization format menu, choose a color-reduction algorithm for generating the color lookup table:
Perceptual
Creates a custom color table by giving priority to colors for which the human eye has greater sensitivity.
Selective
Creates a color table similar to the Perceptual color table, but favoring broad areas of color and the preservation of web colors. This color table usually produces images with the greatest color integrity. (Selective is the default choice.)
Adaptive
Creates a custom color table by sampling colors from the spectrum appearing most commonly in the image. For example, an image with only shades of green and blue produces a color table made primarily of greens and blues. Most images concentrate colors in particular areas of the spectrum.
Restrictive (Web)
Uses the standard, 216‑color, web‑safe color table common to the 8‑bit (256‑color) panels of Windows and Mac OS. This option ensures that no browser dither is applied to colors when the image is displayed using 8‑bit color. If your image has fewer than 216 colors, unused colors are removed from the table.
-
To specify the maximum number of colors in the color panel, select a number from the Colors menu, enter a value in the text box, or click the arrows to change the number of colors. If the image contains fewer colors than the panel, the color table reflects the smaller number of colors in the image.
-
If you chose Restrictive (Web) for the color-reduction algorithm, you can choose Auto from the Colors menu. Choose Auto if you want Photoshop Elements to determine the optimal number of colors in the color table based on the frequency of colors in the image.
-
Choose a dithering percentage, either by entering a percentage in the Dither text box or by clicking the Dither menu arrow and dragging the slider that appears.
-
If the image contains transparency, select Transparency to preserve transparent pixels; deselect Transparency to fill fully and partially transparent pixels with the matte color.
-
To create an animated GIF, select Animate.
-
To save your optimized image, click OK. In the Save Optimized As dialog box, type a filename, and click Save.
Create an animated GIF
-
Place the images you want to appear in each frame of the animation on separate layers of the Layers panel. For example, to create an animation of an eye blinking, you would place an image of the open eye on one layer, and an image of the closed eye on another layer.
-
Choose File > Save for Web.Note:
If your image has multiple layers, you can also open the Save For Web dialog box from the Save As dialog box by choosing CompuServe GIF Format and selecting Layers As Frames.
-
Optimize the image in GIF format.
-
Select Animate.
-
Set additional options in the Animation section of the dialog box:
Looping Options
Continuously repeat the animation in a web browser, or animate only once. You can also choose Other to specify the number of times the animation must loop.
Frame Delay
Specifies the number of seconds that each frame is displayed in a web browser. Use a decimal value to specify fractions of a second. For example, use .5 to specify half a second.
Adobe MAX
The Creativity Conference
Oct 14–16 Miami Beach and online
Adobe MAX
The Creativity Conference
Oct 14–16 Miami Beach and online