How big should images be on my website?
Size each image for the space it fills on screen, then compress it. Full-width banners rarely need more than about 2,000 pixels wide, and images in a text column far less. Use WebP or AVIF where your site supports them, let the site serve smaller copies to phones, and don't lazy-load the main image at the top.
The short version
- Match pixels to the space: about 1,600 to 2,000 wide for full-width banners, less for everything else.
- Compress every photo. If you can’t see a difference, compress more.
- Use WebP or AVIF where you can. Keep PNG for graphics, SVG for logos.
- Let the site serve smaller copies to phones.
- Lazy-load images lower on the page, but not the main one at the top.
How do I size and prepare an image?
1. Pick the width. Think about how wide the image shows on a large screen:
| Where it appears | Suggested width |
|---|---|
| Full-width banner or hero | About 1,600 to 2,000 pixels |
| Image in the main text column | About 800 to 1,200 pixels |
| Team photos, thumbnails | A few hundred pixels |
| Logos and icons | SVG if you have it |
A photo from a modern phone is often 4,000 pixels wide or more. Shown at 1,200 pixels, most of that data is wasted. WordPress helps here: it makes several smaller copies of each upload and, since version 5.3, scales down uploads over 2,560 pixels by default.
2. Compress it. Compression shrinks the file with little visible change. Compare before and after at normal size.
3. Choose the format. Google Search supports BMP, GIF, JPEG, PNG, WebP, SVG and AVIF. WebP and AVIF are usually smaller than JPEG at similar quality.
4. Name it sensibly. Google’s image guidance prefers short, descriptive names like “cedar-garden-bed.webp” over “IMG00023.JPG.”
5. Add alt text. See how to write alt text.
Why does it matter?
Images are often the heaviest part of a page. web.dev’s guide to serving responsive images explains that sending desktop-sized images to phones wastes data and slows the main content. When the largest thing on the screen is an image, a smaller file helps it appear sooner. That’s Largest Contentful Paint, one of the Core Web Vitals.
What are the common mistakes?
- Uploading straight from the camera and relying on the page to shrink it.
- PNG for photos. It’s usually far heavier than a compressed photo format.
- Lazy-loading the hero image. web.dev’s article on lazy loading and LCP says images above the fold may benefit from loading more eagerly.
- No width and height set, so the page jumps as images load.
- Sliders full of large images that most visitors never see.
What if my pages are still slow after resizing?
Run a test and read what it flags. Our free speed test shows whether images are still the main cost. If they are, check that the site really serves the smaller copies, not the original upload. If images look fine, the slowdown may be hosting, plugins or scripts. See why a website is slow and whether a low PageSpeed score matters.
How much does it cost, and how long does it take?
Resizing and compressing one image takes a minute with free tools. Fixing a whole site’s images by hand can take hours. Image plugins or a build step can do it automatically, though setup takes some care.
How does E-3 handle this?
If images are slowing your site, ask about our speed program. Speed fixes there are tested on a staging copy before they go live.
Related questions
Common questions
- Can I upload photos straight from my phone?
- You can, but phone photos are often several megabytes and thousands of pixels wide. Resize and compress them first, or make sure your site does it for you.
- Does WordPress resize images for me?
- Yes, partly. WordPress makes several smaller copies of each upload and can offer the right one to each screen. Since version 5.3 it also scales down uploads larger than 2,560 pixels. Resizing first still helps.
- Which format should I use?
- WebP or AVIF for photos where your site supports them, JPEG as a fallback, PNG for graphics that need sharp edges or transparency, and SVG for logos and icons.
Rather talk it through?
Call our team, or send a note and we’ll reply within one business day. No pressure and no jargon.