

This is almost 4x smaller than the original photo with low compression. So we took the image again at a medium compression rate and as you can see below, the quality looks good now and the file size is 151 KB, which is acceptable for a high-resolution photo. What you want to do is find a happy medium between your compression rate (quality) and the file size. The second image obviously looks horrible, but then it is only 68 KB. 590 KB would be a fourth of that already. That is pretty large for one photo! It is generally best if you can keep a webpage’s total weight under 1 or 2 MB in size.

Low compression (high quality) JPG – 590 KB High compression (low quality) JPG – 68 KBĪs you can see the first image above is 590 KB. Note: The original image untouched is 2.06 MB. The second is using a very high compression rate, which results in a very low-quality image (but smaller file size). The first is using a very low compression rate, which results in the highest quality (but larger file size). Here is an example of what can happen you compress an image too much. (Suggested reading: JPG vs JPEG: Understanding the Most Common Image File Format) 2. Ideally, you should use JPEG or JPG for images with lots of color and PNG for simple images. There are several others, such as JPEG XR and WebP, but they’re not universally supported by all browsers. It’s the best choice for animated images. You can adjust the quality level for a good balance of quality and file size. JPEG – uses lossy and lossless optimization.Was created as a lossless image format, although it can also be lossy. PNG – produces higher quality images, but also has a larger file size.There are several types of files you can use: We’ll go into this more below.īefore you start modifying your images, make sure you’ve chosen the best file type.
#IMAGE COMPRESS UTILITY FOR FREE#
😮 Optimize them! Click to TweetĪs a Kinsta customer, you can benefit from image optimization for free by enabling automatic image optimization with just a few clicks. Images make up on average 21% of a web page's overall weight.

It’s more important than scripts and fonts. So when it comes to optimizing your site, after video content, images are by far the first place you should start! According to HTTP Archive, as of November 2018, images make up on average 21% of a total webpage’s weight. Uncover performance bottlenecks to deliver a better user experience and hit your business’s revenue goals.įree Audit The Benefits of Formatting Your Imagesįirst, why do you need to format your images? What are the benefits? There are numerous benefits of optimizing your images for performance.
