The short answer
To optimise images for SEO, give each file a descriptive name (digital-marketing-class-trivandrum.webp), write alt text that describes what the image shows, resize it to the size it’s displayed at, and serve it as WebP or AVIF. Lazy-load images below the fold, but not the main image at the top. In WordPress, add alt text in the Media Library or the image block settings.
Before you start
By the end of this SOP
Images on key pages are named, described, compressed and sized correctly.
- Time
- 10–20 minutes per page
- You’ll need
- Edit access to the site and an image tool (Squoosh, Canva, or a WordPress optimisation plugin).
- Who does this
- The person who publishes content.
About this SOP: why it matters, where and when
Why it matters: Good images load fast, help accessibility, and can bring traffic from Google Images.
Where: In your image editor and the website’s media library.
When: Every time you upload an image, plus a one-time clean-up of key pages.
Stage 1
Before uploading
- 1
Resize to the width it will be shown at (e.g. 1200 px for a full-width blog image, not 4000 px).
- 2
Convert to WebP or AVIF and compress (squoosh.app is free). Aim for well under 200 KB for most images.
- 3
Rename the file with words, not numbers: unlearn-trivandrum-campus-classroom.webp, not IMG_2023.jpg.
Stage 2
Write alt text
- 1
Describe what the image shows, as you would to someone who can’t see it. Add the keyword only if it naturally fits.
- Good: “Students working on laptops in the Unlearn Academy Trivandrum classroom”.
- Bad: “digital marketing course kerala best digital marketing course”.
- 2
WordPress: Media → Library → click the image → Alternative Text. Or select the image block → Settings → Alternative text.
- 3
Purely decorative images (backgrounds, dividers) can have empty alt text.
Stage 3
Check loading
- 1
Lazy-load images below the fold (WordPress does this by default). Don’t lazy-load the main top image; it’s often the LCP element.
- 2
Run the page in PageSpeed Insights (SOP 058) and check the image items under Insights, e.g. “Improve image delivery”.
Agency playbook
Doing this for a paying client
What a senior checks before calling the job done. Numbers are starting rules; compare them with the account’s own history.
What good looks like
- The top image has fetchpriority=“high”, no lazy loading, and fixed width and height to avoid layout shift.
- Important images are in HTML <img> tags, not CSS backgrounds, so Google can find and index them.
- Starting rule: the image on the hero spot is under about 150 KB on mobile, and served at the right size per screen.
- Alt text describes this specific photo. Ten images never share the same alt text.
- Photos are real and owned or licensed. Stock and AI images are used only where they don’t pretend to be real proof.
Mistakes we see on real accounts
- Running a bulk WebP plugin without a backup. Broken images on product pages mean lost sales until someone notices.
- Lazy-loading the hero image site-wide. LCP gets worse on every page, especially on slow mobile networks.
- Using images from Google search results. Copyright notices and takedown demands land on the client’s desk.
- Writing alt text as a keyword list. It fails screen reader users and can look like spam.
- Putting prices or offers only inside images. Google and AI answers can’t read them reliably, and they go stale.
Agency checklist before you call it done
- Full site backup or media backup taken before any bulk compression or conversion plugin runs.
- Before and after PageSpeed Insights reports for mobile are saved in the client folder.
- Image licence or ownership confirmed for every photo you upload. Client sent originals in writing.
- Change log lists plugins added, settings changed and any CDN (content delivery network) or URL changes.
- Image URLs that changed are redirected, or old ones kept, so Google Images traffic isn’t lost.
- Client approved alt text for people, products or anything sensitive.
- Report shows LCP (Largest Contentful Paint) and page weight before and after, plus any Google Images clicks from GSC.
Handover message to the client
Hi [Client name], we optimised the images on [pages]. Page weight dropped from [X] MB to [Y] MB, and mobile load time improved in PageSpeed. Please send new real photos of [topics] by [date] so we can replace the remaining stock images.
Senior tip
Ask the client for a monthly folder of real photos: classes, staff, work, happy customers. Original images build trust and can earn visibility that stock photos never will.
Practice & check
Now do it for real
Reading is not doing. Open your own account and complete this task before you move on.
Practice task (5 min)
Take five images from a real page: rename, resize, convert to WebP and write alt text for each. Note the size before and after.
Prove it
Two questions. Get both right and this SOP is done.
Common questions
Does alt text help SEO?
Yes. It helps Google understand images and can bring Google Images traffic, and it makes your site accessible.
What is the best image format for websites?
WebP is widely supported and much smaller than JPEG or PNG. AVIF is even smaller where supported.
Done. That’s a real skill, not a certificate.
Next: SOP 218 — Audit the On-Page SEO of a Page →
Want to do this on real client budgets, with a mentor checking your work? That’s Level 2 at Unlearn. See the Digital Marketing track