Google Image Search drives significant organic traffic — often 20–30% for ecommerce, recipe, and how-to sites. Beyond image search itself, images affect your Core Web Vitals score: the Largest Contentful Paint (LCP) element is an image on most pages. Slow, bloated, or mislabeled images silently drain your rankings. This guide covers every factor that matters in 2026.

1. Use descriptive file names

The filename is one of the first signals Google reads when it crawls an image. A generic name like IMG_3847.jpg tells the crawler nothing. A descriptive name like black-leather-sneakers-mens.jpg tells it the subject, product type, and color at a glance.

Use hyphens between words — Google treats hyphens as word separators; underscores are not
Match the primary keyword you want the image to rank for
Be specific: how-to-compress-images-for-web.webp beats image1.webp
Rename files before uploading — renaming after publishing changes the URL and loses any earned signals

2. Write meaningful alt text

Alt text serves two audiences: screen readers for accessibility, and search engines for context. The same rule applies to both: describe what is actually in the image, accurately and concisely.

Bad: alt="" (empty on a content image) or alt="image" (generic)
Good: alt="Screenshot of Picovert image compressor reducing a 2 MB PNG to 400 KB"
Include your target keyword naturally — do not repeat it multiple times (keyword stuffing is detected)
Keep alt text under ~125 characters; anything beyond is typically truncated by screen readers
Decorative images (dividers, icons) should use alt="" — empty string, not omitted

3. Compress images to reduce file size

Google's PageSpeed Insights and Lighthouse both penalize pages with oversized images. Large images delay LCP, lower your PageSpeed score, and reduce Google's willingness to crawl subsequent pages on your site.

Target under 200 KB for standard blog or product images
Target under 100 KB for thumbnails and list-page images
Use JPEG quality 80–85 for photographs — the difference from 100 is invisible, the savings are not
Use PNG for screenshots, diagrams, or images with text (lossless detail matters there)
Tools like Picovert Image Compressor, Squoosh, and ImageOptim handle bulk compression without leaving your browser

4. Use modern formats: WebP and AVIF

JPEG and PNG are legacy formats optimized for hardware from the 1990s. Modern alternatives deliver equivalent visual quality at a fraction of the file size:

WebP: 25–35% smaller than JPEG at the same perceptual quality. Supported by all modern browsers as of 2020.
AVIF: Up to 50% smaller than JPEG. Supported by Chrome, Firefox, and Safari (iOS 16+). Browser support reached ~90% globally in 2025.

Next.js <Image>, WordPress with modern themes, and CDNs like Cloudinary auto-serve WebP or AVIF when the browser supports it. For manual workflows, convert JPEG or PNG to WebP before uploading.

5. Upload at the correct dimensions

Never upload a 4000 px wide image to fill an 800 px column. The browser downloads the full file and then scales it down visually — you pay the bandwidth cost with zero visual benefit. Resize images to match (or slightly exceed, for high-DPI screens) the displayed size before uploading.

For responsive layouts, use the srcset attribute to provide multiple sizes and let the browser pick the right one for the device. Use Picovert Image Resizer to generate multiple size variants quickly.

<img
  src="product-800w.webp"
  srcset="product-400w.webp 400w, product-800w.webp 800w, product-1200w.webp 1200w"
  sizes="(max-width: 600px) 400px, 800px"
  alt="Black leather sneakers, men's size 10"
  width="800"
  height="600"
>

6. Enable lazy loading for below-the-fold images

The loading="lazy" attribute on <img> tells the browser to defer fetching the image until it is near the viewport. This reduces initial page weight, speeds up Time to Interactive (TTI), and improves Cumulative Layout Shift (CLS) when combined with explicit dimensions.

Do not lazy-load above-the-fold images — that delays LCP and hurts your Core Web Vitals score
Do lazy-load every image below the fold: blog body images, product grid items, comment avatars
Most modern CMSs (WordPress 5.5+, Shopify, Squarespace) add this attribute automatically

7. Add structured data for images

JSON-LD schema markup gives Google explicit metadata about your images, which can unlock rich results in Search.

Product pages: include the image property in your Product schema — required for Google Shopping rich results
Recipe and how-to pages: add an ImageObject inside the relevant schema; Google may display the image in the rich result card
Articles: the Article schema image field influences how your thumbnail appears in Google Discover and Top Stories

At minimum, set contentUrl, width, height, and caption on any ImageObject entry.

8. Serve images through a CDN

A Content Delivery Network (CDN) serves images from edge nodes geographically close to each user, reducing latency. The difference between a 300 ms image load and a 50 ms image load is measurable in LCP scores and bounce rate.

Cloudflare Images, Cloudinary, and Imgix offer on-the-fly resizing and format conversion
Many hosting providers (Vercel, Netlify, Render) include a CDN — verify that it covers static assets
If your host does not include a CDN, Cloudflare's free plan covers the basics

Quick SEO checklist

Run through this for every image before publishing:

Descriptive file name with hyphens and target keyword
Meaningful alt text (under 125 characters, keyword included naturally)
File size under 200 KB (under 100 KB for thumbnails)
Format is WebP or AVIF
Dimensions match the displayed size
loading="lazy" on below-the-fold images
Explicit width and height attributes set
Schema markup includes image reference (product, recipe, article)

Most audits find that fixing file names, compression, and format alone moves the needle within weeks. Start with those three, then layer in the rest. Use Image Compressor and Image Converter to handle the bulk work in your browser without any upload.