Jpg is what type of file

The size of film is also inches or mm. Sensor size mm or film size mm must be enlarged to the print or viewing size. By varying the printing resolution pixels per inch on paper , we can print the image about any size we wish, but the quality will vary. In strong contrast to paper, monitor screen size is dimensioned in pixels , and image size is also dimensioned in pixels.

The image pixels fit the screen pixels one for one, so to speak. A x image will show as x pixels on the screen. If the image size is larger than the screen size, we normally are shown a temporary resampled copy of more suitable smaller size.

However, print paper is dimensioned in inches or mm, so images for printing must be scaled to be spaced out so many pixels per inch or mm often called dpi, jargon for pixels per inch on paper.

See basic differences, and more detail between using images printed or on the video screen. Note that uncompressed bit RGB data is three bytes per pixel , regardless of image size. Compressed files are uncompressed again when opened into computer memory for showing the count of pixels remains unchanged. Bytes KB. These are not the only choices, but they are good and reasonable choices.

Compression varies with type of compression, but degree of compression also varies with the image content bland areas with sparse detail, like walls or sky, compress very effectively, But high detail areas compress less effectively. Wide-range tonal shifts gamma and white balance in the initial editing processing can benefit from more than 8-bits. Scanners and cameras are at least bits for this reason. However our monitors and printers expect 8-bit data. And JPG is only 8-bits. PNG-8 is Indexed color for graphics, a maximum of colors.

Documents - images of graphics and text - line art, multi-page, fax, etc - this will be TIF files. See Properties chart above. We select the file type that supports the properties we need. The only reason for using lossy compression is for smaller file size, usually for internet transmission speed or storage space. On the web, JPG is the clear choice for photo images smallest file, with image quality being less important than file size , and GIF is common for graphic images, but indexed color is not normally used for color photos PNG can do either on the web.

Other than the web, TIF file format has been the undisputed leader when best quality is desired, largely because TIF is so important in commercial printing environments.

High Quality JPG can be pretty good too, but don't ruin them by making the files too small. If the goal is high quality, you don't want small. Adobe RGB color space may be OK for your home printer and profiles, but if you send your pictures out to be printed, the mass market printing labs normally only accept JPG files, and only process sRGB color space. What are JPG artifacts? Something we all need to know, but it takes more to show this, so it was placed on its own page.

Difference in photo and graphics images Photo images have continuous tones , meaning that adjacent pixels often have very similar colors, for example, a blue sky might have many shades of blue in it.

Normally this is bit RGB color, or 8-bit grayscale, and a typical color photo may contain perhaps a hundred thousand RGB colors, out of the possible set of 16 million colors in bit RGB color.

Graphic images are normally not continuous tone gradients are possible in graphics, but are seen less often. Graphics are drawings, not photos, and they use relatively few colors, maybe only two or three, often less than 16 colors in the entire image. In a color graphic cartoon, the entire sky will be only one shade of blue where a photo might have dozens of shades.

A map for example is graphics, maybe 4 or 5 map colors plus 2 or 3 colors of text, plus blue water and white paper, often less than 16 colors overall.

These few colors are well suited for Indexed Color , which can re-purify the colors. Don't cut your color count too short though, there will be more colors than you count. SVG is an ideal choice for images which can be represented using a series of drawing commands, especially if the size at which the image will be rendered is unknown or may vary, since SVG will smoothly scale to the desired size.

It's not generally useful for strictly bitmap or photographic images, although it is possible to include bitmap images within an SVG. TIFF is a raster graphics file format which was created to store scanned photos, although it can be any kind of image.

It is a somewhat "heavy" format, in that TIFF files have a tendency to be larger than images in other formats. This is because of the metadata often included, as well as the fact that most TIFF images are either uncompressed or use compression algorithms that still leave fairly large files after compression.

Every value in a TIFF file is specified using its tag indicating what kind of information it is, such as the width of the image and its type indicating the format the data is stored in , followed by the length of the array of values to assign to that tag all properties are stored in arrays, even for single values. This allows different data types to be used for the same properties.

For example, the width of an image, ImageWidth , is stored using tag 0x , and is a one-entry array. A single TIFF file can contain multiple images; this may be used to represent multi-page documents, for example such as a multi-page scanned document, or a received fax.

However, software reading TIFF files is only required to support the first image. Long ago, some browsers supported TIFF images in web content; today, however, you need to use special libraries or browser add-ons to do so. As such, TIFF files are not useful within the context of web content, but it's common to provide downloadable TIFF files when distributing photos and other artwork intended for precision editing or printing.

WebP supports lossy compression via predictive coding based on the VP8 video codec, and lossless compression that uses substitutions for repeating data. WebP also supports animation: in a lossy WebP file, the image data is represented by a VP8 bitstream, which may contain multiple frames.

Looping is supported. WebP now has broad support in the latest versions of major web browsers, although it does not have deep historical support.

