Concerned what the best image format for your photos should be? Slowing your site down? Looking crappy? After my post last week you should know all about optimizing your images for better SEO. But, you’re probably asking yourself, “should I save my blog images as jpg or png?” Well, I’ll help you out there!

Concerned what the best image format for your photos should be? Slowing your site down? Should I save my blog images as jpg or png?

Saving your blog image files should take some consideration for the best viewing experience with your readers online. While there are more formats than this topic covers, I wanted to talk about this in easy-speak. Keeping this limited to the file formats you’ll probably need to use, let’s explain each.

JPG Format

A JPG (or JPEG) is a file extension for a lossy graphics file. JPEG actually stands for Joint Photographic Experts Group (the peeps that named it). Unless you’re shooting in RAW, you’re probably downloading JPG files from your camera after you shoot all of your awesome blog images.

PNG Format

A PNG is a raster graphics file format that supports lossless data compression. PNG was created as an improved, non-patented replacement for Graphics Interchange Format (GIF), and is the most used lossless image compression format on the Internet. (Wikipedia)

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!

The image on the right is of better quality, but may not be worth the file size increase for your blog photos.

So What is a GIF Then?

So, a GIF format would be used for simple graphics like a shape or a logo, items that are solid in color. If you’ve ever loaded some graphics you made in Photoshop to your blog, as a JPG file they probably have some weird graininess around the edges of your file.

The same goes for photos saved as GIF files. GIFS only show 256 colors (what your monitor sees) so your beautiful photograph with millions of colors looks as if there are gradients on it.

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free! Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!
Here you can see the difference between a JPG (left) and a GIF (right).

PNG vs. GIF

Now that PNG was created as an improved replacement for GIFS, and is even more lossless in compression, it’s a bit more common to use it. They support more colors than a GIF. When you have a gorgeous graphic that needs a transparent background, use the PNG!

Another reason to use PNG is if your graphic has a gradient from light to dark red. You’ll see the blocks of gradient more predominant if you save those as a JPG. So go for the PNG in that case.

To further complicate, there are two types of PNGs.

PNG-8 – which is just 256 colors like a GIF file.

PNG-24 – which is very similar to JPG and has over 16 million colors.

In some cases, a PNG-24 works great for photos online, like when loading to Facebook. Don’t ask. I can never figure out why Facebook compresses the hell out of images. Bleh.

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free! Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!
With this clipart piece. Saving as a transparent PNG on the left looks much better than a .JPG on the right.

Should I Save My Blog Images as JPG or PNG?

And, since you’re asking how you should save your blog images, let’s recap:

JPEG – Photos and Graphics when you want the file size to be small. We’re not talking about print use, but online. You’ll lose a bit of quality when saving for web as a JPG, but it’s probably what you’re saving your high resolution versions of these images from your camera or after editing in Photoshop

PNG – Graphic (and sometimes photos) If you’re saving these from the save for web feature in Photoshop, you’ll probably notice the file size larger than a JPG. It’s really a lot higher quality, and works great for items that need to be transparent in the back.

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free! Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!
Again, you may not even notice a difference. So when in doubt, save as a JPG to reduce the file size.

Save for Web

Utilize the Save for Web feature in Photoshop when saving our blog images. It allows you to tweak the quality to get the size reasonable for load times. And, doesn’t hurt your SEO ranking. Check my post from the other day about this.

To find the Save for Web feature: File/Export/Save for Web.

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!

Should I Save My Blog Images as JPG or PNG? This may not be something you've ever considered before, but if you want to show quality images and make the load time of your website fast for your readers, then come check out my post explaining the file formats. And, download my Beginner Photographer Equipment Guide for free!

Take careful consideration about the load time of your images on your blog to your readers first. You don’t want to be penalized by Google, and you certainly don’t want your visitors leaving your website because it’s taking too long to load. Let me know if you have any questions!

Holly McCaig

About Holly McCaig

Hey you! I'm Holly McCaig and I'm super excited to help you love and ROCK your Etsy shop. I will help you have an amazing online presence so you can build a strong business and attract more customers to your shop. Let's do this together! Let's connect on Pinterest or Instagram, k?

About Holly McCaig

Hey you! I'm Holly McCaig and I'm super excited to help you love and ROCK your Etsy shop. I will help you have an amazing online presence so you can build a strong business and attract more customers to your shop. Let's do this together! Let's connect on Pinterest or Instagram, k?

4 Comments

  1. Lisa on April 27, 2017 at 1:43 pm

    Great article! I guess I’m still a little confused. I’m looking to reduce page speed and be able to reduce as much as I can for the future. So I am assuming PNG would be the best way to go? Thanks! Great site by the way. I signed up for the newsletter.

    • Holly McCaig on April 28, 2017 at 1:09 pm

      Hi Lisa! So if your PNG isn’t a large file, I say use it. Especially if your image has text. But, if you’re having problems compressing the file size then the JPEG might be a better option to get it smaller. P.S. Anytime I share a pro shot on Facebook, I use PNG. Facebook compresses images so bad!

  2. beckett haight on June 24, 2017 at 6:12 pm

    Thanks!

  3. alohaina on July 14, 2017 at 11:01 pm

    Super helpful!!

Leave a Comment