The most common image problem we find on small business sites isn’t missing alt text. It’s a 6MB photo straight off a phone, called IMG_4471.jpeg, sitting in the hero of the homepage and taking four seconds to appear on a mobile.
Fixing images is one of the few SEO jobs you can do yourself in an afternoon, and it helps twice: pages load faster, and your photos have a chance of turning up in Google Images and image results for local searches. Do these four things to each image, in this order.
1. Resize before you upload
Photos from modern phones and cameras are often 4,000 pixels wide or more. Your website will never display them that big. Uploading them full size makes every visitor download a file many times larger than they need.
Our working sizes for most sites:
| Where the image goes | Width to export | Target file size |
|---|---|---|
| Full-width hero or banner | 1920px | under 300KB |
| Content image inside a page | 1200px | under 150KB |
| Team headshot or thumbnail | 600 to 800px | under 80KB |
| Logo | SVG if possible, otherwise PNG at twice display size | as small as it’ll go |
These aren’t laws, just sensible defaults. WordPress automatically creates smaller copies of each upload and serves the right size to each screen, so you only need to upload one sensibly sized version.
2. Pick the right format
- JPG for photos. Export at around 75 to 82 per cent quality and you’ll rarely see a difference.
- WebP for photos when your site supports it. It’s typically much smaller than JPG at the same quality, and Google supports it along with AVIF, PNG, GIF and SVG.
- PNG for graphics with sharp edges or transparency, like screenshots or icons.
- SVG for logos and simple icons. It stays crisp at any size and is tiny.
Don’t use PNG for photos. It’s one of the quickest ways to end up with a 3MB file. If you need help sorting logo formats, our explainer on logo file formats covers which file to use where.
3. Name the file properly
Google’s image SEO guidance recommends short, descriptive file names, and gives my-new-black-kitten.jpg over IMG00023.JPG as the example. Rename before you upload, because changing the file name afterwards is fiddly in WordPress.
Use lower case, hyphens between words, and describe what’s actually in the picture:
- Bad:
IMG_4471.jpeg,final-FINAL-2.jpg,image1.png - Better:
exposed-aggregate-driveway.jpg - Best:
exposed-aggregate-driveway-lennox-head.jpg
Adding the suburb is fine when it’s true. Adding five keywords isn’t.
4. Write alt text that describes the image
Alt text is read aloud by screen readers for people who can’t see the image, and shown when an image doesn’t load. Google calls it the most important metadata for images. It’s an accessibility job first and an SEO job second, and if you write it for the first purpose you’ll usually get the second for free.
The test: if you described this photo to someone over the phone in one sentence, what would you say?
Some examples from the kinds of sites we work on:
| Image | Bad alt text | Good alt text |
|---|---|---|
| Finished concrete driveway | concrete |
Grey exposed aggregate driveway with a broom finished border |
| Same driveway, keyword stuffed | concreter Ballina concreting Ballina driveways Ballina best concreter |
Exposed aggregate driveway at a new home in Lennox Head |
| Team photo | team |
Sam and Priya from the clinic team standing at reception |
| Electrician at a switchboard | electrician-1.jpg |
Electrician fitting a new safety switch to a home switchboard |
| Hearing test | (empty) | Audiologist fitting headphones on a patient before a hearing test |
| Decorative wave graphic | waves design element |
(empty: purely decorative images should have empty alt text) |
A few rules of thumb:
- Don’t start with “image of” or “photo of”. Screen readers already announce it’s an image.
- Be specific. “Bathroom” says little. “Walk-in shower with floor-to-ceiling white tiles and a black rain shower head” says a lot.
- Mention the place only when it’s relevant and true. A project photo from a real Ballina job can say so. A stock photo can’t.
- Skip decorative images. Background textures, dividers and flourishes should have empty alt text so screen readers skip them.
- Linked images need alt text that describes the destination. If your logo links to the homepage, “The Design Space home” works better than a description of the logo.
On a trade site, like the concreting site we built for Grind & Seal Concrete, a project gallery is where good alt text earns its keep: every real job photo is a chance to describe the work and the area accurately.
Put images near the words they relate to
Google works out what an image shows partly from the text around it, including captions and headings. A photo of a deck build on the decking page, with a caption saying where and what timber was used, gives far more context than the same photo in a random gallery.
Captions are underrated. People read them more than body text, and they’re the natural place for a detail like “Spotted gum deck, Alstonville, completed March”. Linking from that page to a related service or project, as we cover in our internal linking guide, helps both people and search engines find the next thing.
Real photos beat stock
This is where our in-house commercial photography team shows its bias, but it’s also simply true for local search. Stock photos appear on thousands of sites, so they add nothing distinctive. Your own photos of your work, your team and your premises are unique, show what you do, and give customers a reason to trust you. They don’t need to be award-winning. Well lit, in focus and honest is enough.
Your image checklist
Before any image goes on the site:
- Resized to the width it’ll be shown at
- Exported as WebP or JPG (PNG or SVG for graphics)
- File name in lower case with hyphens, describing the content
- Alt text written as a one-sentence description, or left empty if decorative
- Placed near related text, with a caption where it helps
If you’re on WordPress, our step-by-step on images in WordPress shows where each setting lives. Got a few hundred IMG_ files already live? Renaming, resizing and alt-texting a whole site’s images in one go is a standard part of our web design and SEO work.