Rich Cards, the new mobile search result format for Recipes and Movies, has now been extended to cover Local restaurants and Online courses.
Rich Cards, the new search result format for Recipes and Movies, has now been extended to cover Local restaurants and Online courses. We take a detailed look at Rich Cards and how they may help promote your business on mobiles.
Rich cards build on the success of rich snippets, which already use the schema.org markup to display content in a more helpful, engaging format on mobile devices. The most common example of rich snippets in action are the review ratings you see in the search results.
Rich cards are more visually orientated, and can provide much more information for certain content types in the limited space available on mobiles. As such, if your content consists of recipes, movies, restaurants or online courses then you can use rich cards to gain significantly visibility in the search results, and really stand out among your competitors.
An example of the differences between standard results, rich snippets and rich cards can be seen below:
Rich card results are presented in carousels that are easy to browse by scrolling left and right. Carousels can contain cards all from the same website or from multiple websites. Source: Googleblog
Initially, Google announced back in May 2016 that rich cards were only available for two content types; recipes and movies. Google has recently further expanded this to local restaurants and online courses.
An screenshot of the new local restaurant rich cards in action can be seen below:
Use Google’s Developer website& Search Console to help
Google has updated their developer website with code examples and a new gallery complete with screenshots to help guide your implementation.
Google makes the following recommendations when implementing rich cards on your website:
- Use JSON-LD implementation
- Check Google’s “Mark Up Your Content Items” guide to determine which are the required fields, and also find additional fields that may enhance your listing.
- See a preview of your markup in the Structured Data Testing Tool of how the rich card might appear in Search,
- Use the Structured Data Testing Tool to see errors as you tweak your markup in real time.
We cannot stress enough how great the Structured Data Testing Tool is. One of the simplest ways is just to view the source of your webpage, cut and paste it into the tool, and then adjust or add code until you get the required result. It can be used for all structured data, and can make it easy to try out new structured data ideas, which quite often are extremely easy to quick to implement.
Use the Structured Data Testing Tool to see errors as you tweak your markup in real time. Source: Googleblog
Keep track of coverage and debug errors in the Search Console. The new Search Console Rich Cards Report will indicated the following:
- Card Type — This will show what Rich Card content type the feedback relates to.
- Invalid Cards — These have incorrect implementation and will not be visible in the SERPs.
- Enhanceable Cards — These have correct implementation, but could be enhanced by adding additional markup and data.
- Fully Enhanced Cards — These have full implementation, and not other markup or enhancements are available.
Google recommends ensuring that you have submitted a sitemap to ensure Google can discover all of your marked-up content.
Google’s Rich Cards report. Source: Googleblog
Finally, the last step is to monitor your performance by using the “Rich Results” filter in the Search Console. You are able to see clicks and impressions for both Rich Cards and Rich Snippets, as shown in the screenshot below:
You can see Clicks or Impressions for Rich Results by using the Search Appearance filter. Source: Screenshot.
Google now recommends AMP implementation when using Rich Cards
In their latest post introducing the local restaurant and online courses rich cards, Google now recommends using AMP HTML when implementing the new search feature.
Their reason being, is that users consuming AMP’d content will be able to swipe almost instantly between restaurants or recipes from within your website due to the fast optimized nature of AMP pages. You can see an example of this below:
The AMP Testing Tool should help implement this within AMP pages.
It should be stressed though, that AMP is currently not a requirement for Rich Cards implementation.