Suggested Image Size

When designing a webpage, it's important to keep file sizes low. Even though Internet speeds are much improved these days, pages that have a lot of large files (especially large images) can still negatively impact how quickly a page loads, especially for people using mobile devices.

What is the target file size for web images?

We suggest that you try as much as possible to keep all images under 100Kb. If you use Photoshop, GIMP or another image editing program, you can use the image editor to increase the compression of your JPGs, thus reducing their file size. Check your photo editing program's help documentation to learn how to compress images for the web using that specific program.

If you are going to have a page that contains multiple images (e.g. six or more images on a single page), you'll probably want to use images that are closer to 50Kb to make sure users downloading that page have a smooth browsing experience.

Which type of image file is best for the web? 

The three main types of image files used on websites are JPGs, GIFs, and PNGs. For best results, you'll want to use JPGs for photos that contain lots of different colors and PNGs for images that contain fewer colors and straight lines. When in doubt, it's best to save your images as JPGs. See the examples below.:

Save as a JPG	Save as a PNG

Lastly, if you are working on creating a background image for your site, be sure to keep it as close to 100Kbs as possible. If the background image is too large, the web browser may even not bother to load it. The best backgrounds either fade out or are smaller repeating tiles since those tend to take up the least amount of storage space.