Free Guide

Image SEO Guide for Local Websites

Images are one of the most overlooked SEO opportunities on local business websites. Optimized images improve your rankings, speed up your pages, increase accessibility, and help AI tools understand your content.

Most local business websites are full of images — project photos, team pictures, hero banners, before-and-after galleries. But very few of these images are optimized for search engines. Uncompressed images slow down pages. Missing alt text excludes visually impaired users. Generic file names provide no context to Google. This guide covers every aspect of image optimization for local websites, from file naming to AI readiness.

Why Image SEO Matters

Images are one of the most overlooked SEO opportunities on local business websites. Properly optimized images improve your search rankings, make your pages load faster, increase accessibility for people with disabilities, and help AI tools understand your content. Google Images is also a significant search channel — many potential customers search for visual results when looking for local services, portfolio examples, or before-and-after photos. When your images are optimized, they appear in Google Image search results, driving additional traffic to your site. When they are not optimized, they slow down your pages, provide no context to search engines, and exclude visually impaired users from understanding your content.

Image File Naming

Before you upload an image to your website, rename the file with a descriptive, keyword-relevant name. Search engines read file names to understand what an image depicts. Use lowercase letters, separate words with hyphens, and include relevant keywords naturally. For example, instead of 'IMG_2024_03_15_001.jpg,' use 'kitchen-remodel-before-after-edmonton.jpg.' Instead of 'photo1.png,' use 'emergency-plumbing-repair-tools.jpg.' Keep file names concise but descriptive. Avoid keyword stuffing — 'plumber-plumbing-plumber-edmonton-plumbing-repair.png' provides no value and looks spammy. A good file name tells both search engines and humans what the image shows.

Alt Text Best Practices

Alt text (alternative text) is a written description of an image that serves two purposes: it provides context for search engines and it describes the image for visually impaired users who rely on screen readers. Good alt text is descriptive, concise, and relevant to both the image and the surrounding content. For a photo of a completed kitchen renovation, effective alt text might be: 'Completed kitchen renovation with white cabinets and quartz countertops in Edmonton home.' This describes what the image shows, includes the service type, and mentions the location. Keep alt text under 125 characters. Avoid starting with 'image of' or 'photo of' — screen readers already announce it as an image. Do not leave alt text blank, and do not use the same alt text for every image on your site.

Image Compression and Format

Large, uncompressed images are the number one cause of slow page speed on local business websites. Every image should be compressed before upload, and modern formats should be used wherever possible. WebP is the current standard — it provides excellent quality at significantly smaller file sizes than JPEG or PNG. AVIF offers even better compression and is supported by modern browsers. Use tools like TinyPNG, Squoosh, or your CMS's built-in compression to reduce file sizes. As a general guideline, most images on your website should be under 200KB. Hero images can be slightly larger but should still be under 500KB. If your images are multiple megabytes, they are slowing down every visitor's experience and hurting your search rankings.

Image Dimensions and Sizing

Serve images at the correct dimensions for where they appear. A thumbnail does not need to be 4000 pixels wide. A hero image does not need to be 8000 pixels tall. Serving oversized images and scaling them down with CSS wastes bandwidth and slows page loading. Measure the maximum size each image will appear on your website and serve it at 1x to 2x that dimension. For responsive designs, use the HTML srcset attribute to serve different image sizes for different screen widths. Always specify width and height attributes in your HTML to prevent layout shift — the visual jumping that happens when images load and push content around. This also improves your Core Web Vitals scores.

Structured Data for Images

For images that represent specific entities — like products, recipes, or events — you can add structured data to help search engines understand the image context. For local businesses, the most relevant image schema is typically embedded within your LocalBusiness or Organization schema, using the 'image' property to reference your logo or representative images. If you have a gallery or portfolio section, consider implementing ImageObject schema for individual images with descriptive properties. While not every image on your site needs schema, your key representative images — logo, hero images, portfolio highlights — benefit from structured data that clearly identifies them.

Lazy Loading

Lazy loading delays the loading of images until they are about to enter the viewport (the visible area of the page). This improves initial page load time because the browser does not have to download every image on the page immediately. For websites with many images — like portfolio pages or galleries — lazy loading can dramatically improve performance. In modern HTML, you can enable lazy loading simply by adding loading='lazy' to your image tags. However, do not lazy load above-the-fold images (like your hero image), as these should load immediately for the best user experience. Lazy loading is a performance optimization that directly impacts your Core Web Vitals and search rankings.

Accessibility Considerations

Image optimization is also an accessibility issue. People with visual impairments rely on screen readers to understand web content. When images lack alt text, these users miss important information. When alt text is vague or generic, it provides no value. Every informative image on your website should have descriptive alt text. Decorative images (like abstract backgrounds or decorative borders) can have empty alt text (alt='') so screen readers skip them. Ensure sufficient color contrast if your images contain text overlays. Do not use images of text as a substitute for actual text — screen readers cannot read text embedded in images. These practices are not only ethical but also required for WCAG compliance.

AI and Image Understanding

AI-powered search tools are increasingly capable of understanding image content. Google's visual search, Lens, and AI Overviews can analyze images and incorporate them into search results. When your images are well-optimized — with descriptive file names, accurate alt text, and proper dimensions — AI tools can better understand and surface them. For local businesses, this means your portfolio photos, team images, and project examples can appear in AI-powered visual search results. The key is providing clear, descriptive metadata around your images so that both traditional search engines and AI tools can accurately interpret what they show.

Image SEO Quick Reference

File Name Format

lowercase, hyphens between words, descriptive, keyword-relevant. Example: emergency-plumbing-repair-edmonton.jpg

Alt Text Guidelines

Under 125 characters, descriptive, no "image of" prefix, unique for each image, includes context and location when relevant.

Compression Targets

Use WebP or AVIF format. Most images under 200KB. Hero images under 500KB. Test with PageSpeed Insights.

Lazy Loading

Apply loading='lazy' to below-the-fold images. Do not lazy load hero or above-the-fold images. Always set width and height.

Image SEO Checklist

  • All images have descriptive, keyword-relevant file names
  • All informative images have unique alt text under 125 characters
  • Images are compressed and served in WebP or AVIF format
  • Image dimensions match their display size (not oversized)
  • Width and height attributes are specified on all images
  • Lazy loading is applied to below-the-fold images
  • Hero and above-the-fold images load immediately
  • Decorative images use empty alt text (alt='')
  • Portfolio and project photos include descriptive context
  • Logo and key images are referenced in schema markup

Related Resources

Want the Complete System?

If you want the complete templates, workflows, AI skills, QA checklists and production system used throughout this guide, the Master Lead Website Builder System includes everything in one downloadable package.

Get the Master Lead Website Builder

Need Help Optimizing Your Website Images?

A free revenue review evaluates your entire website, including image optimization, page speed, and accessibility. Get a personalized report showing exactly where your images need improvement.

Get a Free Revenue Review
Ask Wade AI