Here's a frustrating irony for service businesses: the photos of your work are your best sales tool — and also the most common reason your website loads slowly. A single photo straight from a phone can be larger than everything else on the page combined. On a customer's cellular connection, that means seconds of staring at a blank screen, and many won't wait. This guide explains how to keep your photos looking great while making them load fast, with no technical background required.
Why Image Weight Matters More Than You Think
Two groups judge your website's speed: customers and search engines.
- Customers: Most of your visitors are on phones, often on cellular connections, frequently in a hurry. Every extra second of load time costs you a slice of them. Someone with water on their kitchen floor does not wait patiently for your homepage banner to appear.
- Search engines: Page speed — including how quickly the main content and images load — is a known ranking factor, and slow pages also get abandoned more, which sends bad signals of its own.
The good news: image optimization is the single highest-impact speed fix for most small business sites, and much of it is free and takes minutes per photo.
Understand Where the Weight Comes From
A photo from a modern phone is typically 3–8 megabytes. Your website probably needs it to be 100–300 kilobytes — a twentieth of the size — with no visible difference on screen. The weight comes from three places, and each has a fix:
- Dimensions: Phone photos are often 4,000+ pixels wide. Most website images display at 800–1,600 pixels wide. You're shipping four times the pixels anyone can see.
- Compression: Photos can be compressed — data cleverly discarded where the eye won't notice — with no visible quality loss at sensible settings.
- File format: Some formats pack the same image into far fewer bytes than others.
Fix those three and your images will load fast everywhere.
Step 1: Resize Before You Upload
This is the most important habit, and the one most often skipped. Never upload a photo straight from a phone or camera to your website.
- Decide the display size. A full-width banner might need 1,600–2,000 pixels wide. Photos within a page rarely need more than 1,200 pixels. Thumbnails and gallery grids need far less — 400–600 pixels.
- Resize to that width before uploading. Free tools can do this: the built-in photo editors on Windows and Mac, free browser-based image resizers, or any basic editing app on your phone.
- Batch your work. When you photograph a job, spend two minutes resizing the set before uploading. It quickly becomes routine.
Step 2: Compress
After resizing, run the image through a compressor. Free browser-based tools let you drag in a photo, adjust a quality slider, and download a much smaller version.
- Target file sizes: under 200 KB for standard page photos, under 400 KB for large banners, under 100 KB for thumbnails. These are guidelines, not laws — the test is whether it looks good and loads fast.
- Quality settings around 70–80% usually look identical to the original at web sizes while cutting the file size dramatically.
- Zoom in and check the first few times. If you see smearing or blockiness, raise the quality a bit. You'll quickly develop an eye for it.
Many website platforms also offer plugins or built-in features that compress images automatically on upload — worth asking whoever manages your site, because "automatic" is the most reliable system of all.
Step 3: Choose the Right Format
Different file types suit different images:
- Modern formats (like WebP or AVIF): The best choice for photos when your website platform supports them — same visual quality at notably smaller sizes. Most current platforms and browsers handle these well.
- JPEG: The universal fallback for photographs. Well-supported everywhere, compresses well.
- PNG: Use for graphics with transparency, like your logo. For photos, PNG files are needlessly huge — a common and costly mistake is saving job photos as PNGs.
- SVG: For logos and simple icons made of shapes rather than pixels — tiny files, perfectly sharp at any size.
Rule of thumb: photos as WebP or JPEG, logos and icons as SVG or PNG, and nothing else.
Step 4: Name Files and Write Alt Text
Two small habits that help search engines understand your images (and help visually impaired visitors via screen readers):
- Descriptive file names:
kitchen-remodel-oak-cabinets-denver.jpgtells a search engine something;IMG_4821.jpgtells it nothing. Rename before uploading — it takes seconds. - Alt text: A short, honest description of the image: "technician installing a tankless water heater in a garage." Write it for a person who can't see the photo, not as a place to stuff keywords.
For a service business, this is doubly valuable — images of your actual work, properly labeled, can surface in image searches and reinforce the relevance of the pages they sit on.
Step 5: Let the Page Load Smart
A couple of behind-the-scenes features worth confirming with whoever manages your website:
- Lazy loading: Images below the visible screen load only as the visitor scrolls down to them. The top of your page appears fast, and the rest catches up invisibly. Most modern platforms support this — often it's just a setting.
- Responsive images: Serving smaller versions to phones and larger ones to desktops, so a phone on cellular isn't forced to download a desktop-sized banner. Again, many platforms handle this automatically or with a plugin.
- Don't overdo the gallery. Twenty photos on one page will be heavy no matter how well optimized each is. Show your best six to eight per page and organize the rest into galleries people can click into.
A Simple Workflow You Can Actually Stick To
The whole process, per photo:
- Take the photo (well-lit, horizontal for banners, get close for detail shots)
- Resize to the width your site needs (1,200 px is a safe default)
- Compress with a free tool, quality around 75%
- Rename the file descriptively
- Upload, add alt text, done
Two to three minutes per image, and your site stays fast forever. For your existing site, don't try to fix everything in a day — start with your homepage and your top five service pages, then work through the rest over a few weeks. Test your progress with a free page speed tool; watching the load time drop is genuinely satisfying.
Quick Checklist
- No photo uploaded straight from a phone or camera
- Images resized to the width they'll actually display at
- Every image compressed before upload (target under 200–400 KB)
- Photos saved as WebP or JPEG — never PNG for photos
- Logo and icons as SVG or PNG
- Descriptive file names instead of camera defaults
- Honest alt text on every meaningful image
- Lazy loading enabled on the website
- Responsive image sizes served to phones
- Homepage galleries kept to a tight selection
- Homepage and top service pages optimized first
- Page speed tested before and after to measure improvement