Images

‍Key Points

• Why optimize images for SEO? Optimized images can improve page rankings, load speed, and accessibility, attracting more visitors.
• Best image formats for SEO: Use WebP for speed and compression. Use PNG for lossless quality and transparency. Use JPG for compatibility.
• Ideal image sizes and ratios:
  • Open Graph:
    • 1200px × 628px (1:1.9.1)
    • 1600px x 900px (16:9)
    • 1200px x 675px (16:9)
    • 1200px x 1200px (1:1)
    • 1200px x 900px (4:3)
  • Google Discover & News:
    • 1200px x 675px (16:9)
    • 1200px x 900px (4:3)
    • 1200px x 1200px (1:1)
    • All images should be at least 1200px wide!
  • Blog Hero Images:
    • 1600px x 900px (16:9)
    • 1200px x 675px (16:9)
    • 1200px x 1200px (1:1)
    • 1200px x 900px (4:3)
    • Don’t go narrower than 1200px—wider is fine.

• Important image SEO practices:
  • Compress images before uploading to reduce file size and improve page load speed.
  • Use descriptive, relevant alt text to help search engines understand the image content and to aid accessibility.
  • Avoid using text in images as screen readers cannot interpret text within images. Don't rely on GenAI tools for accessibility - they're not there yet.
  • Optimize filenames with context to improve search engine visibility.
  • Responsively serve images based on device width.
  • Use Google Image Search results to analyze the competition and find related search queries.

Image Selection & First Steps

Google values unique images more than those found on multiple sites. Avoid using stock imagery for featured images when possible; it's less critical for background images. Your audience will appreciate this too.

Familiarize yourself with Google's image publishing guidelines.

Quality, original, optimized images can improve your web pages' rankings and attract more people via Google Image Search and rich results in regular Search.

1. Best Image Formats for SEO

WebP and AVIF are the best formats for speed and compression, but users prefer JPG or PNG for compatibility. Our data suggests WebP images are less likely to be indexed in image search than JPGs and PNGs.

Choosing the optimal format for your images enhances quality on all screen sizes and can improve page speed.

• PNG (.png) is better than JPEG (.jpg) for websites because it uses lossless compression, maintaining quality.
• WebP (.webp) is even better for speed and compression, though it performs worse in image search. Developed by Google, WebP offers smaller file sizes and better compression without quality loss. It supports transparency, unlike JPEG.
• AVIF (.avif) has excellent compression efficiency, so high-quality AVIF images have a smaller file size compared to JPEG or PNG. AVIF supports transparency, both lossy and lossless compression, and HDR (high dynamic range) - which PNG and WebP do not. 

Bottom line: both AVIF and WebP offer better compression and quality than older image formats, but PNG and JPEG have a better track record for getting indexed in Image Search. Our recommendation:

• Use JPEG or PNG for hero images & other important images (for indexability)
• Use WebP or AVIF for images that don’t add as much value to the page (for speed)

Compatibility

• ‍WebP and AVIF are supported by most modern browsers, including Chrome, Firefox, Microsoft Edge, and Safari. Note that older Safari versions (3.2 - 16) do not support WebP or AVIF images.
• As of August 2024, Google Search supports AVIF image file types - but not all social platforms do. This blog post has a list of which social media platforms support AVIF and WebP, as well as test URLs you can use to check for yourself.
• WebP images used in Open Graph images (<code>og:image</code>) do not work on LinkedIn posts.
• Many tools can convert JPEG or PNG files to WebP, like TinyIMG. Adobe and Webflow have built-in WebP converters.
• Many tools can convert WebP to JPEG or PNG, like cloudconvert and Canva.

2. eCommerce & Google Merchant Center Product Images

• Product images should be 1x1 ratio (square) to ensure uniformity and visual appeal.
• The product should occupy 75%-90% of the image frame to highlight the product clearly.
• Use white or transparent backgrounds to keep the focus on the product. Google Merchant Center Next offers Product Studio, an AI tool that can remove backgrounds & increase image resolution.
• Optimize resolution & resize images before uploading to ensure fast loading times and clear display.
• Use image alt tags to list product name, type, and important attributes (like color) to improve search engine ranking.
• Test product-only & lifestyle shots to see which performs better for your audience.
• Prefer unique pictures over manufacturer-provided or stock photos to increase engagement and improve SEO.
• Use multiple images in crawlable & indexable carousels to give users multiple views and increase time on page.
• Product images on PDPs should be above the fold on desktop & mobile to ensure immediate visibility.
• Mix product images with video, if possible, to provide a richer user experience.
• Avoid using the same product image on multiple PDPs to ensure each page has unique content.

3. Image Sizing & SEO

Compress images before uploading them to the CMS to avoid slowing down page loading speed and annoying users.

Don't rely on CSS or HTML attributes to size down (or up) an image. The best size depends on its use: background, hero, banner, blog image, etc. Check the image size guidelines for your CMS, like the WordPress image size guide.

There's no specific size requirement for Google search results, but the image must be indexable and publicly accessible.

For specific elements, page types, and SEO goals:

• Google News: Include multiple high-resolution (min. 800,000 pixels) images in 16:9, 4:3, and 1:1 aspect ratios. Google News guidelines
• Google Discover: Use large images (at least 1200 px wide) with the max-image-preview directive. Google Discover guidelines
• Hero images: Minimum 1000 px wide with a 16:9 aspect ratio. Use an aspect ratio calculator to check dimensions.

Use PageSpeed Insights to test image load speed along with other detailed reporting on image/page optimization and performance.

