Choosing the right image format and filename

Guidelines for choosing the appropriate format and filename.

Summary

It is important to use the appropriate image format and filename when you save an image file to help preserve image quality, improve search engine optimization (SEO), and make it easy to find and organize files.

Choosing an image format

Depending on if an image is animated, a photograph, or infographic, there are different file formats you should use. While there are advantages and disadvantages to each format — and some images include both photographic and illustrated components — here are standard guidelines to follow:

Image Format Name

Description

JPG

Photographic images or images with text

PNG

Custom graphics, illustrated images, or infographics

GIF

Animated images like this one

Use this decision tree to determine what file format you should use when creating and saving images:

Transparency allows images to be saved without a background. This is useful if you want to add logos, watermarks, or other content graphics. Below are examples of both transparent and non-transparent images:

Name

Description

Transparent PNG file in an editing program

Graphic with transparent PNG file in bottom right corner

JPG file with a white background in an editing program

Graphic with white background on Mass.gov

Choosing file names

Create short, descriptive file names that include keywords and the dimensions of the image. Including the size as well as an “-opt” tag or something similar will help you find different versions of an image that has already been optimized to use on different social channels or Mass.Gov webpages. Here is an example:

  • File Name: 2015-MA-Sales-Tax-Holiday-opt-1024x512.png