Online Presence Coach

Schema.org Image Gallery

The Schema.org markup is a recommendation by the major search engines to help publishers inform them of the web content. Their web crawlers when they find the markup can use it to better categorize the topic and meaning of the elements of the website.

Schema.org covers many topics including things like recipes, organizations, places and image galleries. The following is an example of you can take your image gallery and embed the schema.org markup to clearly indicate to the search engines that these pictures make up a image gallery.

HTML for an image gallery

<div>
<ul>
<li><img src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/Plumbing-Repair.jpg" /></li>
<li><img src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/plumbing_pipes.jpg" /></li>
<li><img src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/home-plumbing-system.gif" /></li>
<li><img src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/basement_bathroom_plumbing-e1390419097846.jpg" /></li>
<li><img src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/home-plumbing-diagrams-300x183.jpg" /></li>
</ul>
</div>

Image gallery with Schema.org Markup

This is the minimum you need to declare the Image Gallery. You may want to add in properties like the imagegallery description and images’ name. Below you will see how you can relate the concepts.

<div itemscope itemtype="http://schema.org/ImageGallery">
<ul>
<li itemprop="associatedMedia" itemscope itemtype="MediaObject"><img itemprop="http://schema.org/image" src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/Plumbing-Repair.jpg" /></li>
<li itemprop="associatedMedia" itemscope itemtype="MediaObject"><img itemprop="http://schema.org/image" src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/plumbing_pipes.jpg" /></li>
<li itemprop="associatedMedia" itemscope itemtype="MediaObject"><img itemprop="http://schema.org/image" src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/home-plumbing-system.gif" /></li>
<li itemprop="associatedMedia" itemscope itemtype="MediaObject"><img itemprop="http://schema.org/image" src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/basement_bathroom_plumbing-e1390419097846.jpg" /></li>
<li itemprop="associatedMedia" itemscope itemtype="MediaObject"><img itemprop="http://schema.org/image" src="https://s3.amazonaws.com/hunchbucket/wp-content/uploads/2014/01/home-plumbing-diagrams-300x183.jpg" /></li>
</ul>
</div>

Rich Snippets Test

Here is what Google sees when crawling: