User Guide Cancel

Previewing web images

Search
  1. Photoshop Elements User Guide
  2. Introduction to Photoshop Elements
    1. What's new in Photoshop Elements
    2. System requirements | Photoshop Elements
    3. Workspace basics
    4. Guided mode
    5. Making photo projects
  3. Workspace and environment
    1. Get to know the Home screen
    2. Workspace basics
    3. Tools
    4. Panels and bins
    5. Open files
    6. Rulers, grids, and guides
    7. Enhanced Quick Mode
    8. File information
    9. Presets and libraries
    10. Multitouch support
    11. Scratch disks, plug-ins, and application updates
    12. Undo, redo, and cancel actions
    13. Viewing images
  4. Fixing and enhancing photos
    1. Resize images
    2. Cropping
    3. Process camera raw image files
    4. Add blur, replace colors, and clone image areas
    5. Adjust shadows and light
    6. Retouch and correct photos
    7. Sharpen photos
    8. Transforming
    9. Auto Smart Tone
    10. Recomposing
    11. Using actions to process photos
    12. Photomerge Compose
    13. Create a panorama
    14. Moving Overlays
    15. Moving Elements
  5. Adding shapes and text
    1. Add text
    2. Edit text
    3. Create shapes
    4. Editing shapes
    5. Painting overview
    6. Painting tools
    7. Set up brushes
    8. Patterns
    9. Fills and strokes
    10. Gradients
    11. Work with Asian type
  6. Guided edits, effects, and filters
    1. Guided mode
    2. Filters
    3. Guided mode Photomerge edits
    4. Guided mode Basic edits
    5. Adjustment filters
    6. Effects
    7. Guided mode Fun edits
    8. Guided mode Special edits
    9. Artistic filters
    10. Guided mode Color edits
    11. Guided mode Black & White edits
    12. Blur filters
    13. Brush Stroke filters
    14. Distort filters
    15. Other filters
    16. Noise filters
    17. Render filters
    18. Sketch filters
    19. Stylize filters
    20. Texture filters
  7. Working with colors
    1. Understanding color
    2. Set up color management
    3. Color and tonal correction basics
    4. Choose colors
    5. Adjust color, saturation, and hue
    6. Fix color casts
    7. Using image modes and color tables
    8. Color and camera raw
  8. Working with selections
    1. Make selections in Photoshop Elements
    2. Saving selections
    3. Modifying selections
    4. Move and copy selections
    5. Edit and refine selections
    6. Smooth selection edges with anti-aliasing and feathering
  9. Working with layers
    1. Create layers
    2. Edit layers
    3. Copy and arrange layers
    4. Adjustment and fill layers
    5. Clipping masks
    6. Layer masks
    7. Layer styles
    8. Opacity and blending modes
  10. Creating photo projects
    1. Project basics
    2. Making photo projects
    3. Editing photo projects
  11. Saving, printing, and sharing photos
    1. Save images
    2. Printing photos
    3. Share photos online
    4. Optimizing images
    5. Optimizing images for the JPEG format
    6. Dithering in web images
    7. Guided Edits - Share panel
    8. Previewing web images
    9. Use transparency and mattes
    10. Optimizing images for the GIF or PNG-8 format
    11. Optimizing images for the PNG-24 format
  12. Keyboard shortcuts
    1. Keys for selecting tools
    2. Keys for selecting and moving objects
    3. Keys for the Layers panel
    4. Keys for showing or hiding panels (expert mode)
    5. Keys for painting and brushes
    6. Keys for using text
    7. Keys for the Liquify filter
    8. Keys for transforming selections
    9. Keys for the Color Swatches panel
    10. Keys for the Camera Raw dialog box
    11. Keys for the Filter Gallery
    12. Keys for using blending modes
    13. Keys for viewing images (expertmode)

Preview an optimized image in a web browser

You can preview an optimized image in any web browser installed on your system. The browser preview displays the image with a caption listing the image’s file type, pixel dimensions, file size, compression specifications, and other HTML information.

  1. Open the image you want to preview.
  2. Select File > Save For Web, and apply your optimization settings.
  3. Choose a browser from the Preview In menu in the lower-right corner of the optimized image, or click the browser icon to launch your default web browser.

Add a browser to the Preview In menu

  1. Choose File > Save For Web.
  2. Click the down arrow in the Preview In menu, and choose Edit List.
  3. In the Browsers dialog box, click Find All. The dialog box displays all installed browsers.
  4. Select a browser, click Add, and then click OK.

View estimated download time

  1. Open an image and choose File > Save For Web.
  2. Choose your optimization settings.
  3. Click the triangle to the upper right of the optimized image to view the document panel menu.
  4. Choose an Internet access speed, including modem, ISDN, cable, or DSL Internet access.
  5. When you change the Internet access speed, the estimated download time displayed under the optimized image is updated. If the download time seems too long, try different optimization settings, or change the image size in the Save For Web dialog box.

Preview variations in color display

When optimizing an image for the web, consider how the image will appear on different monitors. In general, an image appears darker in Windows systems than on Mac OS systems. You can simulate cross-platform display differences in the Save For Web dialog box.

  1. Open an image and choose File > Save For Web.
  2. Choose your optimization settings.
  3. Click the triangle to the right of the optimized image to view the document panel menu.
  4. Choose a display option:

    Uncompensated Color

    Shows the image with no color adjustment (the default option).

    Standard Windows Color

    Adjusts the color to simulate a standard Windows monitor.

    Standard Macintosh Color

    Adjusts the color to simulate a standard Macintosh® monitor.

    Use Document Color Profile

    Shows image with its color profile, if one exists.

    Note:

    These preview options adjust color only in the Save For Web dialog box; they don’t change colors in the original or optimized image.

Preview an animation

You can preview an animation in the Save For Web dialog box or in a web browser. The Save For Web dialog box shows the animation as still frames. You must preview the animation in a browser to view the frames in timed sequence.

  1. Set up an animated image and choose File > Save For Web.
  2. To preview an animation from the Save For Web dialog box, do one of the following:

    • To view the next frame in the animation, click the Next Frame button.

    • To view the previous frame in the animation, click the Previous Frame button.

    • To view the last frame in the animation, click the Last Frame button.

    • To view the first frame in the animation, click the First Frame button.

  3. To preview an animation in a web browser, do the following:

    • Choose a browser from the Preview In menu below the lower-right corner of the optimized image, or click the browser icon to launch your default web browser.

    • Use your browser’s Stop, Refresh, or Reload commands to stop or replay the animation.

More like this

Adobe logo

Sign in to your account

Quick links

View all your plans Manage your plans

Legal Notices    |    Online Privacy Policy