SEO - What are Rich Search Results?


Help Search Engines Understand Your Website

Rich search results are features of search engines that provide the searcher with extra pieces of information about a website. These features could look like recipe cards, user reviews or step by step guides that appear within the list of other search results.

This blog post has structured data for an "article". The rich search result for articles will show up as cards with pictures and headlines.

These features are meant to show up at the top of a search, or even in the Google assistant. Because of this, the linked web pages need to engage the user at face value, and once clicked, be quick to load. To optimize for speed, these examples are going to leverage the AMP architecture. More info on adding AMP pages to your website here.

How do you create rich search for your article?

Start by gathering the information about your article. You will need to provide data for the following properties:

Then we will write the JSON-LD script anywhere in our HTML file.

<script type="application/ld+json">

Now we can start to fill in the data structure with your article data. Set the @context to "https://schema.org". The @type to "NewsArticle". And mark the @mainEntityOfPage with your web page url.

{
 "@context": "https://schema.org",
 "@type": "NewsArticle",
 "mainEntityOfPage": {
 "@type": "WebPage",
 "@id": "https://YOUR-WEBSITE.com/ARTICLE-URL-HERE"
},

Then we can define the article headline, datePublished, author, publisher and a main image to be displayed with the headline.

"headline": "ARTICLE HEADLINE",
"image":"https://YOUR-WEBSITE.com/IMAGE-URL-HERE",
"datePublished": "2020-12-31T23:59:59-07:00",
"dateModified": "2020-12-31T23:59:59-07:00",
"author": {
 "@type": "Person",
 "name": "YOUR NAME HERE"
},
"publisher": {
 "@type": "Organization",
 "name": "YOUR COMPANY HERE",
 "logo": {
  "@type": "ImageObject",
  "url": "https://YOUR-WEBSITE.com/LOGO-IMAGE-URL-HERE"
 }
}</script>

With all the code ready, you can vailidate it with Google's Rich Results Test.

More examples

This page is made with structured data for an article as well. Take a look at the code on GitHub, and feel free to use it as a starting point or template.




Also the blog post " How to Create an AMP Website" is using structured data of both an Article as well as a How-To Guide. That page is also up on GitHub to take a peak at the code.




Implementing Other Types of Structured Data

There are many types of structured data that Google will use to enhance search and other Google products, like assistant. Google provides some examples to set them up here.

Here is a list of the types of structured data you can implement right now. Surely more will be added over time:


Get coding!

Thanks for reading. I hope your AMP sites turn out great. Let me know if you have any questions.