Implementing Markup For Paginated And Sequenced Content

Late last week I bumped into David Flink, one of our Lead Program Managers here at Bing and after a brief chat, he agreed to write this week’s blog post detailing a view on implementing paganation solutions.  He’s even agreed to field questions, so feel free to post up with questions related to this blog post and David can chime in with answers.

Traditionally, Bing has relied on a set of heuristics to determine if and how individual pages on a site are related to each other. Now, through the use of the optional rel=”next” and rel=”prev” link elements, you can provide Bing with a strong indication of the structure and scope of the sequenced content on your site. For example, think about content spanning multiple pages, such as forum threads, or time-sequenced content such as news articles and blog posts.
 
Using the rel=”next” and rel=”prev” link elements, you have full control over the sequencing of your pages. Let’s examine the following example:
 
 
The use of rel=”next” and rel=”prev” link elements for an oldest-to-newest sequence
 
In this example, the webmaster has determined that his user prefer to read news articles from oldest to newest. The webmaster has reflected this order in the implementation of the rel=”next” and rel=”prev” link elements, with the rel=”next” link elements pointing to a newer article on the site. Note that although it is perfectly acceptable to maintain multiple sequences on your site – for example, one sequence for news, one for politics, and one for finance – we encourage you to avoid adding more than one rel=”next” and more than one rel=”prev” link element to your pages.
 
Now let’s review this alternative implementation of the rel=”next” and rel=”prev” link elements for blogs:
 
 
The use of rel=”next” and rel=”prev” link elements for a newest-to-oldest sequence
 
The universally preferred order for blog posts is newest to oldest. In the example above, this order has been reflected in the implementation of the rel=”next” and rel=”prev” link elements, with the rel=”next” link elements pointing to older blog posts on the site. As in the previous example, the first page in the sequence features just the rel=”next” link element, while the last page in the sequence features just the rel=”prev” link element. Avoid looping the sequence back to an index page on the last natural page of the sequence (using, for example, <link rel=”next” href=”index.aspx”>), as this obscures the sequence.
 
Multi-Page Content

Once you have settled on one or more sequences, it’s important to keep multi-page content in mind. A user reading page 1 of a multi-page article will expect the next item in the sequence to be page 2, not a newer article. Review this example:
 
 
The use of rel=”next” and rel=”prev” link elements for an oldest-to-newest sequence with multi-page content
 
We strongly encourage you to prioritize sequencing for multi-paged content over all other sequences to ensure a predictable user experience.
 
Eager To Get Started?

Implementing the rel=”next” and rel=”prev” link elements is a relatively straight-forward process. These pointers will help you successfully complete the implementation:

  • Link elements should be added within the <head> section of your pages. Alternative implementations, such as the addition of rel attributes to anchor elements in the body of your pages, are currently not supported.
  • Using the rel=”next” and rel=”prev” link elements, you establish a relationship between at most 3 pages on your site: the current page, the page immediately preceding the current page (rel=”prev”) and the page immediately following the current page (rel=”next”). Note that the first page in the sequence should just contain the rel=”next” link element, while the last page in the sequence should contain just the rel=”prev” link element.
  • Avoid adding more than one rel=”next” and more than one rel=”prev” link element to your pages.
    URL parameters, such as the ones includes in the example above, should be reflected in the HREF attributes of your link elements. URL parameters appended solely for tracking purposes, such as search queries and session identifiers, can also be appended. To avoid having these URL parameter surface in search results for your pages, you can use the rel=”canonical” link element to specify a preferred URL for the content displayed. For example, the page http://www.contoso.com/Products.aspx?Page=3&Query=Bikes may contain the following link elements:
    • A pointer to the preferred URL for the page content (without the URL parameter used for tracking): <link rel=”canonical” href=”http://www.contoso.com/Products.aspx?Page=3” />
    • A pointer to the next page: <link rel=”next” href=”http://www.contoso.com/Products.aspx?Page=4&Query=Bikes” />
    • A pointer to the previous page: <link rel=”prev” href=”http://www.contoso.com/Products.aspx?Page=2&Query=Bikes” />
  • You are free to exclude certain pages within the sequence (after applying the rel=”next” and rel=”prev” link elements) from indexing using the following meta element:
    • <meta name=”robots” content=”noindex, follow”>

Implementing these rel=”next” and rel=”prev” link elements doesn’t trigger a new visual treatment for your pages on our search result pages. It does, however, allow us to more comprehensively understand and index your content. If you have any questions regarding the implementation of these link elements to your site, please feel free to add them the comments section below.