Sometimes clients will send small images — for instance, a 100K JPG or PNG image for a print piece they are having designed. Or, they will ask me to go on their website and pull down an image to work with. It’s then that I have to explain that won’t work because the image resolution is too low. So, I will try to explain the why of this.
Print Resolution vs. Web Resolution
Print resolution is measured in DPI (dots per inch), while screen resolution is measured in PPI (pixels per inch), although many use these interchangeably. Computer monitors have a fixed pixel resolution — usually 72 to 100 dots per inch — so any image optimized for that resolution looks natural and fully detailed.
If the same image is printed at full size, its inherent pixel blockiness becomes readily apparent. Secondly, the side effects of image compression on web images (such as distortion around edges) may prove unsightly when printed.
What are Pixels?
Pixels are the building blocks of digital images. Pixels are the small colored square dots that appear when images are enlarged too much or look closely at the screen.
An image’s resolution is calculated by multiplying the horizontal pixels by the vertical pixels. For example, a picture with 1200 pixels at the horizontal and 2100 pixels at the vertical would have a resolution of1200x2100 pixels.
As you have probably noticed, the above definition does not specify the size of the pixels. DPI stands for dots per inch. A picture with a resolution of 100×100 would be 1×1 inch when printed at 100 DPI.
A larger image is associated with a higher resolution. Loading or emailing a higher resolution image will take longer and use more space on your hard drive. On the other hand, the higher the resolution, the better the image looks when printed.
Computer monitors typically have a resolution of 72 DPI, and inkjet printers typically print high-quality photos at about 300 DPI — the same resolution as most magazines, brochures, and other printed material. Most scanners and digital cameras produce images with enough pixels to print a letter-sized photo at between 300 DPI and 2400 DPI.
Why Size Matters
Print graphics at 300 dpi are standard for professional use. But, if you want to use a web image in print, you run into problems. It can probably be workable if the image is a tiny inset and is being reduced on the printed item. But, even printed at actual size, there can be some issues. You simply can’t generate extra pixels and make a beautiful cover for a brochure out of your Facebook cover photo.
And, even with images that are going to be used on the web I often get tiny images that don’t fit in spaces they need to. Sending an image that is 50×100 pixels, and weighs in at 20K, and expecting it to become the hero image on your home page is not going to work.
I always suggest using the largest image size available to you for print or web work. Images can be made smaller as needed, and those pixels will be “squeezed” together to keep them crisp, but you can’t up-size and image without losing quality. So for images, bigger really is better!
- Unleashing the Power of Storyboarding: A Practical Guide to Designing Outstanding Websites - September 20, 2023
- Why Your Business Needs a Professional Web Consultant: A Comprehensive Guide - September 5, 2023
- Online to Invisible: The Shocking Consequences of Extended Website Downtime - July 17, 2023