Choosing the Best Image Format for Web Design Services

best image format

In a collaborative session, we reviewed some example graphics and images and discussed as a group what would be the best format to save each as for choosing the best image format. Below is a list of the best image formats.

Image Formats for Websites

  • JPG
  • GIF
  • PNG
  • SVG

Take Aways

  • When saving images to be used on a website, the goal is to optimize images as much as possible, while maintaining quality.
  • Different image formats will work best in different situations. No one format will always be the best fit.
  • Often, you need to test saving an image in different formats to see which provides the best balance of optimization and quality.
  • JPG is generally best for photos.
  • PNG is generally best for simple color graphics, particularly when detail and colors need to be preserved, or a transparent background is needed.
  • SVG (Scalable Vector Format) is an image format for vector graphics that can also be animated. See the SVG category under Resources for links to more information on SVG.
  • GIF is generally best for animations where SVG isn’t a good fit.

 More Info

10 Must Know Image Optimization Tips
Section: Know Which Image File Type to Use for the Right Situations

How To Optimize Images For Your WordPress Website
Section: File formats

Optimizing Images – Choosing an Image Format
Section: Choosing an Image Format

Image File Types: Top 5 Types Of Picture Formats

Webinar by Chris Coyier. For a partial recap of the webinar, see: Designing with SVG: How Scalable Vector Graphics Can Increase Visitor Engagement

Video course on SVG, by Chris Coyier.
Everything you need to know about SVG

A little tutorial that explores the usage of SVG line drawing animations.
SVG Drawing Animation

For more information on how to customize your website, or getting started with the design process, please check out more articles here!

SL
Stephanie Lask Lead Front-End Developer

Stephanie is one of the lead front-end developers for Web Design Services. She builds custom websites from scratch with WordPress, using the approved design from clients. She also performs poetry, is a teaching artist with Arts For Learning, A Young Audiences of Virginia Affiliate, and is the coach for the poetry slam team called Verb Benders.

More Articles by Stephanie

Was this article helpful? Let us know!