Skip to content

How to prepare photos for the Web?

  • by
  • 3 min read

Publishing high-quality photos on the internet can be quite the task but with the ever-evolving displays, it’s important that you do. There’s always a compromise between quality and image size that content creators and bloggers need to keep in mind so that their pictures look good without hogging up on their server’s bandwidth.

Naturally, pictures taken from DSLRs and other high-quality cameras are quite bulky. If you were to upload these images straightaway to a website, the loading times would be too high. Therefore, some sort of compression is required.

In this article, we’ll take a step-by-step approach to prepare your high-resolution pictures to be published to the internet.

Also read: How to change the hair colour in Photoshop?

Preparing photos for the internet

Step 1: Compressing the source

Before you take the picture, checking the quality of the picture from the camera you’re taking it from is always a good idea. Most  DSLR cameras have multiple quality settings that can significantly reduce image size whilst not taking such a big hit to image quality.

Here’s we’ll be taking a look at my DSLR, the Canon 200D Mk1. As you can notice, there are numerous quality settings based on multiple resolutions. Since the images I’m going to take are going to the web, I’ll select S2 here.

How to prepare photos for website? Publish high-res images in low size
Note the different image quality options available

What this does is takes the picture in a reduced resolution as compared to the highest possible or even the default settings. These resolutions generally look good on most digital screens, however, your mileage may vary.

Step 2: Compressing the image

Once you’ve got the image ready, now it’s time to run a software compression. If you don’t need to make any changes to the image, you can simply use any online compression service to compress your images. How well do they work depends a lot on your pictures.

How to prepare photos for website? Publish high-res images in low size
The Save As dialog box also shows the output file size to help you decide which quality to pick

If like me you need to process your photos, here’s how. Fire up Photoshop and do whatever changes you need to do. While saving the image, save it in the jpeg format and drop the quality down to ‘3’. You can go even lower or higher depending upon what image size you’re targetting.

And there you have it — a beautiful looking high-res but small size image for the web.

Also read: Top 7 cool Tumblr alternatives that get the work done

Yadullah Abidi

Yadullah Abidi

Yadullah is a Computer Science graduate who writes/edits/shoots/codes all things cybersecurity, gaming, and tech hardware. When he's not, he streams himself racing virtual cars. He's been writing and reporting on tech and cybersecurity with websites like Candid.Technology and MakeUseOf since 2018. You can contact him here: