Last updated: November 1, 2026.
A page can be very well written. But if its images load late, look blurry, have nothing to do with the topic or take up half the screen on mobile, that page is not good from the user’s point of view.
Especially in fields like e-commerce, travel, fashion, automotive, food or film, users often look at the image first and only then decide whether to read the text.
On the SEO side, images are not just elements that make the page look nice either.
They affect page speed, help Google understand the content, can bring traffic from Google Images and directly affect accessibility.
That is why I think treating image SEO as nothing more than “let’s write some alt text” misses a lot.
The real issue is being able to serve the right image, in the right format, at the right size, without hurting the user experience.
Let’s talk about that a bit.
The first thing people think of with image SEO is alt text
Alternative text (alt text) is the text that describes an image when it can’t be displayed, or for people using screen readers. Google can also use it to understand what the image shows.
Say we have a photo of a coffee machine. Alt text like this doesn’t say much:
coffee machineThis is a bit more meaningful:
Black automatic espresso coffee machineBut there’s no need for this:
coffee machine best coffee machine cheap coffee machine coffee machine pricesAt this point we are no longer describing the image, we are stuffing keywords.
When I write alt text, I simply ask myself:
How would I describe this image in one sentence to someone who can’t see it?
Most of the time that’s enough.
Don’t forget the accessibility side
The job of alt text is not only to describe the image to Google. Screen readers used by visually impaired users also rely on alternative text to understand what the image is.
So I think treating alt text as a field you fill in just for SEO is wrong. A well-built website should be usable by as many people as possible.
Google has also long treated user experience and accessibility as important parts of web quality. So when we describe an image correctly, we are not only helping the search engine; we are also making sure a user who can’t see the image can still understand the page.
I think this is a point where SEO and good web development meet anyway.
Does the file name matter?
It does. But I think the SEO world sometimes gives it more weight than it deserves.
Using black-espresso-coffee-machine.jpg instead of IMG_83829.jpg is more meaningful.
But we can’t make a bad image strong for SEO just by changing its file name.
The file name is a small piece. What really matters is that the image is good quality, used on the right page and relevant to the content around it.
JPG, PNG, WebP, AVIF, SVG… Which one should we use?
In my older training sessions I used to go through these formats one by one. Even back then my goal wasn’t to say “Use the newest format.” It was to pick the right format for the right image.
Right now, I roughly think of it like this:
- JPG / JPEG: Still very useful for photos.
- PNG: Useful for images that need transparency or lossless quality, but the file size can get large.
- WebP: Can deliver good quality for photos and graphics at smaller file sizes.
- AVIF: Can produce quite small files at similar quality.
- SVG: A big advantage for logos, icons and vector graphics. It scales independently of resolution.
What matters to me here is not “Which format is the newest?” but “Which format lets me serve this image with the best balance of quality and file size?”
Making an image smaller is not the same as ruining it
I think this is the most important point.
Picture an e-commerce site. You took a 10 MB product photo down to 500 KB. Great.
But if you destroyed the product’s details just to get that 500 KB down to 50 KB, you have a different problem. The user can’t see the texture of the fabric, can’t make out the details of the machine, or can’t tell whether the product is good quality.
The page loads fast, but the user doesn’t trust the product. I think we sometimes forget this in SEO.
If the optimization we do for speed hurts sales, the optimization itself starts to lose its point.
Do we need to send a 2,000-pixel image to a phone?
Usually not.
The image used on a wide desktop screen and the image shown on a 390-pixel-wide phone don’t have to be the same size.
This is where responsive images come in. With srcset, sizes and, when needed, the <picture> element, the browser can choose the right image for the device. That way we don’t make a small screen download a huge file for no reason.
<img src="coffee-machine-800.jpg"
srcset="coffee-machine-400.jpg 400w, coffee-machine-800.jpg 800w, coffee-machine-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 800px"
alt="Black automatic espresso coffee machine">In my older training sessions I also used the <picture> element to show WebP + JPG together:
<picture>
<source srcset="coffee-machine.webp" type="image/webp">
<img src="coffee-machine.jpg" alt="Black automatic espresso coffee machine">
</picture>The logic is still the same:
Don’t send a bigger file than the user needs.
Why do width and height matter?
This is more technical, but it’s worth knowing.
When an image’s width and height are defined in the HTML, the browser knows how much space to reserve on the page before the image loads.
<img src="coffee-machine.jpg" width="800" height="600" alt="Black automatic espresso coffee machine">Otherwise, when the image loads later, text and buttons can jump up and down. That hurts the user experience. We measure this shift with the CLS (Cumulative Layout Shift) metric; I explain it in detail in Chapter 24.
An SEO specialist doesn’t have to code this. But they do need to be able to tell the developer when they see the problem.
Should every image use lazy loading?
No.
The idea behind lazy loading is good. If the user hasn’t reached an image further down the page yet, don’t load it right away. On long pages with lots of images it can be a real advantage.
But if we also lazy load the large image at the very top of the page, the one visible on the first screen, we end up doing the opposite and loading the important image late. That makes the LCP (Largest Contentful Paint) value I explain in Chapter 24 worse.
So here too the answer is not “Let’s add lazy loading to every image.”
Let’s use it on the right images, in the right places.
Does traffic come from Google Images?
Yes. And in some industries it can be more valuable than we think.
For example, when a user searches for “small living room decor”, “wedding dress styles”, “red sports car” or “coffee machine”, they can go straight to Google Images.
A user who reaches the site from an image can be quite valuable, especially in industries where people are looking for products, design or inspiration.
Writing alt text alone isn’t enough for this either. The page the image sits on needs to be high quality and relevant. Google doesn’t evaluate the image on its own; it also looks at the content around it.
What if we use the image as a CSS background?
There is a small but important technical detail here.
A decorative background on a page and a product photo that is a key part of the content are not the same thing.
For images that matter for SEO, it’s better to serve them with the standard <img> element. A product photo used only as a CSS background-image may not give us the result we want in Google Images.
What do I look at when checking images?
When I check the images on a site, I don’t only look at whether alt text exists. In general I check:
- Are the images actually needed?
- Are the files bigger than they need to be?
- Is the right format being used?
- Is the mobile user downloading an unnecessarily large image?
- Does the alt text really describe the image?
- Are the images relevant to the topic of the page?
- Is the important image on the first screen delayed?
- Has the quality of the product image been ruined for the sake of optimization?
- Is the right structure used so Google can discover the image?
- Are the images understandable for visually impaired users?
When you fix these, you’re not just working for Google.
The page gets faster, the user sees the product or content better, the mobile experience improves and, in some cases, you gain a new traffic source from Google Images.
I think this is the real logic of image SEO:
It’s not about using the smallest possible image; it’s about giving users the quality they need in the most efficient and accessible way possible.
Previous: Chapter 16: Basic HTML Every SEO Should Know · Contents · Next: Chapter 18: How Does Google Move Through a Site?
This chapter was first published in Turkish on X (September 17, 2026).