Yoast

Product page SEO

Besides optimizing your product pages for user experience, you want to make sure these pages are as good as possible for SEO as well. Obviously, you might think. In this post, I’ll show you two not so obvious (at least for most website owners) elements of product page SEO and tell you why it’s so important to take these things into account.

Basics of product page SEO


A product page is a page as well, so all the SEO things that matter for your content page, go for product pages as well:

I could go even more into detail when discussing product page SEO, but for now, this will be your basic optimization. If you offer less than exciting products on your site, you may also want to read my post on SEO for boring products.

The remainder of this post will be about some more technical product page SEO. I’ll show and explain a bit about schema.org data and Open Graph data for your product page.

Schema.org/Product

I’ll jump right in by showing you this example from our valued customer Arnoldservice.com:

Click to enlarge.

What are we seeing here? I highlighted two parts. These two parts show schema.org structured data declarations for product elements. The importance of this for your product page SEO is that the major search engines came up with this markup, not the W3C consortium. Google, Bing, Yahoo and Yandex agreed upon this markup, so they could identify product pages and all the product elements/characteristics more easily. Why would they want that? So they could a) index these pages a lot better and b) show you rich snippets like this:

Schema.org markup consists roughly of two main items:

  1. The itemscope (the type of schema declaration)
  2. The itemprop(s) (the elements within that specific schema)

For Arnold’s Services, there are two itemscopes in this example, being Product and Offer:

I have to say that there are a lot of options that I haven’t seen used in a website, to be honest. There’s a lot that can be declared, but it’s usually just the basics that are included in the templates of webshops.

As you might have noticed, Google actually picked up on the Schema items:

That is why you want to add Schema.org data for Product Page SEO: easier to recognize for Google, and it makes sure to include important extra’s in Google already. This is actually also expectation management. Your visitor knows your price up front and knows that the product is in stock. How’s that for user experience!

Open Graph Product tags & Twitter’s Summary Card

Open Graph tags and Twitter Cards are actually pretty similar to schema.org markup. It divides the product page into easy-to-digest chunks, but this time these chunks are not for Google, but for social websites like Facebook, Instagram, and Pinterest.

You can highlight things like product images, and prices and availability. For WordPress websites, we have developed a plugin, Yoast WooCommerce SEO, that will make this a breeze.

In the next example, you’ll find og:type and twitter:card. These are similar to the itemscope in schema.org. These items tell the social media platform that the page is about a product. Click the image below to enlarge it.

In the screenshot above – which is actually the same product page as the examples used at schema.org – I’ve highlighted the elements that matter for product page SEO that aren’t included in other pages. og:title / twitter:title is the product name, og:description / twitter:description is the product description. These elements have the same function in content pages. It will show the title and description as used in for instance Facebook posts.
I’ve also highlighted the label1/label2/data1 and data2 elements. These used to be part of the deprecated Twitter Product cards. The Twitter Card validator ignores these. The card type you want to use for your products is the Summary Card or the so-called Summary Card with Large Image.

Note that “adding Open Graph tags to your website won’t directly affect your on-page SEO, but it will influence the performance of your links on social media, so that means it’s worth looking into.” The same goes for Twitter Cards.

The extras that are added for making your social sharing a whole lot more attractive and professional, will improve the CTR to your product page. Which helps your product page SEO. Social media is like a conventional marketplace. If people are talking about your products, your products must be worth it. Adding Open Graph tags and Twitter Card data is like providing all the people that share your product with a nicely designed product brochure.

In our plugin, you can set a separate image for this. That is actually pretty important, as Facebook won’t add the image if it isn’t of high quality / large dimensions. Here’s a short overview of the preferred dimensions:

Source: Bufferapp.com

TL;DR

If you’re serious about optimizing our product page SEO, you shouldn’t focus on the regular optimization alone. You’ll have to dig a little deeper into the technical aspects of your product page:

  1. Add schema.org Product tags so Google can easily index all the details about your product and show these in search result pages already.
  2. Add Open Graph tags (for Facebook and Pinterest) and Twitter Card meta data (for Twitter) so social networks will show nice, informative snippets for your products.

Be sure to add all of the above.

Read more: Structured data with Schema.org: the ultimate guide »