I have been updating myself on 'best practices' with regards to online image formats.
Love to hear if I'm understanding the current trends correctly.
Is it correct that 'best practice' for online use is to:
1. To use vector file formats (SVG) for everything which is not a photo? And not to use raster image / bitmap like PNG? So use SVG for logo's, drawings, icons, etc.. Basically anything with simple geometrical shapes.
Reason: because SVG images can scale up without loss of image quality. Can be rendered at any resolution with sharp results. With bitmaps you have to choose upfront the pixel size of the image. That size then renders sharp only at 1 resolution.
2. That photographs are best shown using a raster file / bitmap file? And the preferred type is still JPEG rather than PNG?
Reason: JPEG is preferred over PNG-24 because JPEG gives a smaller file size then PNG-24 at a given resolution. Even though JPEG is a lossy compression and PNG-24 lossless. PNG-8 has 'only' 256 colors so probably not used much for photographs.
3. Is it correct to assume that WebP image format will probably replace JPEG in the near future as most used format? Because WebP gives the same image quality as JPEG but with much smaller file size.
But... we have to wait until Safari, IE, Edge and Firefox also start supporting WebP format.
Are my above assumptions correct?
Where did I get my understanding:
and
http://lifehacker.com/learn-when-to-use-jpeg-gif-or-png-with-this-graphic-1669336151