How to Optimise Images for SEO

Image optimisation is one of the most overlooked but crucial elements of on-page SEO.

We’re all guilty of forgetting to optimise images. We’ve all taken a photo, made a graphic, or downloaded a stock image and slapped it on our websites.

How much harm can that do, right?

Well, if you do that regularly, it will impact your website performance, page speeds, and user experience, quite a lot.

Thankfully, though, it’s a pretty simple fix. One that our SEO specialists implement at the start of nearly every client SEO project that comes through our doors.

In this article, we’ll explain image optimisation, how it impacts SEO and UX, and how to optimise images for SEO.

Let’s start with the basics… 👇

What is Image Optimisation?

Image optimisation is all about making your images work better for your website.

The goal is to ensure your website images load quickly, retain clarity and resolution, and are easy for search engines to understand.

Optimising your website images can improve your website’s loading speeds and user experience, which can help you rank higher on Google and increase your search visibility.

Creating a simple and clear process for image optimisation will help ensure that every image you upload is fully optimised and in line with Google’s best practices.

Why Image Optimisation is Important for SEO

Now the main reason you’re reading this post is to find out how to optimise your image for SEO.

But before we get to that, I want to talk about why optimising your images is so important.

Boosting website performance

Optimising images can have a big impact on how well your website performs.

Faster-loading images mean happier visitors who are more likely to stick around and explore your website.

Search engines care about user experience, so if your images slow down pages, it can hurt your rankings and traffic.

Enhancing search visibility

Understanding how to optimise images for SEO also means understanding how Google processes image data.

Search engines like Google can’t ‘see’ images like we do. Instead, they rely on text clues to figure out what an image is about.

Things like file names, alt text, and captions help Google understand your images, making it easier for Google to rank your content in image searches.

Improving loading speed

Big, uncompressed images are a big problem for page speeds.

The bigger the image file, the longer it takes to load, especially on mobile devices or slower internet connections. And the slower your pages are, the worse your Core Web Vitals scores and overall SEO performance will be.

Compressing your images keeps file sizes smaller and helps your website load quickly. And faster load times mean better user experience and higher rankings.

How Will Optimising Images for SEO Help With UX?

Image optimisation isn’t just beneficial for SEO; it also makes your website better to use.

When you optimise images properly, your site will be faster, more accessible, and more visually appealing, improving user experience (UX).

Faster loading times

No one likes waiting for a website to load.

If your pages are filled with massive, uncompressed images that slow down your pages, visitors are more likely to get frustrated and leave.

Compressing images and using the right formats means your site loads quicker, which keeps visitors engaged and happy.

Better accessibility

Well-written image alt text isn’t just for SEO; it’s a massive win for accessibility.

Visually impaired users often rely on screen readers to understand your content, and these screen readers rely on accurate alt-text to describe images to these users and make your website accessible to everyone.

Improved mobile experience

More people are browsing on their phones than ever before. If your images aren’t optimised for mobile, they can load slowly, look distorted, or cause layout issues.

Responsive images ensure your site looks good and works well on any device, providing a great user experience for everyone.

Enhanced visual appeal

Using the right image compression tools helps keep file sizes down without compromising image quality.

This ensures your website loads quickly and images still look sharp and professional, meaning visitors are more likely to have a positive experience.

Increased engagement

When users can navigate your site smoothly without delays or distorted images, they’re more likely to stay and read more, fill out your contact forms, or buy your products.

Better UX leads to higher engagement, which ultimately helps with SEO, too.

How to Optimise Images for SEO

Now that we’ve covered what image optimisation is and how it affects both your SEO and UX, let’s go over how to optimise images for SEO.

Choosing the correct file format

Different file formats can massively impact load speed and image quality.

The most common formats your website images should be are JPEG, PNG, and WebP:

• JPEG: This format is Ideal for photographs and images with gradients. It offers good quality with manageable file sizes, but you’ll need to use an image compression tool to reduce file sizes without compromising quality.

• PNG: Best for images requiring transparency or text-heavy graphics. However, they tend to have larger file sizes, so you will need to compress them.

• WebP: This format provides high-quality compression for lossless and lossy images and is designed for website images. It supports transparency and is suitable for all types of images. On WordPress, there are several plugins you can use to automatically convert any JPEG, PNG, or other image to WebP formats, helping reduce file sizes further without compromising quality. Create WebP versions of your images.

I’ll cover the exact tools that we use at Damteq, in a moment. But before that, let’s talk about file sizes.

Keep image file sizes under 100KB

To keep your website fast and responsive, it’s good practice to keep image file sizes under 100KB.

Large image files slow down page loading times, impacting user experience and SEO. Keeping images lightweight helps your pages load quickly, especially on mobile devices or slower connections.

Compressing images before uploading reduces file sizes by removing data that isn’t essential to how the image looks on-screen. This keeps your site looking sharp without sacrificing speed.

