Digital Images

Any time you take a picture with a digital device, like your camera, phone or tablet, it is translated into pixels. Pixels are tiny dots of colour. The more dots, the clearer the picture. Since in the digital world each dot is information, more pixels also mean more data (= information). More data takes up more space in your storage, like your SD card in a camera, or your hard drive, or on servers that host your website.

Different image file types have different resolutions and sizes. Resolution is how clear a picture is. As a result, each file type is ideal for certain circumstances but not all. So in order to make the right decision about which image file type to use, you first want to know what exactly they are.

The most common file types

The most common digital image files are JPGs, PNGs and GIFs. Each type uses available data differently which has pros and cons. There are many more image file types out there but this post focuses on the most important once to help you choose the best images for your work.

JPG

JPG or JPEG stands for Joint Photographic Experts Group and has the file extension .jpg or .jpeg at the end of the file name. When you take a picture, the light hitting the camera is translated into data. If your digital device is set to store images as JPGs, they create image files that only support lossy compression, meaning they record less pixels in a specific image size.

The file sizes are small, which makes JPGs ideal images on websites, in newsletters and for social media posts. Anywhere images need to load, a smaller file size is better because it takes up less RAM and storage space.

Since JPGs only support lossy compression this means that they look best at their actual pixel size or smaller. For example, if you create an image that is 500 x 500 pixels and store it as a JPG but you want it to spread out over the background of your website, which is much larger, the image will look pixelated because JPGs cannot be enlarged.

When you compress a JPG, meaning you use a tool to make the file size smaller, the result is also pixellated because during the compression pixels are lost. You get grainy and blurry pictures quickly.

PNG

PNG stands for Portable Network Graphics and has the file extension .png after the name of the file. These file types are much larger because they support lossless data compression. What this means is that you can enlarge a PNG file and it will not look pixelated. It stays crisp and clear.

Because they contain much more information than JPG files, PNGs are perfect to work with when you need a very clear image. So if you create your own graphics, are a designer or use images in a presentation that will be displayed on larger screens, like laptops or even projected onto a wall, you want to use PNG files.

Another important feature of PND files is that you can create images with transparent backgrounds. This is amazing feature for logos or any other graphic or cut out you want to use anywhere.

You can also use them on websites for a more professional look. Always make sure to optimize your images first, though. Otherwise PNGs will slow your website down. I use PNGs for this blog because I only have one image per blog and I optimize it before I upload it. Click on the link above for a blog post on how to do that.

GIFs

GIF, either pronounced with a hard g or a soft j, stands for Graphic Interchange Format with the file extension .gif. JPGs and PNGs are static images. GIFs are animated images, clips from videos and can even be mini-movies. They are usually used like memes or emojis and many social media sites and chat apps, like WhatsApp, Facebook Messenger and Mighty Networks, have their own GIF collections you can choose from.

You can also create your own GIFs on websites like GIPHY or Tenor, or you can make promotional mini-ads and share them everywhere. Websites and social media sites treat GIFs like image files and the file sizes are much smaller than video file sizes. Thanks to this special feature, you can share GIFs almost everywhere, depending on the image file sizes a website or social media app allows.

Since they have more information than static images, they are bigger than JPGs and PNGs and should also always be optimized before you upload them anywhere. When you do, they are a wonderful way to catch people’s attention and spread some fun.

Which file type should I pick?

When you want to choose an image, ask yourself a few questions first: Where are you sharing your image? What is most important to you right now? If the answer is your website where your priority is a small file size, JPGs are best, especially if you have more than one image per page.

What kind of information are you sharing? Does the image contain text or details that need to be clear on a large screen? Then you want to use PNGs. And what is the purpose of the picture? Purely decorative? JPG or PNG. To get people’s attention and/or make them laugh, a GIF is much better.

What are the technical requirements? Is my file the right size to be shared on the website or the social media site? Instagram, for instance, does not allow GIFs yet. And some sites only allow small image files so you stay flexible.

Clarity is key

When you work on your own website, remember that data adds up. The more images you have, the more data needs to be stored by the server but also by the device your visitors use when they come to your website. The more data a webpage has, the longer it takes to load and the more frustrated your visitors will be.

So before you pick the image file you want to get clear on what you want to achieve with it. Who will be looking at it and why? Then pick the smallest file type you need. Images are a wonderful way to connect with people. Make them count.

Mini-Course