Which file format is best for images and graphics? And what do you need to know when converting from one to another? Learn about image types and conversion in our complete guide to image file formats.
Most of us don’t need to concern ourselves too greatly with image file formats. We take a picture on our smartphones or cameras, and perhaps post it online, and then we simply keep it on or computers, hard drives or in the cloud for safekeeping.
But when it comes to uploading images online, using graphics or archiving our creations, it pays to understand the strengths and weaknesses of the different formats available, and the kinds of images for which they may have been specifically designed.
Why do image formats matter?
At a basic level, understanding image formats helps you to maintain image quality. Whether an image is just for yourself or destined to be seen by others, you’ll clearly want it to look as good as possible – particularly if it’s designed to represent your brand.
It’s also important as some image types aren’t as widely supported as others, so they won’t be usable or viewable everywhere. Furthermore, some files support certain features that allow them to be displayed correctly, or edited at a later date, while others may not.
Another important reason concerns efficiency. Understanding file formats means understanding files sizes, which helps you to send and store images efficiently. This also affects load times for your website’s pages, which has a knock-on effect on both user experience and SEO.
In this article, we’ll run through the main image formats used today, and explain their pros and cons, before we take a look at the things you should bear in mind when converting an image from one format to another.
Best file formats: At a glance
|JPEG (.jpeg)||Widely supported and used online, with small file sizes making it very efficient. Compression artefacts can be an issue, however, and it’s not ideal for graphics.|
|PNG (.png)||Designed for graphics and widely supported online. Can preserve transparency layers, unlike most other formats. Not as efficient as JPEG and not designed for real-world images, but a good choice for photograph/graphics composites.|
|TIFF (.tif)||Great where maximum image quality is required and for archiving. Can be saved with or without lossy compression, although file sizes are larger than those of equivalent JPEGs, which makes it less ideal for online display.|
|PSD (.psd)||Photoshop’s default file format. Ideal for saving an image with layered edits, but images must be converted to another format before being displayed online.|
|HEIC (.heic)||Apple’s proprietary format for images captured using iPhone and iPad devices running iOS 11 or later. Designed to produce images with the quality of JPEGs but with more efficient compression. Limited support outside of Apple’s ecosystem.|
|SmartFrame||Interactive image format designed for optimum presentation and security online, and perfect for graphics that don’t require the preservation of transparency channels. Easily embedded using <script> with support for thumbnails on social media and in search engines.|
JPEG (extension .jpg or .jpeg)
The JPEG is the most widely used image file format online, and the default file type for images from most smartphones and dedicated cameras.
It was designed specifically for photographs of real-world subjects, also known as ‘continuous-tone’ images, rather than graphics or illustrations, and it’s supported by all kinds of devices, displays and web browsers. If you’re ever asked to supply an image online, or when applying for an official document, a JPEG will usually be appropriate.
File sizes are usually small enough for such images to be shared and posted online without any issues with speed and performance. But to get these efficient file sizes, JPEGs have to be compressed.
JPEGs can be compressed to particularly high ratios, which is great from the perspective of storage, but it’s the nature of the compression – known as ‘lossy’ compression – that can create problems.
With lossy compression, some information is discarded when the image is created in an attempt to get the file size down to a more reasonable level. This isn’t usually something you notice, but this becomes more problematic as you compress images to a greater degree.
It can lead to unsightly artefacts, such as defined blocks where there should be smooth transitions between different areas. These are particularly obvious when an image has large flat areas with little detail, such as with blue skies.
Opening and saving the same file over time also degrades the image’s quality, as it’s constantly being compressed and uncompressed in a lossy way, losing a little more information each time it’s saved.
There have been forays into ‘lossless’ JPEG compression, but these are not supported by mainstream devices or editing programs.
One thing JPEGs do not support is layers (explained below). Alpha channels, which will be discussed a little later, are also not supported by JPEGs.
What is a layer?
Real-world photographs and other images that contain natural elements
Not so good for:
Graphics and images that contain graphics, as well as images with large areas of flat detail (which can also give rise to compression artefacts)
PNG (extension .png)
The Portable Network Graphics (PNG) file is the first choice for graphics online. While it doesn’t quite have as wide a level of support as JPEG, in most cases where it isn’t supported, you’re likely to be using real-world images rather than graphics anyway.
It is, however, supported sufficiently for it to be used in emails, on social media sites and so on. Indeed, it was conceived with the internet very much in mind.
The PNG format has superseded the older GIF format for graphics, which today is used more commonly for animations, and it improves on GIF in a number of ways. While both formats use lossless compression, PNG uses an alternative method that results in greater level of compression. It also supports a far broader range of bit depths, which means that it can describe a significantly wider range of colours than GIF files.
One of the main advantages of the PNG format over others here is support for alpha channels. These allow pixels to be transparent to the degree of your choosing, so that when an image is saved this way, it can be placed over, and blend into, a differently coloured background.
So, a circular graphic, or one with more complex details (such as the one above), would need to be saved with a transparency layer, as any background on which the graphic is placed can then fill in any areas that don’t show detail. If saved as a JPEG, such an image would, by default, have these transparent pixels filled by solid a white.
Compression is lossless, which is great from the perspective of image quality. PNG files tend to be larger than equivalent JPEGs in file size, although they’re often used for smaller graphics with information that’s easy to compress, rather than real-world photographs with plenty of intricate detail.
Like JPEGs, PNG files support RGB color spaces, although as they are designed for online use rather than printing, CMYK spaces are not supported. Support is also provided for images with a bit depth of up to 16 bits per color channel, as opposed to the maximum 8-bit support provided by JPEGs.
As with JPEGs, you can open a PNG file and edit it using layers, but you cannot save it with these intact. If, therefore, you need to save an image you may wish to edit in the future, the PSD or TIFF formats would be better options.
Online graphics, particularly when transparency layers are required
Not so good for:
Not usually required for photographic images, and not as efficient as JPEGs
TIFF (extension .tif or .tiff)
For a handful of good reasons, TIFF files aren’t as widely used as JPEGs. But when it comes to maintaining image quality, it pays to understand their advantages.
Arguably the main advantage concerns compression. You can choose to leave files uncompressed or compress them losslessly, which preserves image quality (although lossy compression is also an option). By contrast, JPEGs are always compressed using lossy compression, which discards information and can lead to artefacts appearing in images.
Because of this, TIFF files are a great choice for many applications. Photographers will typically save their edits as TIFF files, particularly as they can be saved with editable layers. They’re also an ideal format when it comes to printing images, and they’re widely used for scientific purposes, where distortion from compression artefacts cannot be tolerated.
Support for layers and avoidance of compression artefacts also makes them perfect for archiving images, although it’s also wise to keep the Raw file from the camera (where available) as this provides a better starting point for editing.
The main downsides of TIFF files are their size and the fact that they aren’t as widely supported as JPEGs. One would not normally post weighty TIFF files online, as JPEGs are often sufficient, better supported, and don’t affect page load times like TIFF files do.
High-quality prints, scientific applications and for images otherwise likely to be affected by lossy compression artefacts
Not so good for:
Large files aren’t ideal when embedding online, and support is more limited than with JPEG
PSD (extension .psd)
PSD files, whose name derives from the term Photoshop Document, are, unsurprisingly, supported by Adobe Photoshop.
It’s the default file format when you create a new file in Photoshop, and some other Adobe programs support it too, although certain programs from other manufacturers – such as Corel’s CorelDRAW software and the free open-source editor GIMP – can also open these. You can even preview PSD files in Google Drive, although many files are likely to be too large to be opened here.
The main advantage of PSD files over JPEGs is that they can be saved with individual layers, and without lossy compression. Each layer can have separate adjustments made to it, so that when you open the file back up you can add and discard individual layers, and edit existing layers, without affecting the rest of the image.
These layers can also have special properties. They might be alpha layers, for example, which can have their transparency determined, as well as text layers and editing masks among other things.
PSD files are best thought of as works in progress, or files that you may want to revisit and re-edit, rather than finished works. That’s not to say that archiving a PSD file with multiple layers intact is a bad idea, but if you know you will no longer be editing an image, it’s easier just to save it as a TIFF file – which you can save with layers, just to be in the safe side.
Files that may need to be re-edited, particularly where you’ve made good use of layers
Not so good for:
Immediate use online due to size and lack of support for PSD format
HEIC (extension .heic)
HEIC might not be as familiar as the JPEG or PNG standard. Indeed, you may have not even heard of it – although millions of people are currently using it.
So what is HEIC? This is the default image format Apple has used for its iPad and iPhone devices since the launch of iOS 11. When you capture an image on an iPhone or iPad running iOS 11 or a more recent version, it will be saved in this format (unless you disable it, in which case it will capture JPEGs).
HEIC is the container format for HEIF files, which stands for High Efficiency Image File format. It was designed to retain the visual quality of the JPEG format but with the advantage of smaller file sizes.
The main issue with the HEIC format is one of compatibility. When you share a HEIC file between Apple devices it will retain its file format, but when shared to a device that does not support it, it will convert it to JPEG to ensure compatibility.
Efficient storage on mobile devices
Not so good for:
Compatibility with devices outside of the Apple ecosystem
All of the above image formats are used to produce a file that can be copied, saved and moved between different devices. This may be convenient in some respects, but security options are limited and there’s no way of knowing how many copies of an image are out there – and indeed, where these can be found.
The SmartFrame format is different. While a SmartFrame appears just like any other image online, the fact that it’s being streamed means that it’s not possible to download it to a computer or another device. As soon as the user closes the browser, the streamed SmartFrame vanishes from the page as though it never existed.
The other major benefit of streaming the image is that you have complete control over where the SmartFrame can be viewed and how it can be shared, with analytics on every interaction reported back to you.
You also have the choice of adding a raft of interactive elements, such as the option to zoom into the image or view it in a full-screen mode. You can also have copyright messages displayed whenever anyone tries to download or screenshot your image, and buttons that direct people to your website or online shop. You can even choose to have ads within your images to generate additional revenue.
All of the above functionality can be enabled, disabled and amended whenever you like, and updates will be applied instantly – regardless of where your images are online. Changed your watermark style? Spotted a typo in your caption? Want to allow people to share your SmartFrame on Facebook but rescind sharing options for Twitter? You can do it all in one place in a matter of seconds.
SmartFrame supports JPEG or TIFF files, with a maximum image size of 100MP – more than sufficient for online display. It’s suitable for use in any environment online where you would ordinarily use a JPEG, although it needs to support <scripts> as this is how the SmartFrame is embedded – otherwise a small, customizable thumbnail will be used in its place, which links through to the original SmartFrame.
Layers are not supported, as SmartFrames are not designed to be edited through layers, rather interactive elements. While SmartFrame does not currently support PNG files, you can safely convert these images to TIFF files before uploading to SmartFrame to avoid any compression artefacts that might result from converting to a JPEG. If you need to preserve alpha layers for graphics, however, you should continue to use PNG files.
Maximum security and interactive display online. Ideal for valuable images that are more likely to be stolen
Not so good for:
Wherever transparency layers in graphics are required
Converting images from one format to another
How do you convert images from one format to another? And what should you think about before you do so?
We take a look at some of the most popular conversions below, and the things you should bear in mind when moving from one to another.
PNG to JPG
Why convert a PNG to JPG?
The most likely reason why you would need to convert a PNG to a JPEG is that a platform or service you’re using doesn’t support PNG files.
What to think about when converting from PNG to JPG
Like JPEGs, PNG files are compressed as standard – although the way in which this happens with PNGs is quite different.
PNGs use a form of compression known as lossless compression, whereas JPEG use lossy compression. So what’s the difference? Whereas lossy compression discards information when compressing files, and then attempts to use the remaining information to essentially fill in the blanks, lossless compression simply reorganises the information for efficiency.
This means that images compressed with lossy compression stand to remain higher in quality. Images that are compressed using lossy compression stand to suffer from further artefacts as they are opened and closed, which degrades the file over time.
The main issue you’re likely to encounter when converting PNG files to JPEGs is compression. Heavily compressed JPEGs are likely to show a blocking effect where there is supposed to be a gradual change in tone between different areas.
Where graphics are involved, you’ll also tend to lose a little crispness in details, as the images above show. These issues can be even more problematic when an image is uploaded to a social media site or somewhere else online, where additional compression can take place.
You may also see worse results with certain colours. PNG files with graphics that make heavy use of reds can be particularly problematic when converted to JPEG.
Neither PNG files nor JPEGs support layers, so there is no issue with losing any upon conversion.
JPG to PNG
Why convert from JPG to PNG?
It’s not that usual to convert from a JPEG to a PNG file, although there are good reasons for doing so.
You may have found compression artefacts to be an issue with a JPEG posted online, and so converting it to a PNG file may maintain the image’s quality. This is useful if the online platform in question supports both PNG and JPEG formats, although bear in mind that it may be subject to compression of some sort as you upload this (which you cannot control).
Not only does saving an image as a PNG mean you’ll be using lossless, rather than lossy, compression, but you no longer have to the issue of images degrading over time as they are opened and saved over an over (as you do with JPEGs).
It may also be the case that you have a photograph that incorporates some sort of graphical element saved as a JPEG. In this case, you should consider saving the image as a PNG file to help maintain the quality of the graphics.
What to think about when converting from JPG to PNG
Your file size is likely to be larger, and you won’t be able to use it where PNG files are not supported.
PNG files also don’t retain all the Exif metadata of JPEGs, which may be important depending on how an image is used, although they can store a full range (Core and Extension) of IPTC metadata.
TIFF to JPG
Why convert a TIFF to JPG?
There are a few reasons why you may want, or need, to convert an image from a TIFF file to a JPEG.
Probably the most common reason will be a lack of support for the TIFF format. Many online portals and social media sites will not allow a TIFF file to be uploaded, but they will happily accept a JPEG.
The other issue concerns size. Although TIFF files can be compressed, they are usually significantly larger than JPEGs in file size, particularly when saved with their layers intact. Even when these layers are flattened, the file size may still be over the threshold set by certain websites, and when sending email attachments.
Naturally, producing smaller files makes the JPEG far more suited to situations in which you need to store a number of images within a fixed amount of storage space, such as on flash drives or cloud storage service with limited space.
What to think about when converting from TIFF to JPG
TIFF and JPEG images are similar in the sense that they are designed to be the final format for an image, as opposed to a Raw file from a camera, or a PSD file, which you may want to revisit and re-edit.
For that reason, conversions are relatively straightforward and successful, particularly when you save images on the highest-quality JPEG setting.
That said, the loss of layers is one thing you will want to think about when going from a TIFF to a JPEG. If you need to send a finished image to a client or someone else who may need to adjust layers, TIFF is the way to go.
Compression artefacts when moving from TIFF to JPEG are a concern too, although in many images this may only be a problem if the image itself contains large, flat areas with little detail, where these artefacts are more apparent.
Another difference is that JPEGs can only be saved in a maximum 8-bit format (8 bits per color channel), whereas TIFF files can be saved in 16-bit per color channel. This still means you have the potential for 256 values per red, green and blue color channel in JPEGs, which gives you around 16.7 million colors in total – incidentally, more than the human visual system can make out. But if you plan to make further edits, saving images with the highest level of information is always desirable.
PSD to JPG
Why convert from PSD to JPG?
If you’ve edited your image and you no longer need to keep these layers separate, you may want to save the image as a JPEG or a TIFF file.
While it’s a good idea to save it as a TIFF file to avoid compression artefacts, if you need it for an online printing service, a social media page, or anywhere else where a PSD is unlikely to be accepted, JPEG should work just fine.
What to think about when converting from PSD to JPG
JPEGs do not support layers like PSD files, so while you’re likely to end up with a smaller file than a PSD file, it won’t be as flexible when you open it back up in a program like Photoshop.
JPG/TIFF to SmartFrame
The process of converting a JPEG or TIFF to a SmartFrame is straightforward: you just upload it to the SmartFrame Admin Panel and it happens instantly.
It’s not possible to convert an image to a SmartFrame in any other way, such as through Photoshop or a similar image-editing program.
Why convert from JPG/TIFF to SmartFrame?
There are many reasons you may want to use SmartFrames over JPEG or TIFF files online, although these tend to fall into one of four categories: presentation, protection, insights and monetization.
By converting your images to a SmartFrame, you can allow people to zoom into them; have them display in full screen; add captions and links; and include interactive elements such as sharing icons and newsletter sign-up prompts.
You can choose whether to have small JPEG thumbnails of your SmartFrames appear in search engine results and on social media platforms, and you can watermark these and set the size to the level of your choosing (and these link through to original SmartFrames).
You also benefit from right-click and download protection, as well as screenshot-prevention technology and copyright warnings that appear whenever someone tries to steal your image.
All interaction with your SmartFrame will be fed back to you through the SmartFrame Admin Panel. Every click, share, embed, theft attempt and more is detailed in a report that can be accessed whenever you need.
Finally, you can profit from your images in a number of ways. You can add a ‘Buy Now’ button that directs people to your online store, or allow SmartFrame to serve ads within them. If you license your image, you also have full control and visibility over where that image is shared and emebdded, and rescind this access if you ever need to.
What to think about when converting JPG/TIFF to SmartFrame
SmartFrame supports images measuring up to 50MB in size, with a maximum resolution of 100MP. This should be fine for most images, although particularly high-resolution TIFF files may exceed 50MB, so consider saving with LZW compression first.