There are two main types of image compression:

• Lossless compression shrinks file size without removing any image data. It’s used for high-detail graphics, icons, or illustrations where every pixel counts. File size reduction isn’t quite as good as lossy compression, but the image quality isn’t sacrificed.
• Lossy compression removes some image data to create smaller files. It’s ideal for photos and graphics where a slight drop in quality won’t be noticeable. This method often achieves much smaller file sizes, making it the better choice for fast-loading pages.

Before uploading images to your site, follow these steps:

• Resize the image to match the exact dimensions needed on the page.
• Choose the correct format, like JPEG for photos, PNG for transparent graphics, and WebP for better compression.
• Run the image through a compression tool to get it under 100KB

Following this process will ensure every image you upload to your website has the correct dimensions, looks sharp and clear, and has a small file size to keep loading speeds to a minimum.

Useful tools for compressing images:

• TinyPNG / TinyJPG is a quick, browser-based tool that supports batch compression for JPEG and PNG files.
• Caesium Image Compressor is a desktop app for Windows and macOS that we use at Damteq. Caesium offers both lossy and lossless compression with visual previews.
• Lightspeed Cache is a WordPress plugin that automatically compresses images when uploading. This works in the background and includes automatic WebP conversion and lazy loading.

Using descriptive file names

Search engines can’t “see” images like we do. Instead, they rely on file names to understand what an image is about.

A well-named image gives context to both users and search engines, helping improve your site’s visibility in image search results and boosting overall page relevance.

Generic names like IMG001.jpg or photo2.png tell search engines nothing. So before you upload an image to your website, make sure the file name clearly and concisely describes the content, includes relevant keywords, and supports the surrounding page content.

When you optimise file names, you:

• Help search engines better understand your content
• Improve image search rankings
• Support the SEO of the page where the image appears
• Make your files easier to manage, find, and reuse

Here are some more tips for naming image files:

• Rename all image files before uploading to your site
• Use words that clearly describe the image content
• Include target keywords when relevant, but keep it natural
• Use hyphens to separate words (search engines read these better than underscores)
• Avoid keyword stuffing or repeating phrases
• Keep file names lowercase and remove special characters or spaces

Here’s a photo of Ed, one of our UX specialists, in a meeting with our Web team, and what good and bad file names look like for this image:

Good: ed-in-meeting-with-web-team.webp

Bad: IMG87322.jpg

Adding relevant alt-text

Alt text (or alt attributes) are small snippets of code that describe images for both screen readers and search engines.

The primary purpose of alt text is accessibility, helping visually impaired users understand images and your web pages. But it also helps Google understand what your image is about, which supports overall on-page SEO.

Google really values great accessibility, and well-written alt text can improve user experience and give Google more context about your images, which can be great for SEO.

When writing alt text for your image, you should follow these tips:

• Clearly describe the image for visually impaired users
• Try to keep it short, ideally less than 125 characters.
• Avoid repeating image captions or surrounding text
• Skip images that are purely for decoration
• Don’t write “image of” or “picture of”
• Includes a relevant keyword (but only if it fits naturally)
• Don’t keyword stuff. Write for people, not Google

Here’s an image we use across a few of our pages here on the Damteq site:

Here is an example of good alt-text that enhances accessibility and gives Google more context, as well as some bad alt-text examples that would negatively impact UX and SEO.

Good: A group of web designers sat at an office table, working on laptops and reading a marketing magazine

Bad (Vague): People doing stuff at a table

Bad (Keyword Stuffing): Web designers designing websites in a web design office with web design laptops reading web design magazine for web design and digital marketing and SEO web design services

Helpful tools for writing alt text:

• WordPress’s media library has a built-in function for writing alt text after an image is uploaded
• Yoast SEO and Rank Math (WordPress plugins) flag missing or unhelpful alt text and will check for your target keywords in your alt text
• Silktide’s Chrome extension can check for site-wide accessibility issues – like missing alt text and alt attributes

Alt text is small but impactful. Every time you upload an image to your website, you should add relevant, helpful alt text and try to include your target keywords to improve both UX and SEO.

Implementing structured data

Structured data, also called schema markup, gives search engines extra context about your content.

It makes it easier for Google to understand what’s on your page, including your images, and can lead to rich results in search—like this:

For images, structured data can show details like:

• Image subject
• Caption or description
• Author or copyright info

Tips for adding structured data to your website:

• Use JSON-LD format (recommended by Google)
• Include relevant schema types, like ImageObject or Product, depending on the page
• Add metadata such as image URL, alt text, width, and height

Adding JSON-LD code for images on your website is a little technical and will look a little bit like this:

If you need help with this, our SEO Specialists can take care of this for you.

Tools to help with adding structured data

• Google’s Structured Data Markup Helper can guide you through adding schema to your website
• The Schema.org website lists all supported schema types
• Google’s Rich Results Test will check if your structured data is valid and eligible for rich features