Cheatsheet: Best Image Sizes for SEO in Pixels (and Aspect Ratio)

Open Graph Protocol

• 1600 x 900 (16:9)
• 1200 x 675 (16:9)
• 1200 x 1200 (1:1)
• 1200 x 900 (4:3)

Google Discover

• 1200 x 675 (16:9)
• 1200 x 900 (4:3)
• 1200 x 1200 (1:1)

Google News

• 1200 x 675 (16:9)
• 1200 x 900 (4:3)
• 1200 x 1200 (1:1)

Blog or Article Hero Images

• 1600 x 900 (16:9)
• 1200 x 675 (16:9)
• 1200 x 1200 (1:1)
• 1200 x 900 (4:3)

Infographic Image Sizing

• 600 x 2400 (1:4)

Google Business Profile Image Sizes

• Google Business posts: 1200 x 900 (4:3)
• Google Business logo: 720 x 720 (1:1)
• Other Google Business photos: 1200 x 900 (4:3), 1200 x 1200 (1:1), 1200 x 675 (16:9)

Product Images on eCommerce Websites

• At least 1500 x 1500 (1:1) with the product occupying 75%-90% of the frame

Product Images for Google Merchant Center (Google Shopping)

• At least 1500 x 1500 (1:1)

4. Optimizing Image Filenames for SEO

Optimize image filenames before uploading. Once Google crawls your images, it won't re-crawl them for a while, so there's no point in changing existing filenames. Follow these best practices:

• Include a target keyword in the filename to improve search engine visibility, but avoid keyword stuffing.
• Keep filenames short with keywords at the beginning to make them easily identifiable.
• Use descriptive and relevant words to help with search engine indexing.
• Make every word count: don't include stop words ("a", "the", "and", "in").
• Use lowercase letters to maintain consistency and avoid errors.
• Use dashes instead of spaces or underscores to separate words for better readability.
• Translate filenames if publishing in multiple languages to reach a broader audience.

Example: karrie-lane-headshot.jpg

5. Alternative (Alt) Text for Images

Alt text serves multiple purposes:

• Describes the image for search engines, aiding in image indexing.
• Appears if the image fails to load, providing context to users.
• Read aloud by screen readers, making content accessible to visually impaired users.

Alt text helps search engines understand the image content. Provide an accurate image description, but keep it short and to the point. Google considers alt text the most important image attribute.

Best practices:

• Be descriptive and relevant to help search engines and users (e.g., Karrie Lane's 2024 professional headshot)
• Avoid "picture of" or "photo of" as they add unnecessary words.
• Use keywords naturally to enhance SEO without keyword stuffing.
• Keep it concise to ensure clarity and relevance.
• Use specific language (e.g., "Honda Civic" instead of "car") to provide detailed information.
• For icons, convey what the icon symbolizes (e.g., "Visit LinkedIn page") to provide clear guidance.
• Include context based on the page topic to improve user experience.

Providing context means making sure the alt text is relevant to the page content in addition to describing the image. For example in a blog post about strength training for beginners, instead of “person lifting weights” you could write something like “woman demonstrating beginner-friendly strength training exercise in a weight room”.

6. The Problem with Using Text in Images

Avoid using text in images. It doesn't meet accessibility guidelines as screen readers can't read it. If you must use text in images, repeat the text verbatim in the alt tag to ensure accessibility.

Google can now extract text from images using Google Cloud Vision API or Google Keep, but this technology is not perfect. Relying on it can lead to misinterpretation or missed information.

If you must include text on a featured image, make sure it won’t get cut off if dimensions change (Instagram and Google SERP rich results display square versions).

7. Do Image Captions Help SEO?

Image captions provide more context for images on a page. They don't directly affect SEO but improve UX and engagement. Captions help visitors understand images and keep them engaged, which can indirectly improve SEO by reducing bounce rates and increasing time on site.

Best practices:

• Add captions if necessary or helpful to provide additional context.
• Avoid repeating alt tag text in captions to keep content unique.
• Capitalize the first word and proper nouns for readability.
• No need for complete sentences or periods in image captions - keep them concise and clear.

8. Image Title Tags: Not the Same as Alt Tags

Title tags appear when you hover over an image or link. They are not required, don't affect search rankings, and are not seen by mobile users.

If you use title attributes, make sure the text is supplemental since most visitors won't see it, and it's inaccessible to mobile users and screen readers.

9. Lazy-Loading Images

For images that aren’t immediately visible when a person visits your page, you can use the <code>loading=lazy</code> HTML attribute on those images to boost page performance.

But you need to make sure lazy loading is implemented correctly or it can backfire and hide image content from Google. Use this Google Search documentation on lazy-loading to get it right.

10. Image UX & SEO

If you can leverage image uniqueness and relevance to improve click-through and engagement, it’s good for SEO because things like higher CTR and longer dwell time signal to search engines that your content is relevant to searchers.

• Pay special attention to featured images.
• Align the content of your images with searchers’ intent and needs (e.g., infographic or detail view).
• Come up with creative ways to make your image stand out from what’s currently ranking.

Consider how images can attract and engage your audience in addition to the search engine optimization tips above.

Image optimization best practices do change over time as technology and techniques evolve, but the core principles are always speed, quality and SEO.

<div class="post-note-cute"> If you have questions about making your images SEO-friendly or making your content more discoverable in Search, we can help. Reach out to Momentic by phone, email or web form and you’ll hear back directly from an SEO expert to talk about your goals in a complimentary strategy session. Most people say it’s the best 30-minute meeting of their day!</div>