09 Image Types – PNG or JPG?

Images are largely misunderstood. So here’s the quick run down of what you need to know starting with image TYPES.

There are two main file types (there are others, but you’ll use these the most): JPEG and PNG

Here’s the brass tacks:

When to use JPGs (JPEGS)

JPEGs are smaller files sizes which keeps your website fast. You should use this type the most.

When to use PNGs

PNGs are used when you need a transparent background. That’s pretty much the only time you’re going to need a PNG.

Example

If you are putting a round image on a non-white background, you’ll want to use a PNG. If your image is square and you do not need transparency, then you can go with a JPEG.

When you’re in Canva or Photoshop and you’re getting ready to export your image and have always wondered what the hell is the difference…now you know and can choose the right file type for your project.

Pro-Tip for Image Sizing

If you’re in Canva or Photoshop, save your image about twice the size of what’s needed. For monitors that are HD or “retina” your image will look crystal clear. This works great for JPEGs because even at twice the size, the image file size is still small. You want to keep it to around 150k or less whenever possible if you’re adding the image to your own site.

Why Should I Care About Image Types?

Here are just two reasons you should care:

1. Large file sizes will slow down your site which Google does not like. A speedy site will get rewarded with more search traffic.
2. Large file sizes will slow down your site which your users will hate. Not a great way to present your brand.

Hope this helps clarify file types!