Optimizing Image without hampering the Quality in photoshop CC?

And if you're building responsive sites, don't forget about HiRes displays.  You'll need sets of images  @1x, @2x, @3x and possibly @4x too.

A Better Way To Design For Retina In Photoshop  

Nancy O.

Jpeg is perhaps the best for file size, but turning down the quality to get less space is always a problem, you are sacrificing picture detail for space. You can't get around that law.

See what the sizes are acceptable. You don't need 10 KB if 100 KB is acceptable for the purpose.

Before saving your image, you can try reducing the pixel dimensions, i.e. 500 x 500 instead of 1000 x 1000 using Image > Image Size.

Be sure your image is RGB/8 bit. If it's black and white, change the mode to grayscale/8 leaving one channel taking up space.

In Save for Web: Optimized, Embed Color Profile, Convert to sRGB

Metadata (File Info) can increase size, so set it to Copyright or None.

Gene

For photographs Save As > JPG and select the maximum compression you can get without the quality deteriorating, probably around 6. Make sure your image dimensions are as small as possible. When you want transparency use PNG 24 for photographs,  For simple shapes use GIF.