Monday, 20 May 2013

Speed Up Your Site: Image Formats


On the first part of this series we discussed how to optimize images in order to reduce their size and consequent load time (click here to read). Apart from optimizing the images it is also important to choose the right format. You should use the GIF, PNG and JPEG formats based on the type of the image and on size constraints of your website. Below you will some guidelines for each format:
JPEG: Stands for Joint Photographic Experts Group. This format was created for photographs and fine art-work. You should use JPEG images whenever you are displaying a photo or a true-color image. Notice that if you are using compression to reduce the file size you should use a 50% compression rate for optimal results.
GIF: Stands for Graphics Interchange Format. The GIF format is connected with the history of the Internet, mainly because of its small size. JPEG images support millions of colors while GIF ones will integrate a maximum of 256 colors. You should use this format for flat-color images like logos, buttons or text images. GIF is also the format of choice for animated images.
PNG: Stands for Portable Network Graphics. The PNG format was created specifically for the Internet, with the objective of replacing GIF images. The main advantage of PNG images over GIF ones is that they support 24-bit colors and alpha transparency. That said not all the browsers recognize some of its features. You should use the PNG format for simple images that require more than 256 colors.

No comments:

Post a Comment