How do pixel dimensions relate to resolution?

242 views

I’m a professional graphic designer. 4 years of college and 3 years of job experience have not been able to explain this.

Why is it that two images with the same pixel dimensions can be different resolutions? As I understand it, a pixel is one dot of color in a larger image, and resolution is a measurement of pixel density, so two images displayed at the same size with the same number of pixels should always be the same resolution.

I created an image for an email signature at about 1200 pixels wide. When implemented, the computer scaled it down to 299 pixels wide so it would fit, and it looked perfectly crisp and clear. This part makes sense to me.

To minimize the load time and storage for the image, I scaled it down to 299 pixels wide in Photoshop – exactly the same size it was in the signature – but it came out far lower resolution than it was on the email signature.

How can this be? This isn’t the first time I’ve encountered this issue. In fact, I run into it so often that I normally avoid using pixels as a measurement for images entirely. I’ve googled it many times with no solid answer. I struggle to understand why we even bother measuring images in pixels if the measurement doesn’t mean anything.

In: 6

6 Answers

Anonymous 0 Comments

The “virtual” CSS measurement is the last piece of the puzzle I was missing! I thought that measurement was literally the computer counting the number of pixels so it would always be the completely accurate no matter what.

You are viewing 1 out of 6 answers, click here to view all answers.