By Rachel Anderson
Ever posted a photo on the Internet and then stared at it, wondering if it was fuzzy or just your sleep-deprived eyes? With this guide on the basics of DPI and resolution, you won’t have to wonder anymore. Your photo posts will look great every time!
Some Definitions from the “Picture-nary”
DPI: Dots per inch; the number of pixels/dots in an inch. More dots = higher quality. (Higher DPI=Higher Resolution)
Pixel: The individual dots of color that make up an image.
Pixel Dimension: The total number of pixels/dots that make up an image.
Resolution: How much detail the image holds or is capable of holding; higher resolution means more image detail.
Resolution is commonly confused with image size.
Ex: Many people think that higher resolution means the photo is larger. Large images have high resolutions but images with high resolutions do not necessarily have to be large.
Standard Web Image DPI: 72dpi or 96dpi (This is NOT written in stone. See ‘Keep Monitor Size in Mind’ section)
Always Start With the Largest Image Size
If you use photos from an image database, always try to get the largest file size you anticipate needing. Photo editing software, like Photoshop, can automatically adjust the number of pixels in an image when you decrease the image size by ‘resampling’ or taking an average of the nearby pixels to make new pixels.
However, if you try to do the opposite and make a photo larger, the best your photo software can do is ‘interpolate’ or make up new pixels to give you the larger image. It will end up being bigger, but also fuzzier.
Brief Clarification: Image VS. File Size
A short explanation here: Image size relates to the physical dimensions of the photo like 5×7. File size describes how much space a photo takes up on your hard drive and directly correlates with page weight or how long it takes for a page to load.
Keep Monitor Size in Mind
The 72dpi we all have engrained in our brains as the optimal dpi for web images is the best guess for the majority of our audiences to view images in their best form. But… this is not written in stone.
Think about computer monitor sizes for a moment. There is a pretty good variety of screen sizes out there. Without getting too technical, using a 72 dpi image on a 14 inch screen will look pretty good while the same 72 dpi image on a 21 inch monitor will be much smaller and/or much less quality. If you have data that says the majority of your audience use 21 inch monitors, you may want to adjust your photos for that display.
To try this out for yourself, open up your favorite website, one that has at least one image on it. Then open the same website on a larger screen (maybe even your tv monitor if you can). The photos on the larger screen will be significantly smaller and often look like lower quality than on your regular screen.
4 Steps in Posting a Photo on the Web
1. Ask yourself how big you need the photo to be. Then check to make sure the photo you’ve selected measures up. If it’s too small, you will only stretch it out, making a poor quality, pixilated and blurry mess.
2. Set the photo to the appropriate dpi. This may be the standard 72 or 96, but don’t hesitate to set it to something higher if that better meets your needs.
3. Save the photo as a JPEG, PNG or GIF
4. Upload your beautiful image!
Go from this………………………………………..to this!
Rachel Anderson is a Pay Per Click Advertising Strategist at Netmark.com. Off the job she enjoys photography, good food, being outside, and spending time with her husband. Share your thoughts with Rachel on Twitter @gladygirl, Google+ or Facebook- she’d love to hear from you!