How to Optimize Images for the Web

Before uploading a new image to a blog post optimize your images for web viewing. Smaller images load faster and this improves user experience and helps our website function better.

If you need a way to edit your images, download the free GIMP (GNU Image Manipulation Program). Open your image. Go to Image / Scale Image to adjust the size of your image. Set a max size of 1200 pixels wide for horizontal images and 600 for vertical images and 72dpi. Then, go to File / Export As and  Select File Type at the bottom. Choose JPG with image quality of 60 and Save. Choose PNG if your image has text for more sharpness.

Name your file something descriptive and use hyphens to separate words like: my-optimized-image.jpg

Once it’s saved, you can further optimize the image size using a free app called ImageOptim. Just open this up and drag your image onto the window and it will make it smaller with no change in quality. Aim for an image size below 100k. Another useful resource for optimizing images is the website Tiny Png. You can easily upload an image here and it will optimize and download a separate file.