Search Engine Optimization

This tutorial introduces developers to Search Engine Optimization (SEO) concepts for clients using the Conversations API which can improve your rankings in search engines.

Introduction

Search rankings matter. When searching, people click the resources nearer the top of search results. It is therefore beneficial to have your webpages rank near the top of search results. SEO is making sure your web pages have the
ingredients that search engines look for when determining search results rankings. SEO can have a strong influence on the success of users' search results.

The SEO techniques in this tutorial will improve your search rankings. One such technique is to identify products, ratings and reviews and also provide consumer generated content (reviews, questions, etc.). Consumer generated
content is a source of new relevant content which search engines value. Identifying products, ratings and reviews also assist search engines in categorizing data.

The techniques described in this tutorial affects only organic search results.

📘

Although Bazaarvoice offers SEO SDKs, they are intended to work exclusively in conjunction with our Hosted UI solution. Developers creating Conversations API based displays should use the techniques described below.

Schematic vocabulary

Schematic vocabulary is a kind of structured metadata that helps search engines return relevant results. Bazaarvoice suggests using Schema.org markup due to its broad acceptance.

Reviews, ratings, aggregate ratings and products should be tagged on web pages. Schema.org documents three different formats that can be used to markup data:

  • Microdata
  • RDFa
  • JSON-LD

and are used in the samples below.

Products

Schema.org considers tangible and intangible goods and services to be products. For example, a pair of shoes, a concert ticket, the rental of a car, a haircut, or an episode of a TV show streamed online.

  • Microdata
  • RDFa
  • JSON-LD

This format uses the itemprop, itemscope, and itemtype attributes.

<div itemscope="" itemtype="http://schema.org/Product">
    <span itemprop="name">Acme product name</span>
    <img itemprop="image" src="example.com/acme_product_name.jpg" alt="Acme product name">
    <!--Aggregate rating start-->
    <div itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating">
        Rated <span itemprop="ratingValue">3.5</span>/5
        based on <span itemprop="reviewCount">11</span> customer reviews
    </div>
    <!--Aggregate rating end-->
    <div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
        <span itemprop="priceCurrency" content="USD">$</span>
        <span itemprop="price" content="1000.00">1,000.00</span>
        <link itemprop="availability" href="http://schema.org/InStock">
        In stock
    </div>
    Product description:
    <span itemprop="description">Product description with some meaningful text about the item. </span> Customer reviews:
    <!--Review #one start-->
    <div itemprop="review" itemscope="" itemtype="http://schema.org/Review">
        <span itemprop="name">Best generic product review name</span> -
        by <span itemprop="author">Tommy</span>,
        <meta itemprop="datePublished" content="2011-04-01">April 1, 2017
        <div itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
            <meta itemprop="worstRating" content="1">
            <span itemprop="ratingValue">4</span>/
            <span itemprop="bestRating">5</span>stars
        </div>
        <span itemprop="description">This is the generic review of the product</span>
    </div>
    <!--Review #one end-->
 
    <!--Review #two start-->
    <div itemprop="review" itemscope="" itemtype="http://schema.org/Review">
        <span itemprop="name">Value purchase</span> - by
        <span itemprop="author">Lucas</span>,
        <meta itemprop="datePublished" content="2011-03-25">March 25, 2017
        <div itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
            <meta itemprop="worstRating" content="1">
            <span itemprop="ratingValue">4</span>/
            <span itemprop="bestRating">5</span>stars
        </div>
        <span itemprop="description">Great product for the price. It is small and fits in my house.</span>
    </div>
    <!--Review #two end-->
    ...
</div>

This format uses property and typeof attributes

