They are hundred kind of graphic format extension exist nowadays, but only few of them are supported by web browser. Among those graphic formats, there are just few formats that commonly used by web designers.
Through the introduction of graphic format feature below, you are able to distinguish when you need to use which kind of graphic format in graphic design job:
Joint Photographic Experts Group (JPEG) which supports 24 bit true colors making it best for colorful photo and complex drawings. The compression also is the best cocomelon png among all graphic formats. According to research, for 50% resolution as compared to original picture, the compression ration is about 15:1. The large compression ration property of JPEG enables it to have a high download speed.
Graphic Interchange Format (GIF) only support 8 bit 256 colors, but it is the most supported graphic format among other graphic formats. Moreover, it also support transparency background, multi layer and interlaced graphics support that allow animated images to be created. With GIF, you are able to choose the number of colors, such as from maximum 256 colors to 128, 64, 32 colors that reduces the file size in acceptable way. For example, if the number of color your banner is below 64 colors but you did not reduce the color number to 64, you are wasting your bandwidth of your website due to bigger file size loading.
Portable Network Graphics (PNG) supports up to 24 bit color, transparency, interlacing but is limited by most web browser, like IE6 and version that older the transparent is not supported and size is the largest among the other two graphic format. Another good side of PNG is it allows text description that translates images for search engine use.