Thumbnails Online Tutorials

Thumbnails are ideally implemented on web pages as separate, smaller copies of the original image, in part because one purpose of a thumbnail image on a web page is to reduce bandwidth and download time.

Some web designers produce thumbnails with HTML or client-side scripting that makes the user's browser shrink the picture, rather than use a smaller copy of the image. This results in no saved bandwidth, and the visual quality of browser resizing is usually less than ideal.

Displaying a significant part of the picture instead of the full frame can allow the use of a smaller thumbnail while maintaining recognizability. For example, when thumbnailing a full-body portrait of a person, it may be better to show the face slightly reduced than an indistinct figure. However, this may mislead the viewer about what the image contains, so is more suited to artistic presentations than searching or catalogue browsing.

Thumbnail makes for smaller, more easily viewable pages and also allows viewers to have control over exactly what they want to see.

In 2002, the court in the US case Kelly v. Arriba Soft Corporation ruled that it was fair use for Internet search engines to use thumbnail images to help web users find what they seek.

The word "thumbnail" is a reference to the human thumbnail and alludes to the small size of an image or picture, comparable to the size of the human thumbnail. While the earliest use of the word in this sense dates back to the 17th century, the American Heritage Dictionary of Idioms is reported to have documented that the expression first appears in the mid-19th century to refer to 'a drawing the size of the thumbnail'. The word was then used figuratively, in both noun and adjective form, to refer to anything small or concise, such as a biographical essay. The use of the word "thumbnail" in the specific context of computer images as 'a small graphical representation, as of a larger graphic, a page layout, etc.' appears to have been first used in the 1980s.

• The Denver Public Library Digitization and Cataloguing Program produces thumbnails that are 160 pixels in the long dimension.
• The California Digital Library Guidelines for Digital Images recommend 150-200 pixels for each dimension.^[6]
• Picture Australia requires thumbnails to be 150 pixels in the long dimension.^[7]
• The International Dunhuang Project Standards for Digitization and Image Management specifies a height of 96 pixels at 72 ppi.^[8]
• YouTube recommends the resolution of 1280×720 (with a minimum width of 640 pixels) with an aspect ratio of 16:9.^[9]
• DeviantArt automatically produces thumbnails that are maximum 150 pixels in the long dimension.
• Flickr automatically produces thumbnails that are a maximum 240 pixels in the long dimension, or smaller 75×75 pixels. It also applies unsharp mask to them.
• Picasa automatically produces thumbnails that are a maximum 144 pixels in the long dimension, or 160×160 pixels album thumbnails.

The term vignette is sometimes used to describe an image that is smaller than the original, larger than a thumbnail, but no more than 250 pixels in the long dimension.

Directors, storyboard artists and graphic designers, as well as other kinds of visual artists, use the term "thumbnail sketch" to describe a small drawing on paper (usually part of a group) used to explore multiple ideas quickly. Thumbnail sketches are similar to doodles, but may include as much detail as a small sketch. A "comprehensive" thumbnail sketch of a printed project, more or less to final size, is often referred to as a "comp", and can be highly detailed, with production information included. The purpose of thumbnails was to visualize the ideas in a miniature form, similar to an illustration shorthand. Often, the old school animators used this process to quickly jot down the key "poses" that were part of an animation sequence. These compact drawing were then pinned up above the animation table, within easy view. As the animator worked through creating the final drawings of each pose, the thumbnails helped to keep the original ideation relevant.

• Image organizer
• Contact print, a film cognate of the thumbnail
• Thumbshot