One of the many things that we have to take into account, when we start with our web or blog is to determine which image format is optimal for us. We know the jpg format more than enough, because it has accompanied us in the images of our life, but when we start working on the design, whether web or graphic, we see that the options are expanded and new formats appear.
Although there are some more, the best known are jpg, png and gif. They are the most used and also the main ones exported in the editing programs. Each one has specific characteristics, although in many cases they are complementary, that is, it is normal to include in the same project more than one image format. This is so, because we should not choose a specific image format for a particular project, but it will depend on each of the images of it.
Nobody likes to open a web where the images take so long to load that we get tired and we close the tab. Nor that a background image appears when it did not have to appear. They are “small” details, but they will improve the user experience and they will make your website have a more dynamic structure.
Remember also that we are talking about image format and not graphics, because if we talk about the latter we would have to contemplate other different options, quite effective as the .svg (but we will see it another time.)
So, although we will make a brief written summary of each of the formats, at the end of the article you can see an infographic in which we will relate each of the three formats with their similarities and differences. As you will see, each works better depending on what that image contains, and it will be in our hand to decide which the best for the image is.
JPG
It is perhaps the most widely used and also the best known format on the list. This is because it is the format in which they usually are the images of the cameras, being the one that more colours can capture.
In addition, it is widely used on the internet since it is able to reduce the size of the image without decreasing its quality. This is because sometimes the eye is not able to capture all the colours that a jpg can display, so even reducing the image we are going to see it with all the details.
In this way, it is a format widely used for images, but not recommended for illustrations or graphics, since they would lose quality compressing them.
It is convenient to emphasize its compression without loss of quality, which means that we do not need to upload the images as they leave the camera, but we can resize them to a size that suits our website without losing quality.
GIF
The main feature of GIF is that it allows transparencies and animations, so it makes it a very popular format for the realization of the latter.
Another feature of this format is that it makes a progressive load, so that a low quality version is first loaded and then the details appear. In this way, we know that although the connection is lower, the image is going to load and therefore our user will see it.
Anyway, having fewer colours than the jpg, it makes it more suitable for the use of illustrations and graphics but not for high quality images.
PNG
It was born as an alternative to GIF, because it realizes the transparencies and the graphics with a better quality. It is more similar to JPG.
Having transparency makes it a widely used format on the web, for those jobs that do not have backgrounds and also for the use of illustrations and graphics. In summary, we will have fewer heavy images that work with high quality.
Actually, if we are not going to make an animation, and we need an image with transparency, it is more convenient to choose this format before the GIF, since the quality is greater.
