Best image file types for Web and print

What file type should I use? Best file types for print and Web

best file type for web and print

Whether you’re creating digital art, scanning or editing digital files of traditional art, or working with digital photos, you may have questions about the best file type for Web and print. File types are associated with certain types of images and software used to create and edit them. This introductory article will show you the basics of image-file types.

A file extension is the two-to-four letter abbreviation at the end of a file. It’s preceded by a period: JPG (or .JPEG), .PDF, etc. Many programs allow you to save, export, and open various file extensions.

Best file type for Web

JPG is the best file type for Web use. If your drawing or photo is only for online display, save it as a 72ppi (or dpi) JPG.

PPI stands for pixels per inch. (dpi is dots per inch and has to do with printing, but “ppi” and “dpi” are often used interchangeably).

A JPG (pronounced jay-peg) can be opened and edited in most image-editing programs, such as Photoshop, Gimp, and Sketchbook. It is flat and cannot have layers or transparent areas.

A JPG is made of pixels. It’s a raster file. It can support 16.8 million colors, making it the best file type for Web display of images that have gradations of color, such as photographs and illustrations.

Saving and exporting/importing JPG files

If you’re using Photoshop and saving a JPG file to use online, use Save for Web. You’ll have to do that by hitting Export/Save for Web. That makes the file size much smaller. If you don’t have Photoshop, you can use free sites that do something similar, such as tinypng.com, which is for PNGs and JPGs.

If you reopen that saved for Web file in Photoshop, it will reopen at the resolution you saved before choosing Save for Web.

Note that Save for Web is marked as “legacy,” meaning Adobe may replace it with something else.


Creating and saving images for print

For print, 300 ppi (dpi) is the best size for creating and saving most image files. It’s high-resolution enough to print well, but not so huge it will slow down your program.

Do not try to upsize a small file to a larger size. Doing so will result in a pixelated (fuzzy, blurred) image.

JPGs are “lossy” and saving as a JPG causes data loss. For printing with zero loss in image quality, save as TIFF.

In some situations, a printer may ask you to use a JPG. For instance, some print-on demand-sites, which allow you to upload your work to sell on products that get digitally printed will ask for a JPG because the sites have a file-size limit. JPGs are smaller than TIFFs. Each site will specify its requirements.

If you created your file with layers, save the PSD so you can make further edits to each layer. Then flatten it and make it 72ppi before hitting Save for Web. You now will have two files, one ending in JPG, one ending in PSD. You can change the file names if you wish.

PNG and GIF files

PNG and GIF files are types of low-resolution files also used online. GIF files can only have 256 colors maximum. PNGs do not have that limitation (except PNG-8 does).. Only PNG-16 and PNG-24 allow for fully transparent areas.

The correct way to say GIF is a topic of intense, good-humored debate. The inventor of the image type prefers to say it as “jif,” not “gif” with a hard G.

GIFs are best for continuous-tone images, such as clip art or text. Both GIFs and PNGs can have transparent areas. GIFs are often used in simple animations.

jpg file savedforweb

RACCOON by Ivan Pskov. Saved as JPG

image saved as GIF

Same image saved as GIF with 256 colors. Notice that some colors aren’t showing.

in Photoshop, the resolution will change, leaving you with the same file size.

EPS (vector) files

EPS files are for vector graphics, which are scalable–they can be resized up or down with no effect on image quality.. Some programs that use EPS are Illustrator and CorelDRAW. Illustrator’s native file type is called AI, for Adobe Illustrator.

PDF files: both document and image

PDFs are a flexible type of file, as they are like a combination of document and image. They are good for printing and can be saved at high or low resolution. They can also have searchable text.

Showing art on high-resolution screens

High-res screens are much more common now than before, and your online images could look pixelated if not adjusted for them. Your image will show better on them if you create it at double the desired viewing size. You can then display it smaller on your site.

Using larger images will result in a larger file size. Larger files can slow page load. So you should be picky about which images get the increased size–the most-viewed ones are the best candidates. For instance, images on a splash page or home page, the header, and images seen on all pages, such as in a sidebar.

Best file type for print

A TIFF is considered the best file type for print. So, save your artwork as a TIFF.

JPG is usually thought of as Web-only, but this is not always the case. In situations such as for print-on-demand, where there is a file-size limit, the company may ask for high-res JPG files, since JPGs are smaller. A high-res JPG can yield reasonably good print results, but not as good as TIFF. A PSD file can be printed too, but layers increase file size by a lot.

If you just keep some basics in mind, it should be easy to figure out which file type to use to create and save your images.

Best file types for print and Web
Article Name
Best file types for print and Web
Discusses the different types of file types used to create and save images, and best practices.
Publisher Name
Tablets for Artists
Publisher Logo
This entry was posted in Articles on by .

About Vicky

I'm an author and illustrator who has used drawing tablets since the early days. I love how flexible and forgiving they make everything. I'm also fascinated by the technology. I started this site to bring knowledge to everyone. I want this to be the only place you need to go to learn about drawing tablets.

Leave a Reply

Your email address will not be published. Required fields are marked *