This page shows how you can customize the result snippets for your own website. To render your customized snippets, you must add structured data to your webpages and create a presentation layer to transform the XML feeds of the search results. The feeds are available only to Google Site Search customers and Custom Search partners. If you do not have a Site Search account, upgrade your Custom Search account by signing in to your Custom Search control panel, selecting the Business account tab, and clicking the Convert to Google Site Search button. Any level of service gives you access to the XML feeds.
This page includes the following sections:
Custom Search helps users find the right page by showing them a snippet—a small sample of content that gives search users an idea of what's in the webpage. To learn more about snippets, see the Webmaster Central blog post on the anatomy of a search result. If you do not like the standard snippets created by the Custom Search algorithm, you can create your own snippets. You can showcase key information—such as image thumbnails, summaries, dates, authorship, ratings, and prices—directly in your snippets. Having the most relevant information in your search results makes the webpages in your site more compelling to your users.
The following figures demonstrate various ways you can customize the snippets in your search results.
Figure 1: Result snippet with rating, prince range, and review.
Figure 2: Result snippet with formatting, links, image, and comparative information.
Figure 3: Result snippet that includes document types, authors, page views, and comments.
Figure 4: Richly formatted result snippet that provides multimedia access and buttons ("ADD TO CART").
Essentially, creating rich snippets involves the following steps:
When Custom Search is indexing your webpages, it recognizes and preserves the metadata.
The server returns an XML file with the search results, along with the structured data.
A presentation layer is a set of code (such as JavaScript, PHP, JSP and ASP) that transforms the raw data into a format that is displayed to the user. In the case of Custom Search, you transform XML data into an HTML file that is presented to the end user.
When you are reading a webpage that sells a DVD, you can quickly figure out what the title is, what reviewers thought of the film, and how they rated it. But a computer cannot do the same things, because it doesn't understand how the information is structured. For example, if the page has content about the DVD—along with recommendations for other items, ads from other stores, and comments from customers—then the page might have different prices for various things, not just for the DVD that is being sold. You can easily figure out the price for the DVD while dismissing the other prices, but the computer can't. Some sophisticated programs might find the prices in the webpage, but they cannot determine the rules for finding just the price of the DVD.
Structured data formats are rules that standardize the structure and content of the webpage. They are markup that you apply to text snippets so that computers can process their meaning or semantics. The markup does not change the formatting of your website, it just makes the metadata and text enclosed within the XHTML tags more meaningful to computers.
Custom Search recognizes the following formats: microformats, RDFa, and PageMaps. You can use one or a combination of formats that you prefer. Google Search also recognizes microformats and RDFa, but not PageMaps. Also, Google Search has its own algorithm and policies for determining what information gets shown to users. So while structured data could always be presented on Custom Search, that is not the case with Google Search.
The following includes a snippet of plain HTML:
|
<div>
<span>4.5 out of 5 stars</span>
<span><strong>Movie:</strong>Tokyo Godfathers</span>
</div>
<div class="synopsis">
Three homeless people (a transvestite, an alcoholic, and a runaway) looks for the real mother of an abandoned baby.
</div>
The following snippet shows the previous HTML code extended with a format called RDFa:
<div>
<span><span property="v:rating">4.5 out of 5 stars</span>
<span><strong>Movie:</strong>Tokyo Godfathers</span>
</div>
<div class="synopsis" property="v:description">Three homeless people (a transvestite, an alcoholic, and a runaway) looks for the real mother of an abandoned baby.
</div>
By incorporating standard structured data formats into your webpages, you not only make the data available to Custom Search, but also for any service or tool that supports the same standard. Apply structured data to the most important information in the webpage, so you can present them directly in the results. For example, if you have a website selling Android devices, include structured data about the ratings, prices, availability, and whatnot. When your users search for the Android devices, they can see the ratings, prices, and availability at a glance.
So computers can now understand the types of data in the webpage. Now what? Computers can also start doing the menial task of finding and combining information in different webpages. This frees users from totally boring tasks, such as sifting through multiple pages to find items that they want. Search engines, such as Custom Search, can process the structured data in your webpages and display it in useful, more meaningful ways.
Microformats is a specification for representing commonly published items such as reviews, people, products, and businesses. Generally, microformats consist of <span> and <div> elements and a class property, along with a brief and descriptive property name (such as dtreviewed or rating, which represent the date an item was reviewed and its rating, respectively).
The following includes a snippet of plain HTML code.
<p><strong>Kevin Grendelzilla</strong></p> <p>Technical writer at Google</p> <p>555 Search Parkway</p> <p>Googlelandia, CA 94043</p>
The following snippet shows the previous HTML code extended with microformats:
<div class="vcard">
<p><strong class="fn">Kevin Grendelzilla</strong></p>
<p><span class="title">Technical writer</span> at <span class="org">Google</span></p>
<p><span class="adr">
<span class="street-address">555 Search Parkway</span>
<span class="locality">Googlelandia</span>, <span class="region">CA</span>
<span class="postcode">94043</span>
</span></p>
</div>
To learn more about microformats, see the Webmaster Tools article and microformats.org.
Resource Description Framework in attributes (RDFa) is another structured data format that is more flexible than microformats. Microformats specify a syntax for including structured data into HTML documents. It also has a vocabulary of specific terms for each microformat. RDFa, on the other hand, specifies only a syntax and allows you to use existing vocabularies or create your own. It even lets you combine multiple vocabularies freely. If the existing vocabularies do not meet your needs, you can define your own standards and vocabularies by creating new fields.
The following includes a snippet of plain HTML code.
<div>
<h3>5 Centimeters Per Second</h3>
<h4>Makoto Shinkai</h4>
...
</div>
The following snippet shows the previous HTML code extended with RDFa:
<div xmlns:dc="http://example.com/eg/elements/1.1/"> <h3 property="eg:title">5 Centimeters Per Second</h3> <h4 property="eg:maker">Makoto Shinkai</h4> ... </div>
To learn more about RDFa, see the Webmaster Tools article. To learn more about defining an RDF schema, see the RDF Primer.
PageMaps is a structured data format that Google created to enable website creators to embed data and notes in their webpages. Although the structured data is not visible to your users or to Google Search, Custom Search recognizes it when indexing your webpages and returns it with the XML results.
Unlike other structured data formats, PageMaps does not require you to follow standard properties or terms, or even refer to an existing vocabulary, schema, or template. You can just create custom attribute values that make sense for your website. Another difference is that you add microformat and RDFa attributes around existing content in the body of the HTML, but you create PageMaps metadata in the head section of the HTML page.
The following shows an example of PageMaps for a webpage on a badminton topic:
<html>
<head>
...
<!--
<PageMap>
<DataObject type="document">
<Attribute name="title">The Biomechanics of a Badminton Smash</Attribute>
<Attribute name="author">Avelino T. Lim</Attribute>
<Attribute name="description">The smash is the most explosive and aggressive stroke in Badminton. Elite athletes can generate shuttlecock
velocities of up to 370 km/h. To perform the stroke, one must understand the biomechanics involved, from the
body positioning to the wrist flexion. </Attribute>
<Attribute name="page_count">25</Attribute>
<Attribute name="rating">4.5</Attribute>
<Attribute name="last_update">05/05/2009</Attribute>
<Attribute name="thumbnail">http://www.example.com/papers/sic.png" width="627" height="167" />pasukan3
After you have tagged your webpages with structured data, you can use the Rich Snippets Testing Tool to view the structured data that can be extracted from the webpage. The tool provides two views: the first view shows the structured data that Google Search can extract from the page, while the second view shows what Custom Search can extract from the page. Although Custom Search can extract data in all three formats (microformats, RDFa, and PageMaps), it extracts a subset of what Google search extracts from microformats and RDFa.
If you haven't tagged any of your webpages but would like to see what extracted structured data might look like, you can enter the URL of other websites. Popular sites that have review information or list of contacts are more likely to have structured data. If you see result snippets on Google search that looks similar to Figure 1, you can conclude that the webpage has structured data.
If you have the following structured data in your webpage:
hcard
fn = Godzilla Gigantis
n
family-name = Gigantis
given-name = Godzilla
adr
locality = Tokyo
title = Senior Giant Monster
Custom Search can extract the following metadata.
person (source = MICROFORMAT) location = Tokyo
If you are a Site Search customer or a Custom Search partner, you can retrieve XML feeds of the search results. To do so, you can send a request to http://www.google.com/cse?<CSE ID> appended with the parameter: output=xml. For example:
http://www.google.com/cse?cx=999999999999999999999:srraaaaaaaa&q=einstein&output=xml
To learn more about using HTTP request methods to retrieve the XML feed, see Programmatically Creating Custom Search Engines
If you want to write client applications that dynamically create custom search engines using HTTP request methods, see Programmatically Creating Custom Search Engines.
< Back to the Developer's Guide