Baseline JPEG 500k
Why is my website slow?
Website speed is extremely important, and photos can definitely be a source of slow load times for your website. Most people use Baseline JPEG photos. If you compress your photos be careful not to ruin them with too much compression. A Baseline JPEG loads differently compared to a Progressive JPEG. The Progressive JPEG is a much better solution for a website. How will progressive JPEG images improve website performance?
Progressive JPEG 217k
Progressive JPEG 80k
In addition to the better visual experience, progressive JPEG images are 2% to 10% smaller in size compared to baseline pictures. So we recommend that you convert your baseline JPEG’s to a Progressive JPEG so it will improve the loading of your website and overall performance. Your requests to the server will be shorter and more efficient, which will also reduce your resource usage such as bandwidth, disk space. That is extremely efficient if you are hosting a website on free or shared hosting services. Websites with a large amount of baseline JPEG pictures will also greatly benefit from the lossy compression into progressive JPEG images. It is also worth mentioning that visitors who access your website via mobile device or slow internet connection will have an overall better visual experience and faster load times if you use progressive jpeg images.
How to compress and create a progressive JEPG
How can I create a Progressive JPEG?
In the video above I take you through all the steps to create a properly compressed photo for the web.
Here are some of the tools you will need:
First check here to see if your image is a baseline or Progressive Jpeg http://techslides.com/demos/progressive-test.html
2. Jpeg Mini https://www.jpegmini.com
3. Further compress and convert your image to a Progressive Jpeg here https://imagecompressor.com
The photo above of the spilled wine is crazy big and is slowing the load time of this page way down. It is 1 meg and that’s a large file for the modern and especially mobile web. Just think your webpage should be about one meg or less and this photo alone is taking up that much bandwidth on it’s own. A few photos like this will have your website at a crawl. However the photo bellow is a Progressive JPEG at only 65k yet it looks perfect.