Adding structured data doesn’t make your website rank higher on its own, but it gives search engines more to work with.

Creating responsive images

Mobile browsing now accounts for more than half of all internet traffic. But, so many companies still design their websites and images solely for desktop users.

Responsive images improve loading speed and user experience by serving the right image size for each device – whether your users are on mobile, laptop, or desktop.

This means mobile users don’t have to wait for large desktop images to load or run into issues where images don’t appear correctly due to their size.

Responsive images help with:

• Faster page load on mobile
• Better visual quality on retina displays
• Lower bounce rates on slow connections

How to implement responsive images:

• Use the srcset attribute to offer multiple image sizes
• Define sizes to tell the browser which one to use
• Optimise and compress each version separately

Here’s an example of responsive image HTML attributes:

Using lazy loading

Lazy loading improves page speed by only loading images when they’re about to enter the user’s view.

This reduces the amount of data loaded upfront, which can massively improve your page loading speeds, especially on mobile devices.

The benefits of lazy loading images:

• Faster initial page load
• Lower bandwidth usage
• Smoother user experience on scroll-heavy pages

How to implement lazy loading

Adding lazy loading to your images can be pretty straightforward.

All you need to do is add a loading= “lazy” to your <img> HTML tags, which most modern browsers will recognise and support.

If you’d rather not dive into your website code, that’s fine! Plenty of WordPress plugins, like LiteSpeed, can help you enable lazy loading on your images and iframes, or you can reach out to us for help with your SEO.

Monitoring and updating regularly

You should make a habit of regularly checking and updating images on your website to maintain performance.

It’s easy to forget to optimise image sizes, file names, alt text, and include all these extra HTML attributes, especially when you’re just quickly editing or adding pages to your website.

So, every so often, go through your website’s image library or go through page by page (if your website is small enough), and check through these points:

• Are there any image files bigger than 100KB? If yes, can they be compressed further?
• Are all images named accurately and appropriately?
• Has accurate alt text been added to all images (aside from decorative ones)
• Is lazy loading enabled on your website, and is it working correctly?
• Have you added structured data where necessary?
• Are all images responsive for different screen sizes? Test your pages on multiple devices where you can

Other Things to Know About Image Optimisation

Image Content Delivery Networks (CDNs)

Using a Content Delivery Network (CDN) helps deliver images quickly from servers near your users.

This reduces latency (slow server responses) and improves page load times, especially for visitors far from your primary website server. Popular CDNs for images include Cloudflare, Fastly, and ImageKit.

CDNs also provide benefits like image compression, resizing, and automatic format conversion to suit different devices.

Implementing a CDN can be particularly useful for ecommerce websites or any site that gets a lot of traffic, has thousands of images, or has a lot of large image files.

Image file metadata

Removing unnecessary metadata from images can reduce file size without affecting quality.

Image metadata includes information like camera details, creation dates, and editing history, which isn’t necessary for web display.

This is not to be confused with website metadata (like meta titles and descriptions), which is different and definitely something every page on your website should have.

Tools like Photoshop or online compressors often offer options to strip metadata during the compression process, helping to keep image file sizes down.

Browser caching

Enabling browser caching on your website means that users don’t have to download the same images every time they visit.

Instead, cookies store files locally on their device, improving load speeds for returning visitors.

Once again, LiteSpeed Cache is a great WordPress plugin that can help manage caching effectively. If you’re already using browser caching, make sure your caching settings are correctly configured to reduce load times and improve the overall user experience.

Image licencing

If you’re using licenced stock images across your website, make sure you’re using them correctly.

Different stock image sites will have their own licence terms that you need to adhere to. Whichever site you use, whether it’s Shutterstock, Adobe Stock, or free sites like Pixabay – make sure you’ve read and understood what you can and can’t do with the images you download.

This helps you avoid potential copyright legal issues and keeps your website content authentic.

Obviously, this point doesn’t relate to image optimisation, but I thought it’s worth mentioning.

Image aspect ratios

Using consistent image aspect ratios improves how images scale across different screen sizes, preventing distortion and helping improve image responsiveness.

We’ve already covered how image responsiveness improves user experience by scaling images correctly and ensuring the whole image is visible on any device, and as I said earlier in this article, Google loves it when you prioritise your user experience.

Consistent aspect ratios aren’t going to revolutionise your SEO performance; it’s just another thing to bear in mind for image responsiveness.

Need help optimising your on-page SEO?

From keyword research and content strategy to metadata management, position tracking, and optimising your images for SEO, our Specialists can handle the whole SEO process for you.

In the last year, we’ve helped dozens of clients improve their marketing performance through Technical and on-page SEO strategies—clients like Alitex, who saw a 283% increase in organic clicks from their project with us.

To get SEO results like this for your business, get in touch to speak with one of our Specialists.