What’s the big deal about resizing and compressing images?
If you have been blogging long enough, I’m sure you have read post such as, “What I Wish I Would Have Known When I First Started Blogging.”
Well, here is mine, “What I What I Wish I Would Have Known When I First Started Blogging.”
When I started blogging, I knew nothing about pictures! I just uploaded them to my blog! The first thing I learned was that I should watermark them in some way by adding my blog’s URL. Then I learned about how I should label the alt text line of the images for SEO and Pinterest purposes. I finally learned that I should re-size each image, and I heard something about the Smush.it, installed that plug-in, heard that it was bad, and then uninstalled it. It was all so confusing . . . and time consuming!
However, as I continued to research this topic of resizing and optimizing pictures by researching and talking to an expert about blogging, I came to a conclusion that optimizing your images before adding them to your posts is very important.
Why should you optimize your images?
- Images that are not optimized make your page load slower as they are so big and your server has to download those images to your blog every time someone lands on that post.
- These images will also take up a lot of room on your server which will affect your bandwidth and eventually make your hosting prices increase.
All those pictures I uploaded for months without optimizing them is taking up a lot of room on my server! For me to go back and resize all my pictures and then put them back in my posts and delete the big pictures from my media will take forever! It is something I am trying to do little by little, but I wish I would have known this information when I first started blogging.
Check out! How To Change Your Ad Setting On Google AdSense.
How can you optimize your images?
There are two main steps you should take to optimizing your images.
- Re-size your images. I usually make mine 600 pixels wide at the most. My theme will allow 700 pixels wide; but many do not, and I do not want to resize my images if I ever move to a different theme. I use PicMonkey to do this, but you can use many photo editing programs. Re-sizing images in the media section of your dashboard is not enough. You must do this step before you upload your images to your blog.
Here are directions on how to re-size images with PicMonkey:
–Upload your image and click on this button:
–-Go down to Resize and click on it.
–Put in the size on the left for how wide you want it to be.
–Finish all your other edits and then save the image.
–Here is a “big” image of mine before resizing it, and look at how much smaller it became in the amount of space it will take on my server just because I made it smaller.
Before I re-sized: After I re-sized the same image:
- Compress your images by using online services to make your images smaller.
Basically, you are reducing the quality of your image here. If you want to allow your image to be printed for decoration, then you would not want to compress your images. Also, if it makes your image fuzzy, you would want to leave it at 100%, and then you would not need to do this step. Here you have to keep a careful balance between compressing to save space and compressing so much you lose the quality of your images.
There are different programs that you can use to compress your images. Programs like Photoshop have it built into their features. JPEG Optimizer has it set at 60% for optimization. That is not usually crisp enough for me.
To compress my .jpeg images, I have been using JPEG Optimizer. You can also re-size your images at the same time with JPEG Optimizer, which will be great when I am resizing and compressing the old images on already published blog posts. Most of the time, however, I re-size the image on PicMonkey as I have to edit the images anyway.
Here you can see how using JPEG optimizer helped make the image smaller. I kept it the same size, but I think I put it at about 85%.
For .png images, you can use TinyPNG to compress your images.
In another post, I will share when you should use .jpeg images vs. .png images and the pros and cons of both types of images.
For more information on the importance of optimizing your images, you can read this post by Elegant Themes. They mention different plug-ins that can be used, but I try to stay away from adding any more plug-ins than I have to use. I love this quote from their post:
The importance of optimizing your images should not be underestimated. Optimizing your images will reduce your website’s page loading times, reduce bandwidth and improve the browsing experience for visitors. Your search engine ranking should also improve due to your pages loading quicker.
Amy Lynn Andrews also has many tutorials for using images on your blog. Here is her tutorial for resizing images.
Thanks for the helpful tip about editing the alt text line for images, Tammy!
You’re welcome! I know on my Pinterest post I went more into why you should always add a descriptive sentence to your alt line of each picture.
I use Picasa so to resize and add my watermark all at once. Pic Monkey dies have better editing though.
I resize and watermark all on PicMonkey, but I can’t compress the pictures. Now if I just need to resize a picture that already has the watermark, then I can use the .jpeg optimizer to resize and compress all at the same time. I think you can resize batches of pictures with Adobe lightroom, but there is a fee for that. I haven’t used Picasa much.
Sorry.. I’m a bit confused. So I’ve been using PicMonkey to watermark and reduce the size but then I should also be compressing them? Is that right. So several steps before I upload them? Thanks for this tutorial and your help.
What image are you making? If you are making a Pinterest-friendly image – let’s say 700×1300 – you should resize it as it is already fairly big. It does depend on what you are wanting to do with the images. The larger the file – the more likely it will be to slow down your site load speeds.