File Types

What is the best image file type for eLearning?

A Beginner's Guide to Image File Types

For eLearning, is quality or file size more important in selecting an image file type?

  • File Size
  • Quality

Choices

With so many choices, how do we know what image file type to use in  eLearning?  

There are many considerations, such as file size, graphics, colors, and transparency.  In this session, we will cover 3 of the most popular image file types that keep your training session moving fast by keeping the file size down. 

jpg

JPG

Joint Photographic Experts Group

Pros:

  • Best for photographs.
  • Millions of colors
  • Compression gives you great quality for the file size. 

Cons:

  • Does not support transparency.
  • Lossy- jpegs lose data when they are compressed.  Over multiple compressions image quality can diminish. 
  • Logos and graphics can be fuzzy.    



gif

gif

Graphic Interchange Format

Pros:

  • Animation!
  • Good for Logos and Graphics.
  • Supports Transparency.
  • Lossless - does not lose quality when compressed. 

Cons:

  • Limited to 256 colors. 
  • Often has a biggest file size of the 3.   

png

png

Portable Network Graphics

Pros:

  • Supports transparency.
  • Lossless - will not lose quality when compressed.
  • Good for photographs, images and graphics.

Cons:

  • Can have a bigger file size than jpg. 

Match the image type to its best use.

  • jpg
    Photographs
  • png
    Layered graphics
  • gif
    Animated clips

Review

What is most important for your image?  

Each image file type has advantages and disadvantages.  This chart can help you decide based on your needs- file size, color palette, transparency, and Lossy/Lossless.  

Do you know which file type to use?

If you are confident, go to the next page to test your knowledge. 


If you want more review, here is a short video covering the 3 file types we learned about in the session.

If you are adding a logo and need a small file size, what file type should you use?

  • jpg
  • gif
  • png

If you are adding many photographs and are concerned about file size, what file type should you use?

  • jpg
  • gif
  • png

If you are adding a photograph you would like to overlay on the screen, which file type should you use?

  • jpg
  • gif
  • png