How to Optimize JPEG Images for Your Social Media Site - dummies

How to Optimize JPEG Images for Your Social Media Site

By Janine Warner, David LaFontaine

JPEG is a good format choice for your social media site. The JPEG format is the best choice for optimizing continuous-tone images, such as photographs and images with many colors or gradients. When you optimize a JPEG, you can make the file size smaller by applying compression. But, if you compress the image too much, the image can look terrible. The trick is finding the right balance.

If you have a digital photograph or another image that you want to prepare for the web, follow these steps to optimize and save it in Photoshop. In Photoshop Elements, Fireworks, or GIMP, the process is similar although the specific steps may vary.

  1. With the image open in Photoshop, choose File→Save for web & Devices.

  2. In the top-left corner of the dialog box, choose either the 2-Up or 4-Up tab to display multiple versions of the same image for easy comparison.

    This one opts for 2-Up, which makes it possible to view an image from iStockphoto.com of a colorful tile lizard created by Antoni Gaudí on the top, with the bottom showing a preview of the same image as it will appear with the specified settings. The 4-Up option, as the name implies, displays four different versions for comparison.

  3. On the right side of the window, just under Preset, click the small arrow to open the Optimized File Format drop-down list and choose JPEG.

  4. Set the compression quality.

    Use the preset options Low, Medium, High, Very High, or Maximum from the Compression Quality drop-down list. Or use the slider just under the Quality field (top right of the screen) to make more precise adjustments. (The slider appears when you click the arrow.) Lowering the quality reduces the file size and makes the image download more quickly.

    [Credit: cw istockphoto.com/KarSol]
    Credit: cw istockphoto.com/KarSol

    If you lower the Quality number too much, the image will look blurry and blotchy.

    Photoshop uses a compression scale of 0 to 100 for JPEGs in this dialog box, with 0 the lowest possible quality (the highest amount of compression and the smallest file size) and 100 the highest possible quality (the least amount of compression and the biggest file size). Low, Medium, and High represent quality values based on the amount of compression. The more the compression applied, the lower the image quality.

  5. Specify other settings as desired.

    The compression quality and file format are the most important settings.

  6. Click Save.

    The Save Optimized As dialog box opens.

  7. Enter a name for the image and save it to a folder on your hard drive where you will be able to quickly find it when you need it.

    Photoshop saves the optimized image as a copy of the original and leaves the original open in the main Photoshop work area.

Repeat these steps for each image you want to optimize as a JPEG.

At the bottom of the image preview in the Save for web & Devices dialog box, Photoshop includes an estimate of the time required for the image to download at the specified connection speed. The estimate is 118 seconds at 56.6 Kbps. As you adjust the compression settings, the size of the image changes and the download estimate will automatically adjust.

You can change the connection speed used to make this calculation by clicking the small arrow just to the right of the connection speed and using the drop-down list to select another option, such as 1.5 Mbps for cable/T1 modem speed. Use this estimate as a guide to help you decide how much you should optimize each image.