Web essentials

Choose the best image file format for the web

Use JPEG and PNG where each works best, keeping images sharp, compatible, and efficient.

JPEG vs PNGPage speedVisual quality
JPEG and PNG format comparison for website images

File format is easy to overlook, but it directly affects image quality, page speed, and browser compatibility.

What a web image format needs to do

  • Preserve the details that matter.
  • Keep the download reasonably small.
  • Work across common browsers and devices.

For most websites, two familiar formats cover these needs: JPEG (.jpg) and PNG (.png). The right choice depends on what the image contains.

Choose JPEG for photos and gradients

JPEG is usually the practical choice for portraits, travel photos, events, and other images with many colors or smooth tonal changes. It provides a strong balance between visual quality and file size.

Colorful restaurant photograph saved as JPEG
This JPEG is 148 KB. The same image saved as PNG would be 1.52 MB, more than ten times larger.

Choose PNG for crisp edges and transparency

PNG often works better for document pages, UI screenshots, diagrams, logos, and graphics with a limited number of colors. It preserves sharp edges and supports transparent areas.

Transparent PNG diagram with crisp lines
This PNG is 41 KB. A JPEG version would be almost twice as large and would lose transparency.

A simple rule of thumb

Photos and portraits: JPEG.
Diagrams, screenshots, documents, and logos: PNG.

Share images without format guesswork

Build a clean online album and let your photos look right across phones, tablets, and desktops.