Updated for 2022: Astute searchers have increasingly noted Google SERPs adding images next to regular organic listings, especially in mobile search. Here are two examples:
You should get an image next to your mobile Google results, too!
Business image thumbnails like these are one example of what Google calls SERP enhancements. It’s important to remember that Google will do what they want to do. Nothing will guarantee an image with your listing, but you can do a few things to nudge Google toward that goal.
1. Check your Google My Business listing
Add several good images to your GMB listing, and don’t forget to add a profile photo and logo. Google sometimes uses data and assets from biz listings to enhance other, related listings. Give them something good to work with.
2. Use link tags and Open Graph meta tags to suggest a thumbnail image
Meta tags let you share information about your page with other sites. Link tags allow you to define interrelationships between assets. Various social networks use this markup to auto-set images when you share a URL, and maybe Google will use it as a signal for what image to slot next to your organic SERP listing. You can do it with either or both of these snippets:
<link rel=”image_src” href=”https://www.foo.bar/imgs/foobar.png
<meta property=”og:image” content=”https://www.foo.bar/imgs/foobar.png ” />
3. Google Custom Search markup
Google Custom Search allows you to adapt and configure Google for searching your own site, and the image thumbnail syntax for it is concise. Does Google use it or ignore it for regular SERPs? We don’t know. But it’s easy, so it’s another option. There are two different markup options:
<meta name=”thumbnail” content=”http://example/foo.jpg ” />
Or put a PageMap DataObject in the area. …Don’t know what the latter is? Just do the meta tag!
4. Use structured data to get an image next to your listing
This section should have been the lead, but it’s denser, and I didn’t want to scare you off. Structured data, specifically, using bits of microdata or tags defined by schema.org, is arguably the best way to help Google understand your intentions. So why not tell them about image-enhanced SERP options with it? I’m not going to go into excruciating detail about syntax and best practices here. It’s easy to find plenty of resources about microdata best practices and schema implementation if you use a little Google-fu.
I will highlight these points:
- Google likes it in JSON-LD, but Microdata or RDFa will work for big-G, in a pinch.
- Definitely use markup for relevant data types available to an “organization” and a “local business”, including but not limited to “image”.
- If you have products, specify product images and other product meta data in the code for those pages.
- Remember to add markup for your logo in addition to your other images.
- And when in doubt, always defer to Google’s structured data guidelines.
5. General image best practices on your site
Use good alt attributes.
Name images sensibly. (img1.jpg = nonsense. [something-descriptive].jpg = sensible)
Size images appropriately. Don’t upload huge images (dimensions or file size) unless you have a good reason. Definitely take dimensions into consideration when you’re specifying a potential SERP thumbnail enhancement. E.g. don’t make them smaller than 160p x 90p or larger than 1920×1080. Oh, and don’t use images with weird (long or tall) aspect ratios. Stick close to square, or typical TV/film aspect ratios of the past and present, at least when you’re thinking about SERP thumbnails.
Here’s an annoying but important note: For best results, use a square image on every page. Google seems to like to grab square images to put next to your organic search engine results. …Which is annoying.
Make Google’s indexing job easier, and they’ll (likely) make your SEO life easier, eventually.
Recent data suggest context matters. If somebody searches for a phrase related to the terminology you use near an image, Google is more likely to enhance your SERP listing with that image for that query, but maybe not for other queries.
Three end notes:
- 2022 update below
- Anybody telling you to use rel=author to accomplish this sort of image-enhanced SERP listing hasn’t figured out that it’s deprecated. Just ask Google.
- None of the above methods are guaranteed to work, but they’re about as good as it gets. If Google doesn’t love your site for some reason, you might not get an image next to your listings. Oh, and if you do get your image next to some SERP listings but not others, don’t be surprised; that’s exactly what will happen, if you’re lucky.
Updated for 2022
While this article’s respectable Google ranks for relevant searches might imply some level of prowess, I, your alleged resident expert shake my head at Google’s inconsistency more often than I pat myself on the back for successfully getting that coveted local mobile image thumbnail in the non-image mobile SERP listing.
Digging deeper on local mobile image thumbnails…
I looked at four sites Google deems worthy of having said little square image next to their search listing, and I measured the following:
- Is thumbnail image mentioned in schema markup on the homepage? NO. Universally no markup.
- Is the image square-ish? No. The squarest was 89% square. One was only 50% square. Two were 63% square, for an average image square-iness of only 66.25% square. Of note, Google arbitrarily cropped the images to square and always used white as background for transparent images, which caused some white text to become invisible in the thumbnail.
- Any dimension consistency? No. The smallest was 15 pixels tall. The largest, 644 pixels.
- Orientation preference? No. Some wider than tall, some taller than wide.
- Is the image on Google Business Profile (formerly Google My Business)? NO (2/4) Yes (2/4)
- Certain file types preferred? No. Two .png. One .jpg. One .svg.
- Img name clues? No. Though each contains at least one of: ‘header’/’logo’/’hero’
- Alt text: YES. All used alt text markup. Two used banal branding. One described the image’s use in the layout: “Home Mobile Header Image” And one actually described the image: “mascot holding plunger”
- “Special” markup? Nothing consistent. One site preloaded the img. Another lazy-loaded it down in the footer. One site didn’t even display the image anywhere on the mobile or desktop rendered page, curiously loaded in an a href tag in the header (not the head) linking to “/” and CSS set to display: none !important.
In short, while the best practices presented here are sound, no one would blame you for calling some of it inconclusive conjecture. I blame Google. These recent results have left me with even less respect for Google. Please, if you can provide additional insights, let me know in the comments. Some of the sites I work on get these images next to their mobile organic search listings after I poke around, but some don’t. Doesn’t hurt to try, but temper your expectations. Context matters.
Dan Dreifort consults on SEO and enjoys running multivariate UX tests for his clients. He also helps businesses optimize certain aspects of HR (hiring/firing/training/software UX/etc.) Please peruse his contributions to improv noise collective synthband.com.