Image SEO: Alt Text, File Names, Compression, and More

Images are simultaneously an SEO opportunity and a common SEO liability.

Poorly optimized images slow pages down and waste their potential as search signals. Well-optimized images contribute to page speed, accessibility, relevance, and Google Image Search visibility.

This guide covers every image SEO factor that matters in 2026.

File Names: The First Signal

When you upload an image, its file name is the first signal search engines use to understand what the image shows.

Bad:

• IMG_4829.jpg
• image001.png
• screenshot_20240315.jpg

Good:

• web-design-services-bangkok.jpg
• technical-seo-audit-checklist.jpg
• astro-website-speed-comparison.jpg

Best practices:

• Use descriptive file names that reflect the image content
• Include a relevant keyword where natural (do not force it)
• Use hyphens to separate words (not underscores, not spaces)
• Keep file names concise — 3-6 words is usually enough
• Set file names before uploading — renaming after upload requires updating the src attribute

Alt Text: Required for SEO and Accessibility

Alt text is an HTML attribute that describes what an image shows. Search engines read it. Screen readers announce it to visually impaired users.

HTML:

<img src="technical-seo-audit.jpg" alt="Technical SEO audit checklist for small business websites" />

Best practices:

• Describe what the image actually shows — be specific
• Include a relevant keyword naturally, where it genuinely describes the image
• Keep it concise: 5-15 words for most images
• Avoid starting with “image of” or “picture of” — search engines already know it is an image
• For decorative images (design elements, dividers), use empty alt text: alt=""

What to avoid:

• Keyword stuffing: alt="SEO services SEO agency best SEO cheap SEO Bangkok"
• Generic descriptions: alt="photo"
• Missing alt text entirely (common on sites with many images)
• Identical alt text on multiple different images

Check your alt text: Our Image SEO Checker audits every image on a page and flags missing or problematic alt text.

Image Formats: Use WebP

Not all image formats are equal for SEO. Format affects file size, which directly impacts page speed.

Modern Astro sites automatically convert images to WebP/AVIF using the <Image> component. This is one of the reasons Astro websites load significantly faster than equivalent WordPress sites.

Compression: Reduce File Size Without Losing Quality

Large image files are one of the most common page speed killers. An uncompressed photo can be 3-8MB; a well-compressed WebP version of the same image might be 50-150KB.

Target file sizes:

• Hero images: under 200KB
• Blog post images: under 150KB
• Small thumbnails/icons: under 30KB
• Full-page background images: under 400KB

Free compression tools:

• Squoosh.app — browser-based, excellent WebP conversion
• TinyPNG / TinyJPG — fast, simple compression
• ImageOptim (Mac) — batch compression tool

In Astro: the <Image> component handles compression and format conversion automatically at build time. No manual work needed.

Image Dimensions: Right Size, No Oversizing

Loading a 4000x3000px image and displaying it at 800x600px wastes bandwidth and slows load time. The browser downloads the full-size image regardless of the display size.

Best practices:

• Use images at or close to their display dimensions
• Use srcset and sizes attributes for responsive images (serve different sizes to different devices)
• Never load a 3000px image to display at 300px — resize it first
• Always specify width and height attributes on <img> tags to prevent Cumulative Layout Shift (CLS)

Why CLS matters: If an image loads without dimensions set, the browser does not reserve space for it. When it loads, the page jumps — causing a CLS penalty and a bad user experience.

Lazy Loading: Defer Off-Screen Images

Images below the fold do not need to load when the page first opens. Lazy loading defers them until the user scrolls near them.

HTML:

<img src="image.webp" alt="Description" loading="lazy" width="800" height="450" />

Important: Do NOT lazy load images that are visible above the fold when the page loads. Lazy loading your hero image will hurt your LCP (Largest Contentful Paint) score significantly.

General rule:

• First image on the page (hero, featured image): loading="eager" or no loading attribute
• All images below the fold: loading="lazy"

Image Sitemaps

For sites where images are a significant part of the content (photography, e-commerce, news), an image sitemap helps Google discover and index images that might otherwise be missed.

Include image data in your regular sitemap using the image extension:

<url>
  <loc>https://example.com/page/</loc>
  <image:image>
    <image:loc>https://example.com/images/example.jpg</image:loc>
    <image:title>Descriptive title of the image</image:title>
  </image:image>
</url>

Check your sitemap with our Sitemap Checker.

Structured Data for Images

For articles and blog posts, Article schema should include the image property pointing to your featured image. This helps Google understand the primary image associated with the article:

{
  "@type": "Article",
  "image": {
    "@type": "ImageObject",
    "url": "https://webaloha.co/images/blog-image-seo.jpg",
    "width": 1200,
    "height": 630
  }
}

Including image dimensions in the schema helps Google understand the image’s aspect ratio without having to download it.

Google Image Search Optimization

Images with strong alt text, descriptive file names, and relevant surrounding content can rank in Google Image Search — a secondary traffic channel worth claiming.

Additional tips for image search:

• Place images near relevant text content (Google uses surrounding text as context)
• Use high-quality, original images rather than stock photos (more likely to be featured)
• Add image captions where relevant — they provide additional keyword context
• Ensure the page the image lives on is properly indexed

Quick Image SEO Checklist

For every new piece of content:

• Descriptive file names set before upload (hyphens, keywords where natural)
• Alt text on every image (specific, descriptive, not stuffed)
• WebP format used where possible
• Images compressed below target file sizes
• Hero/above-fold image has loading="eager" or no loading attribute
• Below-fold images have loading="lazy"
• width and height attributes set on all images
• Featured image included in Article schema with dimensions

Run an audit: Image SEO Checker checks all images on any page instantly.

Image SEO is part of the full on-page SEO checklist. For a complete picture of your site’s SEO health, the technical SEO audit guide covers all the infrastructure factors. Our SEO Services include image optimization as part of every engagement.

Frequently Asked Questions