<div vocab="http://schema.org/" typeof="Product">
    <span property="name">Acme product name</span>
    <img property="image" src="example.com/acme_product_name.jpg" alt="Acme product name">
    <div property="aggregateRating" typeof="AggregateRating">Rated
        <span property="ratingValue">3.5</span>/5 based on
        <span property="reviewCount">11</span> customer reviews
    </div>
    <div property="offers" typeof="Offer">
        <span property="priceCurrency" content="USD">$</span>
        <span property="price" content="1000.00">1,000.00</span>
        <link property="availability" href="http://schema.org/InStock">In stock
    </div>
    Product description:
    <span property="description">Product description with some meaningful text about the item. </span>
    Customer reviews:
    <div property="review" typeof="Review">
        <span property="name">Best generic product review name</span> - by
        <span property="author">Tommy</span>,
        <meta property="datePublished" content="2011-04-01">April 1, 2017
        <div property="reviewRating" typeof="Rating">
            <meta property="worstRating" content="1">
            <span property="ratingValue">1</span>/
            <span property="bestRating">5</span>stars
        </div>
    <span property="description">This is the generic review description of the product</span>
    </div>
 
    <div property="review" typeof="Review">
    <span property="name">Value purchase</span> -
    by <span property="author">Lucas</span>,
    <meta property="datePublished" content="2011-03-25">March 25, 2017
    <div property="reviewRating" typeof="Rating">
      <meta property="worstRating" content="1">
      <span property="ratingValue">4</span>/
      <span property="bestRating">5</span>stars
    </div>
    <span property="description">Great product for the price. It is small and fits in my house.</span>
    </div>
    ...
    </div>

Instead of HTML attributes, this format uses JSON identify the information relevant to search engines.

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Product",
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "3",
    "reviewCount": "11"
  },
  "description": "Product description with some meaningful text about the item. ",
  "name": "Acme product name",
  "image": "example.com/acme_product_name.jpg",
  "offers": {
    "@type": "Offer",
    "availability": "http://schema.org/InStock",
    "price": "1000.00",
    "priceCurrency": "USD"
  },
  "review": [
    {
      "@type": "Review",
      "author": "Tommy",
      "datePublished": "2017-04-01",
      "description": "This is the generic review of the product",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "4",
        "worstRating": "1"
      }
    },
    {
      "@type": "Review",
      "author": "Lucas",
      "datePublished": "2017-03-25",
      "description": "Great product for the price. It is small and fits in my house.",
      "name": "Value purchase",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "4",
        "worstRating": "1"
      }
    }
  ]
}
</script>

There are more possible attributes for product through schema.org. Read more about http://schema.org/Product markup.

Ratings

Schema.org defines a rate as an “evaluation" a rating evaluation on a numeric scale, such as 1 to 5 stars.

  • Microdata
  • RDFa
  • JSON-LD

This format uses the itemprop, itemscope, and itemtype attributes.

<div itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
    <meta itemprop="worstRating" content="1">
    <span itemprop="ratingValue">4</span>/
    <span itemprop="bestRating">5</span>stars
</div>

This format uses property and typeof attributes

....
<div property="review" typeof="Review">
    <span property="name">Review Title here</span> -
    by <span property="author">Author_Name</span>,
    <meta property="datePublished" content="2017-04-01">April 1, 2017
    <div property="reviewRating" typeof="Rating">
        <meta property="worstRating" content="1">
        <span property="ratingValue">1</span>/
        <span property="bestRating">5</span>stars
    </div>
    ...
</div>

Instead of HTML attributes, this format uses JSON identify the information relevant to search engines. This code sample displays 2 ratings

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  ...
  "review": [
    {
      "@type": "Review",
      "author": "Author_1",
      "datePublished": "2017-09-20",
      "description": "Some review text. More review text",
      "name": "Some review title!!",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "4",
        "worstRating": "1"
      }
    },
    {
      "@type": "Review",
      "author": "Author_2",
      "datePublished": "2017-10-02",
      "description": "The second review text block",
      "name": "Another review title",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "2",
        "worstRating": "1"
      }
    }
  ]
}
</script>

Read more about the ratings schema http://schema.org/Rating.