Optimizing Your Images for Print & Web + Free Downloadable Visual Guide

Not all file types and color modes are created equal, so when it comes image files, there are a few easy steps you can follow to optimize your image for whatever platform or media your image is intended - whether that be print, or online sharing. This will guarantee that your images look their best, with sharp online display and beautiful color tones in your prints.
 
In this post, I will walk you through the basics of how to prepare your images for online sharing, as well as how to optimize your files for printing.

OPTIMIZING FILES FOR ONLINE/WEB BASED MEDIA

Color Mode: RGB

Anything light-based (computer and TV monitors, smart phones, and the LCD screen on your DSLR) uses 3-color additive mode, which combines the colors red, blue, and green to produce all of the colors that we see on our monitors. It's pretty amazing to think that just these three colors, in various combinations, can create that many colors, right?

Your DSLR's default color mode is sRGB (Standard RGB, known affectionately as "silly RGB" because it isn't the best quality), and even when you switch profiles in-camera while you are shooting to, for example, Vivid or Neutral, you will still be in a form of the RGB color mode.

If you feel the need to double-check your file in Photoshop to see what color mode you have, follow this path:

Keep in mind that the above method is a simple way to check the color mode. When we change color modes later in the tutorial, we will use a more fine-tuned method.

Resolution: Pixels Per Inch

The resolution of an image is measured in pixels per in (ppi).  The minimum resolution for an image that is being uploaded online is 72ppi. Anything less than 72ppi will result in a) poor quality and b) a very small image. 
 
"Pixels per inch" is exactly what it sounds like, too! The term is simply describing the number of pixels in an image. If we zoom in and compare the amount of pixels in an image at 72ppi versus 300ppi, we are going to see a lot more pixels:

The small, rectangular bounding box represents the area that we zoomed in on. At 72ppi, a lot more colors are showing up, whereas at 300ppi, there aren't as many. This is because 300ppi is a much higher resolution, therefore the image has more detail (pixels) per inch.
 
You can also think of it this way: in the 72ppi image, you have a lot of information compressed into a smaller file, whereas at 300ppi, the information is more spread out.
 
When sharing your images online, be sure to upload them at a low resolution - 72ppi is always a good number - as this will make your blog and webpage load much faster and take up less storage, which is ideal when your website has a storage limit. It is also a small deterrent for people taking your image without your consent.

Output File Types: JPEG, PNG, PDF, BMP

The file extensions listed above are the most commonly used extensions for web-based media. They are compressed files, meaning they are smaller files, which, like we discussed above, helps the images load faster in a web browser. Since these are compressed files, they are not recommended when printing your images - we will touch on that in the next section.

OPTIMIZING FILES FOR PRINTED MEDIA

While your RGB images may look fantastic on-screen, once printed, you may find that they lack something - they will often be darker, or lose saturation. This is because RGB colors are optimized for screen display, not printing.

To get the most out of your prints, you will need to switch to...

Color Mode: CMYK

Used for printing and ink, this 4-color subtractive mode produces all colors using a combination of cyan, magenta, yellow and black. Most of our at-home printers use a combination of these four colors in their ink.

In many cases, your printing company will specify that your files be converted to CMYK when you send them over to be printed. They may also suggest that you download a custom color profile from their website.

If you are printing at home, be sure to convert your files to CMYK before you print. This will ensure that your files are optimized for printing.

To do so in Photoshop, select Edit>Convert to Profile>Working CMYK then follow the prompts.


 
Note: It is important to convert your file to CMYK this way rather than the way we checked our color mode earlier. Selecting Convert to Profile creates a more detailed profile. You may or may not see any sort of shift in the RGB image versus the CMYK image on your screen, but you will see a significant difference when your image is printed.
 
Resolution: Dots Per Inch

As photographers, DPI will not come up as much as PPI since our photo editing software, like Photoshop and Lightroom, measure our images in PPI, but it still doesn't hurt to understand what it is. Sometimes, your printing company will use the term DPI, so it is helpful to understand what they mean. 

Just like your computer monitor's resolution is measured in pixels, the resolution or output of a printer is measured in dots.
 
You know how on a newspaper print you can see tiny dots within the ink? DPI is that exact same thing. Instead of printing out pixels, our printers lay down many, many dots in order to create a print. So, much like PPI, the higher the DPI number, the better the print resolution.
 
Output File Type: TIFF, PSD

Remember how we talked about files such as JPEGs being compressed? When it comes time to print, we want a file type that will contain the most information for optimal printing - ie, not a compressed file!
 
PSD and TIFF are the preferred file type for printing high resolution images. They will make for very large files, though, so you will want to save a JPEG to upload online, and have a separate TIFF or PSD for printing.

Download your FREE Print vs Web Cheat Sheet HERE

 

Leave a Comment