Pixels and Dimensions of Digital Images

Social Media and other websites have specific dimensions for uploaded images which relate to the “container” size or space allocated for the image on the web page. This article will focus on pixels when used to define the dimensions of images for use on the web and other digital applications.

You will see image dimensions specified like this:-

• Facebook profile picture: 180 × 180
• Facebook cover photo: 820 × 312
• Twitter header size: 1500 × 500
• Twitter post image: 1024 × 512
• Linkedin background photo: 1584 × 512

For a complete list of social media image sizes, see sproutsocial.

So what do these numbers mean?

In website and graphic design the dimensions of digital images is usually measured in pixels. This refers to the number of pixels in an image. Let’s look at the recommended size for a Facebook cover photo of 820 × 312.

The standard in the graphics industry for writing measurements is width by height (width × height). This tells us that the cover photo image you upload should contain at least 820 pixels across and 312 pixels down.

So what is a pixel?

The term pixel – abbreviated as “px” is short for picture element and refers to the tiny blocks of colour that make up all digital images. If you zoom far enough into any digital image you’ll be able to see the individual pixels that together form the image.

What is the size of a pixel?

Unlike physical measurements like millimeters or centimeters, a pixel is a logical unit and doesn’t have a physical size. Pixels are also normally displayed at a size so small that they’re not visible.

The resolution of your screen will determine the size of pixels. A popular screen size of 1920 × 1080 for example, can display 1920 pixels across and 1080 pixels down. Compare this to a computer screen from the early 1990’s that had a resolution of 640 × 480. The size of individual pixels will be much larger on the 640 × 480 as it can only display 640 pixels across and 480 pixels down.

How are pixels created?

Pixels are created in a few different ways:-

• The sensors in a digital camera capture the image you’re photographing and convert it to the pixels of the digital image.
• If you create an image with photo software like Photoshop you can specify the physical size (in millimeters, inches etc.) and the resolution which is the number of pixels in the image.
• If you convert a vector graphic to raster image you specify the physical size and the number of pixels per inch.

What is image resolution?

The amount of detail in an image is referred to as resolution and is measured in pixels per inch (PPI). This is the amount of detail in an image .  Generally more pixels per inch mean a higher resolution. Images with a high resolution should produce better quality prints. The abbreviation DPI is used to measure the print size of an image on paper. Take note that we’re talking about printing here. Read more on preparing artwork for print.

Image resolution is only critical when you’re printing and does not necessarily affect the appearance of images displayed onscreen.

Why image pixel dimensions are important

Although we say that image resolution is not important for images displayed onscreen, you still need to ensure that your images have enough pixels to prevent pixelation. Pixelation is when images appear grainy, blurry or the individual pixels are visible.

Need Help?

Please feel free to contact us if you need help with images for your website or social media page. Visit our home and services pages for more about us and what we do.

Please share this article if you found it useful