Image Optimisation for SEO: Formats, Compression & Lazy Loading

Your website’s images could be sabotaging your SEO efforts right now. I’ve seen countless businesses pour resources into content & technical SEO whilst completely ignoring their image optimisation strategy. It’s honestly baffling.

Here’s what most people don’t realise – search engines can’t actually “see” your images the way humans can. They rely entirely on the technical signals you provide. Miss these signals, and you’re essentially invisible.

But get image optimisation right? You’ll boost your search rankings, slash your page loading times, and create a better user experience. Simple as that.

Why Image Optimisation Actually Matters

Search engines are obsessed with page speed. Always have been, probably always will be. When your images are bloated and unoptimised, they drag down your entire site’s performance like a digital anchor.

I think Google’s Core Web Vitals update made this crystal clear – slow sites get penalised. Period. Your stunning photography won’t matter if visitors bounce because pages take forever to load.

There’s also the accessibility angle, which frankly doesn’t get enough attention. Screen readers depend on proper image descriptions to help visually impaired users understand your content. It’s not just good SEO practice.

It’s basic human decency.

Plus, optimised images consume less bandwidth, which matters more than you might think. Mobile users on limited data plans will thank you, and search engines notice these things too.

JPEG vs PNG vs WebP Formats

Right, let’s tackle the format question because this trips up loads of people. Each format has its strengths & weaknesses, and choosing wrong can seriously impact your site’s performance.

JPEG remains the workhorse for most photographs and complex images. It handles colour gradients beautifully and offers excellent compression ratios. However, it doesn’t support transparency, and you’ll lose some quality with each save. Not ideal for logos or graphics with sharp edges.

PNG excels at graphics, logos, and anything requiring transparency. The quality stays pristine because it uses lossless compression. But here’s the catch – file sizes can be massive compared to JPEG. I’ve seen PNG files that are literally ten times larger than equivalent JPEGs.

WebP though? That’s where things get interesting. Google developed this format to be the best of both worlds. Smaller file sizes than JPEG with better quality than PNG. Sounds perfect, right?

Well, not quite. Browser support has improved dramatically, but you’ll still encounter compatibility issues with older browsers. Safari only added full support relatively recently, which tells you something about adoption rates.

My recommendation? Use WebP as your primary format with JPEG/PNG fallbacks. Most modern content management systems can handle this automatically now.

Mastering Image Compression Techniques

Compression is where the real magic happens, but it’s also where most people completely mess things up. Too little compression and your files are enormous. Too much and your images look like they were saved on a potato.

The sweet spot for JPEG quality usually sits between 75-85%. Anything above 90% creates unnecessarily large files. Anything below 60% starts looking noticeably degraded. But these are guidelines, not rules.

You need to test each image individually because content matters enormously. A busy photograph might hide compression artifacts that would be glaringly obvious on a simple graphic. Trust your eyes more than arbitrary numbers.

Modern compression tools have become incredibly sophisticated. TinyPNG and similar services use clever algorithms to reduce file sizes without noticeable quality loss. I’ve seen 70% size reductions with virtually identical visual quality.

Here’s something most guides won’t tell you – progressive JPEG loading can improve perceived performance even when actual file sizes stay the same. Users see a low resolution version immediately, then watch it sharpen. Feels faster, even when it isn’t.

Writing Effective Alt Text

Alt text writing is part science, part art, and part common sense. Yet I regularly encounter sites with alt text like “image1.jpg” or worse, nothing at all.

Good alt text describes what’s actually happening in the image, not what you want people to think about it. “Red sports car parked outside modern office building” beats “luxury lifestyle awaits” every single time.

Keep descriptions concise but informative. Screen readers don’t need a novel, but they do need enough detail to understand context. Aim for one or two sentences maximum.

Context matters enormously here. The same image might need different alt text depending on surrounding content. A photo of a chef in an article about restaurant reviews needs different description than the same photo in a piece about kitchen equipment.

Don’t stuff keywords into alt text like some kind of SEO desperate. Search engines aren’t stupid – they can spot keyword stuffing from miles away. Write for humans first, search engines second.

Sometimes the best alt text is no alt text at all. Decorative images that don’t add informational value should have empty alt attributes (alt=””) so screen readers skip them entirely.

Strategic Filename Conventions

Your image filenames are another SEO signal that most people completely ignore. “DSC_0047.jpg” tells search engines absolutely nothing useful about your content.

Descriptive filenames help search engines understand image content before they even process the file. “chocolate-cake-recipe-ingredients.jpg” immediately communicates relevance for baking related searches.

