These instructions are for how to reduce image file sizes for faster load times on websites and mobile apps.

Step-by-step guide

  1. In any version of Photoshop, use the “Save for Web” or "Export" function instead of “Save” or “Save As”. Image quality can be incrementally reduced in the “Save for Web” menu if necessary.
    1. For PNGs, save the image as PNG-8 in the “Save for Web” menu instead of PNG-24, or select “Smaller File (8-bit)” in Photoshop CC’s “Export” menu if the image content is simple enough that it doesn’t need more bits to display more detail.
    2. Even if the image has only 1 colour, saving as an indexed file is not recommended unless the image detail is extremely simplified and the appearance of the image remains true to original after indexing.
  2. Use additional online image compressors if needed:
    1. TinyJPG — https://tinyjpg.com/
    2. TinyPNG — https://tinypng.com/
    3. JPEG-Optimzer — http://jpeg-optimizer.com/
    4. Kraken.io — https://kraken.io/web-interface
  3. Simplify the image content. The less detail there is, the less data needs to be saved.

 

Related articles

Related articles appear here based on the labels you select. Click to edit the macro and add or change labels.

Related issues