All guides
8 min read
by Nesou

Image Optimization Checklist: Compress, Convert, Rename and Describe Images

A complete image optimization checklist covering compression, file formats, filenames, alt text, captions, and background cleanup.

Nesou
Image Optimization Checklist: Compress, Convert, Rename and Describe Images

Introduction

Publishing a blog post, product page, or portfolio without optimizing images is like shipping a package with extra weight you pay for on every delivery. Unoptimized photos slow your site, hurt accessibility, and waste a free SEO channel in Google Image Search. The fix isn't one magic setting, it's a short, repeatable checklist you run on every image before it goes live.

This guide walks through format choice, compression, filenames, alt text, captions, and background cleanup, the six areas that matter most for creators, marketers, and small business owners who don't have a dedicated design team. Use it as your pre-publish routine, and pair it with the deeper tactics in our Image SEO guide when you're ready to go further.

Optimizing an image takes two minutes once. Fixing a slow page or a broken layout after publish takes much longer.

Choose format

Format choice sets your ceiling for file size and quality. Pick wrong and you'll either bloat the page (PNG for a photo) or lose transparency (JPG for a logo).

  • JPG: photos, hero banners, and any image without transparency. Best balance of size and quality at 70-85% compression.
  • PNG: logos, icons, screenshots with sharp text, and anything that needs a transparent background.
  • WebP: default for modern sites when your CMS or build step supports it, often 25-35% smaller than JPG at the same visual quality.

If you're staring at a 3 MB PNG that's really a photograph, convert it before you compress. The PNG to JPG Converter runs in your browser, so nothing uploads to a third-party server. For a full format comparison, see PNG vs JPG and how to convert images.

Compress before upload

Compression is the highest-leverage step for page speed. Google's Core Web Vitals treat load performance as a ranking factor, and images are usually the heaviest assets on the page. Compress before upload so your CMS, CDN, and backups all store the lean version.

  • Resize to actual display width first (hero: ~1600px, inline: ~1200px, thumbnails: 400-600px).
  • Aim for under 200 KB per image on blogs and marketing pages; up to 300 KB for detailed heroes.
  • Use a local, browser-based tool so client work and unreleased designs never leave your device.

Run each file through the Image Compressor. It processes images entirely on your machine, no account and no upload queue. If you're new to the workflow, our how to compress images guide covers quality settings and dimension targets in detail.

Rename files

Cameras and design exports default to names like IMG_4821.jpg or export-final-2.png. Search engines read filenames as a weak but real signal of what the image shows. Rename on your computer before upload, changing the URL later breaks links and cached shares.

  • Use lowercase letters and hyphens: blueberry-muffin-recipe-hero.jpg
  • Include the topic or keyword naturally, without stuffing
  • Keep names under five words when possible, descriptive beats clever
  • Match the filename to the page topic when the image is the main visual

Good filenames also help your future self find assets in Google Drive or Dropbox six months later. Treat them like labels on folders, not throwaway metadata.

Alt text

Alt text describes the image for people who can't see it and tells search engines what it depicts. Write for a blind reader sitting next to you: what would they need to understand the image's purpose on this page?

  • Good: alt="Hands kneading sourdough on a floured wooden board"
  • Bad: alt="image" or keyword lists repeated three times
  • Stay under ~125 characters; put the most important detail first
  • Don't start with "image of" or "picture of", screen readers already announce it as an image

Stuck on wording? Paste the image into the Image Describer for a starting draft, then edit for accuracy and tone. You're responsible for the final alt text, especially on YMYL or product pages where a wrong description misleads buyers.

Captions

Captions sit below the image and get read more than body copy, people scan, and the caption is where their eyes land. Google indexes caption text too, so use it for context, not jokes that ignore the page topic.

  • Explain why the image is on the page, not just what it looks like
  • Keep captions short: one sentence, under 20 words when possible
  • Align caption keywords with the article's main topic without forcing repetition
  • Skip captions on purely decorative images; alt should be empty instead

A product photo might use alt text for the object ("Stainless steel pour-over kettle with gooseneck spout") and a caption for the benefit ("The gooseneck spout gives you control for even extraction"). That split helps both accessibility and SEO without sounding robotic.

Remove backgrounds

Not every image needs a cutout, but when it does, a messy or default white box behind a logo screams "template." Remove backgrounds for ecommerce product shots, team headshots on branded color blocks, app store graphics, and social ads where the subject should float on your layout.

Use the Background Remover for quick cutouts in the browser. Export as PNG if you need transparency on the site; convert to JPG only when you're placing the subject on a solid color background you control. Always check edges on hair, glass, and fine details, automated tools are fast, but a thirty-second manual touch-up still wins on hero images.

Final checklist

Run this numbered list on every image before you hit publish:

  1. Format: JPG or WebP for photos; PNG for transparency; convert stray PNG photos with the PNG to JPG Converter.
  2. Dimensions: resize to the width the image will actually display, not the camera default.
  3. Compression: under 200 KB for most web images using the Image Compressor.
  4. Filename: lowercase, hyphens, descriptive (e.g. team-retreat-2026-group-photo.jpg).
  5. Alt text: accurate, concise, written for humans first; draft with the Image Describer if needed.
  6. Caption: one clear sentence when the image carries information or proof.
  7. Background: remove only when transparency or a clean cutout improves the design, via the Background Remover.
  8. Lazy loading: add loading="lazy" below the fold; keep the hero image eager for Core Web Vitals.
  9. SEO review: confirm the image supports the page topic and read the Image SEO guide for advanced signals.

Frequently Asked Questions

What is the fastest way to optimize images for the web?

Pick the right format, resize to display dimensions, compress to under 200 KB, rename with descriptive hyphens, and add alt text before you upload. Doing those five steps once per image prevents most performance and SEO problems.

Should I optimize images before or after uploading to WordPress or Shopify?

Before. CMS plugins can compress on upload, but they rarely rename files, fix alt text, or convert PNG photos to JPG. A pre-upload checklist gives you full control and smaller originals in your media library.

Do I need alt text on every image?

Every meaningful image needs descriptive alt text for accessibility and SEO. Purely decorative images (spacers, repeating backgrounds) should use empty alt (alt="") so screen readers skip them.

When should I remove an image background?

Remove backgrounds for product cutouts, profile photos on colored layouts, logos on hero sections, and marketplace listings. Skip it for full-scene photos where the environment is part of the story.

How does image optimization affect SEO?

Smaller files improve Core Web Vitals and page speed, which Google uses as ranking signals. Descriptive filenames, alt text, and captions help images appear in Google Image Search and reinforce the page topic.

Put the checklist into practice

You don't need Photoshop or a paid plugin stack to ship optimized images. Open the Image Compressor for size, the PNG to JPG Converter for format fixes, the Background Remover for clean cutouts, and the Image Describer when alt text needs a strong first draft. All four run in your browser, free, with no upload required. Make this checklist a habit and every page you publish will load faster, read better, and stand a better chance in image search.

Found this article useful?

Comments

Comments are moderated before publication.

Submit a comment

0/1000
  • Loading comments…

Written by

NesouFounder & Creator

Nesou is a developer and creator who built Sounez to make professional-grade tools free and accessible. The focus is on tools and guides that solve real tasks for creators, designers and makers - without unnecessary complexity or paywalls. About Sounez

Ready to put this into action?

Open Image Compressor and try it now. Free, no account needed.

Open Image Compressor

Keep reading