Has anyone ever asked you for a “high-resolution” photograph? Or perhaps you’ve been asked to upload an image at least 1200px by 600px to a social media site? To properly respond to either of these requests, you need a fundamental understanding of how digital images work. In this post, we will explore the concepts of pixels, image resolution and file type, all of which are crucial to your digital literacy.
Pixels and Image Resolution
Pixel (pix·el)
Definition: A miniscule area of illumination on a screen, from which, images are composed. In other words, pixels are the tiny dots that make up your computer, tablet, smartphone, and television screens.
As a kid, did you ever get so close to your television that you saw a bunch of teeny-weeny little colored dots? Those were pixels. Even now, if you were to take a magnifying glass to your computer screen, you would see a similar grid. The more pixels are in a given space, the better your image quality is.
Image Resolution
Definition: Image resolution is the detail an image holds. Higher resolution means more image detail.
When dealing with digital images, pixels are also used as a unit of measurement. The term PPI refers to Pixels Per Inch, which is how we determine the number of pixels that reside in square inch. The diagram below demonstrates this concept:
Now, consider the fact that most digital images contain between 72 and 300 PPI. Although PPI is an important element of image sizing, the overall pixel measurements are what you’ll likely be dealing with most frequently. The following four images demonstrate the importance of high-resolution images:
10 x 10px
50 x 50px
100 x 100px
300 x 300px
File Types: PNGs and JPEGs
There are two primary file types used in the digital sphere: PNGs and JPEGs. The general rule of thumb I like to follow is this:
- Use PNG files for images that will only appear digitally (ie. profile pictures, cover photos, online photo albums, icons, etc.)
- Use JPEGs sparingly in the digital world. JPEG files are generally larger than their PNG equivalents, which can slow down websites and increase loading time
PNG (ping)
A Portable Network Graphic (PNG) is a file format for image compression. PNGs basically allow you to shrink large images down without losing image quality. PNGs are great for online pictures.
JPEG (jay-peg)
JPEG files are images that have been compressed to store a lot of information in a small-size file. A JPEG is compressed in a way that loses some of the image detail during the compression in order to make the file small. JPEGs are the preferred file format for printing images, but not necessarily for digital use. JPEG files are usually used for photographs on the web, because they create a small file that is easily loaded on a web page and also looks good.