---
title: "How to Compress and Resize Images for Faster Pages | MCC"
description: "Oversized photos are the most common reason small business sites load slowly. Learn how to resize, compress and upload images the right way."
url: "https://mcc-solutionsnj.com/websites/guides/compress-and-resize-images-for-faster-pages"
---

Guide · Updated October 12, 2026

# How to Compress and Resize Images for Faster Pages

A phone photo straight from the camera can be several megabytes. Put four of those on a home page and visitors on mobile data wait, then leave. Fixing images is usually the quickest speed win a small business site has.

By [Matthew Coleman](/about), MCC Solutions

**Quick answer.** Before compressing an image, find out how wide it actually appears on the page. A photo shown in an 800-pixel column does not need to be 4,000 pixels wide, because visitors still download every pixel even though browsers shrink it on screen.

**Free tools:** [Free website SEO check](/websites/seo-checker) · [Search result preview](/websites/search-result-preview)

## Start with the display size, not the file size

Before compressing anything, find out how wide the image actually appears on the page. A photo shown in a column that is 800 pixels wide does not need to be 4,000 pixels wide. Browsers shrink it on screen, but the visitor still downloads every pixel.

A practical rule is to export images at about twice the largest display width, so they stay sharp on high-density phone screens. A full-width banner might be 1,600 to 2,000 pixels wide. A team headshot shown at 300 pixels might be 600 pixels wide. Anything beyond that is wasted weight.

## Resize first, then compress

Resizing and compressing are two separate steps, and the order matters. Resizing removes pixels. Compressing removes detail inside the pixels that remain. If you only compress a huge image, you still carry far more data than needed.

Free tools such as Squoosh in a browser, or the built-in export options in Photoshop, Affinity, GIMP and Canva, handle both steps. For a batch of photos, desktop apps that process a whole folder save time.

## Pick a quality setting you can live with

For photos saved as JPEG or WebP, a quality setting between 70 and 85 percent usually looks nearly identical to the original at a fraction of the size. Zoom in on faces and fine text before you approve a result. Compress logos, screenshots and graphics with sharp edges more gently, or use PNG or SVG for them instead.

A reasonable target for most content images is under 200 KB, and many hero images can land well below 300 KB. These are guidelines, not rules. A photographer's portfolio may justify bigger files, while a plumber's service page rarely does.

## Name and organize files before uploading

Rename files to describe what is in them, such as water-heater-install-basement.jpg instead of IMG_4471.jpg. Use lowercase letters and hyphens. This helps you find images later and gives search engines a small extra clue about the topic.

Keep an original folder with full-size photos somewhere safe, and a separate web folder with the optimized copies. If you ever redesign, you will want the originals.

## Check what your platform already does

Some site builders and WordPress image plugins resize and compress on upload, but results vary. They can only work with what you give them, and a 6,000-pixel upload still creates extra work and storage. Look in your media library to see how big the stored files actually are.

After you replace images, test the page again in a speed tool and compare the total page weight before and after. If the number barely moved, a script or a video may be the real culprit. MCC Solutions can run that check as part of a speed review.

One more habit: when a team member or photographer sends you images, share a short instruction sheet with the maximum width, preferred format and file size. Catching oversized files at the door is easier than cleaning a media library of hundreds of heavy uploads later.

## Common questions

**Will compressing images make them look blurry?**

Not at sensible settings. Quality of 70 to 85 percent is hard to tell apart from the original on a normal screen. Blur usually comes from stretching a small image to fit a large space, which is a sizing problem rather than a compression problem.

**Should I resize images in WordPress or before uploading?**

Before uploading is more reliable. WordPress creates smaller copies, but the original still sits on your server and may be the version served in some themes.

**How many images is too many on one page?**

There is no fixed number. What matters is total weight and whether images below the first screen load only when needed. Ten small, optimized images are fine; three huge ones are not.

This guide is general information. Search engines change how they work and their guidelines; check Google's current documentation for your situation. Nobody can guarantee a ranking.

Let us handle it

 [### Website speed & Core Web Vitals Faster websites for small businesses: image and font fixes, caching, render-blocking resources and Core Web Vitals, explained in plain language. Speed →](/websites/services/website-speed)[### Website care & updates Monthly website care: updates, backups, security checks, speed and content changes for small businesses. Website care →](/websites/services/website-care)

More guides

- [Browser Caching Explained for Small Business Sites](/websites/guides/browser-caching-explained-for-small-sites)
- [Web Fonts and Page Speed: Keep Your Typography Light](/websites/guides/web-fonts-and-page-speed-for-small-business-sites)
- [Third-Party Scripts That Slow Down Your Website](/websites/guides/third-party-scripts-slowing-down-your-website)
- [Lazy Loading Images and Video: What to Delay and What Not To](/websites/guides/lazy-loading-images-and-video-explained)

Free tools

- [Website basics check](/websites/seo-checker)
- [Is your website working for you? quiz](/websites/quiz)

 [All guides](/websites/guides)

Reach small business owners working on their website and Google listing who read this guide: [advertise here](/advertise#websites).

Do it yourself

### Small Business Website Starter

A fast, mobile-friendly one-page site you edit in a text editor and host anywhere, with the sections a local service business needs and a plain setup guide.

[See what's inside ($29)](/toolkits/small-business-website-starter) [Free sample](/toolkits/small-business-website-starter#free-starter)14-day full refund

## Rather have us handle it? Ask for a quote.

[Get a Quote](/websites/#quote)[Call (908) 444-6373](tel:+19084446373)