Use hyphens to separate words, not underscores or spaces. Search engines treat hyphens as word separators but might not handle other characters consistently. Keep filenames reasonably short but descriptive enough to be meaningful.

Think about how people might search for your images. Generic terms like “photo” or “picture” waste valuable filename space.

I’ve noticed that including location information in filenames can boost performance. “manchester-wedding-photographer-portfolio.jpg” might rank better for location specific searches than generic alternatives.

File organisation matters too. Grouping related images in logical folder structures helps both search engines and your own sanity when managing large image libraries.

Implementing Lazy Loading Properly

Lazy loading delays image loading until users actually need them. Sounds simple enough, but implementation can make or break the user experience.

The basic principle is straightforward – only load images that are currently visible or about to become visible. This dramatically reduces initial page load times, especially on image heavy pages.

Modern browsers support native lazy loading with a simple loading=”lazy” attribute. No JavaScript required, no complex libraries, just clean HTML that works. I love solutions like this.

But here’s where people get it wrong – they lazy load everything, including above the fold images. Users see blank spaces where images should be, creating a janky, unprofessional experience.

Only lazy load images below the fold. Everything visible on initial page load should load immediately. This might seem obvious, but I’ve seen major websites get this basic principle backwards.

Consider implementing placeholder images or skeleton screens whilst lazy loaded content loads. Users appreciate visual feedback that something is happening, even if the actual image hasn’t appeared yet.

There’s also an SEO consideration here. Some older crawlers might not trigger lazy loading, potentially missing your image content entirely. Using the loading=”lazy” attribute avoids this problem since search engine crawlers typically ignore the lazy loading instruction.

Common Image SEO Mistakes

I’ve audited hundreds of websites over the years, and certain image SEO mistakes appear repeatedly. It’s like people follow the same bad advice over & over again.

First major mistake – using images purely for decoration without considering SEO value. Every image on your site should serve a purpose, either informational or strategic. Decorative fluff just slows things down.

Second – ignoring image sitemaps entirely. Large sites with substantial image content should absolutely submit image sitemaps to help search engines discover and index visual content properly.

Third – forgetting about mobile optimisation completely. Your desktop images might look gorgeous on a 27 inch monitor, but how do they perform on a smartphone with limited bandwidth?

Responsive images using srcset attributes can serve different image sizes based on device capabilities. It’s not optional anymore.

Fourth – not monitoring image performance metrics. You can’t improve what you don’t measure. Tools like Google PageSpeed Insights will highlight specific image optimisation opportunities.

Finally – treating image SEO as a one time task instead of an ongoing process. Your image optimisation strategy should evolve alongside your content & technical SEO efforts.

Testing and Monitoring Performance

Performance monitoring separates successful image optimisation from guesswork. You need concrete data to understand what’s actually working on your site.

Google’s Core Web Vitals provide the most relevant metrics for image performance. Largest Contentful Paint (LCP) often correlates directly with image loading efficiency. Cumulative Layout Shift (CLS) can spike when images load without proper dimensions specified.

Tools like GTmetrix and WebPageTest offer detailed waterfall charts showing exactly how your images load. You’ll spot bottlenecks immediately – that massive hero image taking 3 seconds to download, or the lazy loading script that’s actually slowing things down.

Don’t forget about real user monitoring either. Synthetic tests are useful, but actual user experiences matter more. Google Search Console provides field data showing how real visitors experience your site’s performance.

Set up alerts for performance regressions. New images, theme updates, or plugin changes can unexpectedly impact loading times. Catching problems early prevents SEO damage from accumulating over time.

Regular audits should become routine, perhaps quarterly or whenever you make significant site changes. Image optimisation isn’t something you accomodate once & forget about.

The Bottom Line

Image optimisation for SEO isn’t rocket science, but it does require attention to detail and consistent execution. The fundamentals haven’t changed much – use appropriate formats, compress intelligently, write meaningful alt text, and implement sensible lazy loading.

What has changed is how critical these optimisations have become for search rankings. Core Web Vitals aren’t just nice to have metrics anymore. They directly impact your visibility in search results.

I think the biggest mistake people make is treating image SEO as separate from their broader optimisation strategy. Everything connects – your technical SEO, content quality, user experience, and yes, image optimisation all work together.

Start with the basics and build from there. You don’t need to implement every advanced technique immediately, but you absolutely cannot ignore the fundamentals anymore.

The tools and techniques I’ve outlined here will genuinely improve your search performance, but only if you actually use them consistently. Half measures in SEO usually produce half results.

Your images are either helping your SEO efforts or hindering them. There’s really no middle ground here. Which side do you want to be on?