Note: Despite having announced support for WebP in Safari 14, as of version XBM X Bitmap files were the first to be supported on the Web, but are no longer used and should be avoided, as their format has potential security concerns. Modern browsers have not supported XBM files in many years, but when dealing with older content, you may find some still around.

XBM uses a snippet of C code to represent the contents of the image as an array of bytes. Each image consists of 2 to 4 define directives, providing the width and height of the bitmap and optionally the hotspot, if the image is designed as a cursor , followed by an array of unsigned char , where each value contains 8 1-bit monochrome pixels.

The image must be a multiple of 8 pixels wide. For example, the following code represents an XBM image which is 8 pixels by 8 pixels, with those pixels in a black-and-white checkerboard pattern:. Picking the best image format for your needs is likely easier than video formats, as there are fewer options with broad support, and each tends to have a specific set of use-cases. Photographs typically fare well with lossy compression depending on the encoder's configuration.

To maximize quality and minimize download time, consider providing both using a fallback with WebP as the first choice and JPEG as the second. Otherwise, JPEG is the safe choice for compatibility. For smaller images such as icons, use a lossless format to avoid loss of detail in a size-constrained image.

While lossless WebP is ideal for this purpose, support is not widespread yet, so PNG is a better choice unless you offer a fallback. If the icon can be represented using vector graphics, consider SVG , since it scales across various resolutions and sizes, so it's perfect for responsive design. Unless you're willing to compromise on quality, you should use a lossless format for screenshots.

This is particularly important if there's any text in your screenshot, as text easily becomes fuzzy and unclear under lossy compression. For any image that can be represented using vector graphics, SVG is the best choice. Otherwise, you should use a lossless format like PNG. If you do choose a lossy format, such as JPEG or lossy WebP, carefully weigh the compression level to avoid causing text or other shapes to become fuzzy or unclear.

Skip to main content Skip to search Skip to select language Web technology for developers Web media technologies Media type and format guide: image, audio, and video content Image file type and format guide Change language.

The image file formats that are most commonly used on the web are listed below. AVIF offers slightly better compression, but is not quite as well-supported in browsers and does not support progressive rendering. True color 8 and 16 Each pixel is represented by three D -bit values indicating the level of the red, green, and blue color components.

Indexed color 1, 2, 4, and 8 Each pixel is a D -bit value indicating an index into a color palette which is contained within a PLTE chunk in the APNG file; the colors in the palette all use an 8-bit depth. Microsoft Windows Photo Viewer. Microsoft OneDrive. Microsoft Paint. Adobe Photoshop Adobe Photoshop Elements Corel PaintShop Pro.

Any picture viewer. Any web browser. MacPhun ColorStrokes. While PNGs are "lossless," meaning you can edit them and not lose quality, they are still low resolution. The reason PNGs are used in most web projects is that you can save your image with more colors on a transparent background. This makes for a much sharper, web-quality image. GIFs are most common in their animated form, which are all the rage on Tumblr pages and in banner ads. It seems like every day we see pop culture GIF references from Giphy in the comments of social media posts.

Due to the limited number of colors, the file size is drastically reduced. This is a common file type for web projects where an image needs to load very quickly, as opposed to one that needs to retain a higher level of quality. A TIF is a large raster file that doesn't lose quality. This file type is known for using "lossless compression," meaning the original image data is maintained regardless of how often you might copy, re-save, or compress the original file.

Despite TIFF images' ability to recover their quality after manipulation, you should avoid using this file type on the web. Since it can take forever to load, it'll severely impact website performance. TIFF files are also commonly used when saving photographs for print. PSDs are files that are created and saved in Adobe Photoshop, the most popular graphics editing software ever. This type of file contains "layers" that make modifying the image much easier to handle. This is also the program that generates the raster file types mentioned above.

The largest disadvantage to PSDs is that Photoshop works with raster images as opposed to vector images. PDFs were invented by Adobe with the goal of capturing and reviewing rich information from any application, on any computer, with anyone, anywhere.

I'd say they've been pretty successful so far. If a designer saves your vector logo in PDF format, you can view it without any design editing software as long as you have downloaded the free Acrobat Reader software , and they have the ability to use this file to make further manipulations.

This is by far the best universal tool for sharing graphics. EPS is a file in vector format that has been designed to produce high-resolution graphics for print. Almost any kind of design software can create an EPS. The EPS extension is more of a universal file type much like the PDF that can be used to open vector-based artwork in any design editor, not just the more common Adobe products. This safeguards file transfers to designers that are not yet utilizing Adobe products, but may be using Corel Draw or Quark.

AI is, by far, the image format most preferred by designers and the most reliable type of file format for using images in all types of projects from web to print, etc. Adobe Illustrator is the industry standard for creating artwork from scratch and therefore more than likely the program in which your logo was originally rendered. Illustrator produces vector artwork, the easiest type of file to manipulate.

It can also create all of the aforementioned file types. Pretty cool stuff!