What is a Thumbnail?
A thumbnail is generally a small image automatically generated by a computer program from a larger image (e.g. a photo) that is supposed to represent the larger image. A thumbnail can also be generated from a video instead of an image, in which case the thumbnail represents the video. In some cases, a thumbnail can also be a manually created image used to represent a larger image or video. Thumbnails are often part of an interactive button or link, which can be clicked to open the full image or video they represent. In some applications, thumbnails are used instead of text to label graphical items, e.g. layers in image editors often have thumbnails that represent them.
Why Thumbnails Exist?
Generally, images are rather large in dimension, so you can't fit many images at once on the screen. In old systems, a high-resolution image could occupy a lot of RAM memory, so you couldn't even load many high-resolution images even if you had space to display them. A solution for this is the thumbnail. Because the thumbnail is smaller, it occupies fewer pixels on the screen than the high-resolution image it represents, so you can have more thumbnails than normal images on the screen at a time. It also occupies fewer bytes in memory. On the Internet, a thumbnail file will also is faster to download, so a common strategy is for a webpage to download all thumbnail images first, and then when you click on a thumbnail, the webpage downloads the high-resolution images as you need them.
What is the Thumbnail File Format?
Thumbnails are normal digital images, they just have a lower resolution than normal. Which format is used depends on various factors.
Often, the thumbnail will be in the same format as the original image, so a JPG image will have a JPG thumbnail, a PNG image will have a PNG thumbnail, a GIF image will have a GIF thumbnail, and so on.
This is mainly because PNG supports transparency while JPG does not, and GIF supports animated images while PNG does not, so a matching format needs to be used or some features will be lost. It's common to not use GIF as the thumbnail doesn't need to be animated, for example, and animating it will make it extremely large, which defeats the point of using a thumbnail. When JPG is used, sometimes a very low "JPG quality" level is used, such as 50 or 40, in order to make the thumbnail even smaller.
Nowadays we also have WebP, which supports transparency and animation and has smaller compression than the other formats (although quality-wise it tends to look blurrier than JPG). WebP is a good choice for thumbnails of images on the web since it generates smaller files that can be downloaded faster, and is a format supported by all major web browsers.
Thumbnail Generation and Cache
Although thumbnails use fewer bytes in memory than the original image, they still load slower than loading a full-resolution image. More precisely, it's not that they take longer to load, it's that the first time you're supposed to see the thumbnail of an image, the thumbnail doesn't exist yet, so it needs to be automatically generated.
In order to generate a thumbnail from an image, the computer needs to load the image in memory, which means that if you have 1000 high resolution images in a folder, the computer needs to load and resize 1000 images into their respective thumbnails before displaying the thumbnails for you.
It's possible that your computer can't even actually load that many high-resolution images in memory at once. 1000 images at 6 megapixels each with 24 bpp is 1000 * 60000000p * 24b = 18 gigabytes of memory.
So what's going to happen is that the program trying to display the thumbnails of the images on your computer, such as your file manager, is going to load the images one by one, or only handful at once, generate their thumbnails, and then repeat the process for the next images. It's possible that the computer program won't even generate thumbnails for all files in a folder if those files aren't visible in the main pane of the window.
The generated thumbnails are typically stored in a cache, so that the next time you need the thumbnail for the same image, it doesn't need to be re-generated, it can simply be loaded from the cache. Often, this cache will be a folder automatically created by the program or the system that gets automatically cleaned (i.e. cached files are temporary files), so you'll have a bunch of small JPGs and PNGs saved in this thumbnail cache that are somehow associated to the original image files wherever they are in your computer.
In order to generate a thumbnail from a file it's necessary to have a program capable of loading the file and creating an image out of it. This program is called a thumbnailer. For image formats (JPG, PNG, etc.), thumbnailing is a very simple process, but it becomes more complicated with other file types. In the case of a video, a frame of the video needs to be extracted. There are also some file formats like office documents (e.g. presentations) that are neither image nor video but that can have their own thumbnails as well.
What is the Difference Between a Thumbnail and an Icon?
In a file manager, a thumbnail would be generated for each image file, while an icon is only associated with a file type. So all JPG files have a single JPG icon, but each JPG image has their own thumbnail.
Manual Thumbnails
In some websites where it's possible to post images and videos, e.g. artwork on art sharing websites, or videos on Youtube, it's possible to manually create a thumbnail for the associated image or video.
Traditionally, websites that let you select a thumbnail would set requirements that you would have to comply: e.g. the image file must be a JPG, the dimensions must be at most 100x100px, the file size must be at most 20kb, and so on. Nowadays most websites don't have requirements like this because they just automatically resize the images the users upload instead of distributing the thumbnail that the user uploaded as-is.
On Youtube, it's recommended for thumbnails to be at least 1280x720px. This might sound surprising since that's not a "small" size, that's the size of a normal image. One reason for this is that Youtube thumbnails are displayed much larger than the typical thumbnail, and in devices that support high pixel densities.
Leave a Reply