Image Optimization For Web & Mobile (What You Need To Know)

Image optimization can be the difference between your visitors staying on your website or going to your competition's site before they see any of your content.
image optimization

When you are running a website you know that every visit counts. If your images are not optimized for web and mobile, it may cause your website to load slow and result in your visitors going to your competitors website.

What Is Image Optimization?

“Image Optimization” is the process of reducing the file size of the images you are using on your website as much as you can without causing a significant loss in quality. This helps keep your page load time low.

Image Optimization with Photoshop

The image above is an example of the process as I was optimizing an image. The image dimensions was 627px X 605px. That did not change for any of these but the quality did. As you can see (Under “JPEG”) the file size drops a lot based on the quality level (On the right under each image).

While saving with 0 quality would be great for page speed, it would look bad to the website visitors. I try to keep images around the “medium” setting (80 quality) when I optimize my images for my websites.

Don’t worry if you do not have Photoshop. You don’t need it to optimize your images.

About two years ago I did a deep dive on website speed optimization and found a few amazing FREE tools!

ResizeImage.net

Displaying the proper size of your image is a massive part of image optimization on your website. On average I design my websites at 1200 – 1500 pixels wide. So if you have a background image you want to use that will be stretched across the entire page it doesn’t need to be any bigger than 1500px wide.

This website will take your files and resize them to the proper size you need to display on your website. And Yes, It’s FREE!

You can also “Crop”, “Rotate”, and “Convert” your files all online with their website. It does offer image optimization but I found another site that specializes in optimizing images. It’s also free and what I use any time I’m not able to access Photoshop.

TinyPng.com

This site is AMAZING!

The 100% Free features include online image optimization in bulk up to twenty images at 5mb max image size.

The way I use this is I will take the images and resize and/or crop the image with ResizeImage.net and then I will upload them into TinyPng.com and ONLY THEN will I upload them to the website.

I never really focused on page speed optimization for my main “CJHallock.com” for years. When I started digging into it I found that TinyPNG.com has a plugin that will help optimize your images inside of your media library within your WordPress Dashboard.

You can only “optimize” 500 images per month with the plugin once you have it activated with a free account from TinyPNG.com

But if you are like me and have been blogging and building out pages for years before you optimize your images, the WordPress plugin will optimize your images for pennies. I think I did over 2500 images for about $20. (Don’t quote me on that!)

Image optimization will drastically change the load time and conversion rate of your website. Do not forget to optimize every image that you put onto your website.

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on pinterest
Pinterest