CALL 0438 139 719FREE QUOTE

The Secrets Behind Photo Sizes & Quality

By | First Published: | Last Updated: 22 December, 2023

Photos take time to download, so they can also make your website slow to load. And potential clients hate slow-loading websites.

Photos also help your website look great (which potential clients love) and convert potential clients into actual clients (which you love).

The trick is to keep photos small enough that they load quickly while large enough that they still look fantastic.

Photo Size

Photo size ultimately refers to file size (e.g., 120 kB). Yet, 3 key things contribute to file size, the:

  1. Resolution of your photos
  2. Width and height of your photos
  3. File type of your images

Before briefly explaining these things, let me share my golden rule always give me the largest images you have. I can make them smaller. But I cannot make them bigger without them going blurry.

The rest of this article gets a little bit technical. If you don’t want to read it, just:

  • Follow the golden rule
  • I can do the rest for a small fee

But, if you want to save money and invest time, read on.

Photo Resolution

Photos are made of pixels (dots). The number of pixels needed for photos to look good is different for:

  • Printed photos
  • Photos on the web

To look good, printed photos often need a resolution of 300 PPI (pixels per inch) to look good. But on the web, pictures still look good with a resolution of 72 PPI.

For example …

close up of river stream on stones
The file size of this photo of a stream is 928 kB at 300 PPI but only 92 kB at 72 PPI.

So, to keep your file size down without affecting how good your photos look, make sure your photos have a resolution of 72 PPI.

Width & Height

The physical width of your photos, measured in pixels (px), also affects their file size.

The minimum width of your photos changes depending on where it is used:

  • Full-width locations need photos to be at least 1,920 px wide
  • Content-width photos typically need to be at least 1,200 px wide
  • Half-width photos typically need to be at least half of 1,200 px, or 600 px wide
  • Third-width photos typically need to be at least a third of 1,200 px
  • Quarter-width photos typically need to be at least a quarter of 1,200 px

<< Full-width = 1,920 px wide >>

<< Content-width = 1,200 px wide >>

<< Half-width = 600 px wide >>

<< Third-width = 400 px >>

This image went from 92 kB at content-width (1,200px) to 50 kB at half-width.

close up of river stream on stones

Make your photos as high as you want them to be, but no higher.

I described resolution first as when you reduce resolution, it automatically reduces the width and height of an image.

File Type

Different file types have different extensions. For example, modern Microsoft Word documents end with the .docx extension. PDF files (.pdf extension) are also documents, but they are different types of files.

JPG files (.jpg extension) are the most common image file type. For a long time, they were recommended for website photos.

PNG files (.png extension) are a different type of image file that used to be recommended for drawn images (e.g. logos).

But today, converting your photos (and other images) to WebP files (.webp extension) normally reduces your file size without reducing the quality of the image.

close up of river stream on stones
The JPG file was 50 Kb, while the WebP version was 27 kB.

So my advice with photo file types is to:

  1. Start with a JPG file
  2. Convert it to a WebP file
  3. Compare the two

Then if you are happy with the quality of both, use the photo with the smallest file size.

Photo Size & Quality in a Nutshell

Overall, we achieved a 97% reduction in file size while the photo still looks amazing.

shaun killian profile picture.jpg


Shaun Killian (me) is a small business owner, who is passionate about helping other small businesses succeed. He has been working with website design since 2008. He is also an expert in digital marketing, including SEO, content marketing and email marketing. In a former life, Shaun was a school teacher and principal before a heart transplant and bilateral leg amputation led him in other directions.