New Structured Data Markup Helper and Expansion of Data Highlighter

Google Data Highlighter expansion adds new eight types of structured data and launches new "Structured Data Markup Helper" tool. Quick tips to internationalize websites.

To help webmasters markup their webpages with schema, structured data, Google upgrades its "Data Highlighter" tool to seven new types of structured data--as well as launched a new "Structured Data Markup Helper" tool.

Structured Data Markup Helper tool that lets you submit a web page (either through a URL or a HTML source) and allow you to use your mouse to "tag" the key properties of the relevant data type.

submit webpase using url or HTML to Structured Data Markup Helper tool

When you're done, "the Structured Data Markup Helper generates sample HTML code with microdata markup included. This code can be downloaded and used as a guide as you "implement structured data on your website," informs Google.

The Structured Data Markup Helper supports a subset of data types, including all the types supported by Data Highlighter as well as several types used for embedding structured data in Gmail," adds Gogole.

Structured Data Markup Helper tool: generated HTML source

Data Highlighter, a point-and-click tool for teaching Google about the structured data on your website "without even having to edit your site's HTML"--now, allow you to use Data Highlighter to teach Google about other kinds of structured data on your site including "products, local businesses, articles, software applications, movies, restaurants, and TV episodes."

To get started, just visit Webmaster Tools, select your site, click the "Optimization" link in the left sidebar, and click "Data Highlighter". You'll be prompted to enter the URL of a typically structured page on your site and "tag" its key fields with your mouse.

Once the tagging process is completed, "you can verify the structured data and, if it's correct, you can "publish" it to Google. Then, as your site is recrawled over time, your site will become eligible for enhanced displays of information like prices, reviews, and ratings right in the Google search results," google added.

The tagging process normally "takes about 5 minutes for a single page, and about 15 minutes for a pattern of consistently formatted pages," google adds.

Google  an expansion of Data Highlighter to eight types of structured data:

Google has also posted video, clarifying its's stance on Advertorials and "native advertising."

Matt Cutts explained that Google treats links as editorial votes. When links are embedded into advertorials or paid stories, if they are not disclosed, that is against Google's guidelines.

Google guidelines for Advertorials incldue:

  • "Search Engines: If links are paid for, i.e., money changes hands, then links should not pass PageRank. You should nofollow links in Advertorials.
  • Users & Readers: It should be clear to your readers that this is a paid story by labeling it advertisement or sponsored story."

Update 05/31: Six tips to help webmasters handle internationalization for theri websites.

"Many websites exist in more than one language, and more and more websites are made available for more than one language. Yet, building a website for more than one language doesn't simply mean translation, or localization (L10N), and that's it. It requires a few more things, all of which are related to internationalization (I18N)," writes Gogole Webmaster team.

Make pages I18N-ready in the markup, not the style sheets, for internationalization purposes. Use @lang and @dir, at least on the html element: <html lang="ar" dir="rtl"></html>

Use one style sheet for all locales (for LTR and RTL directionality, or even each language).

Use the [dir='rtl'] attribute selector, which is supported by most modern browsers today. Here's an example:

aside {
 float: right;
 margin: 0 0 1em 1em;
}

[dir='rtl'] aside {
 float: left;
 margin: 0 1em 1em 0; 
}

Use the :lang() pseudo class ((Note "that we're talking documents here, not text snippets, as targeting snippets of a particular language makes things a little more complex," Google writes.) For example, use the following for bold formatting for Chinese documents:

:lang(zh) strong,
:lang(zh) b {
 font-weight: normal;
 color: #900;
}

Mirror left- and right-related values, for example, what's text-align: left in LTR needs to be text-align: right in RTL. "Among the properties to watch out for is everything related to borders, margins, and paddings, but also position-related properties, float, or text-align."

You can also use "flip" directionality tools such as CSSJanus, "though it has been written for the "separate style sheet" realm, not the "same style sheet" one."

Keep an eye on the following items:

  • "Images designed for left or right, like arrows or backgrounds, light sources in box-shadow and text-shadow values, and JavaScript positioning and animations: These may require being swapped and accommodated for in the opposite directionality.
  • Font sizes and fonts, especially for non-Latin alphabets: Depending on the script and font, the default font size may be too small. Consider tweaking the size and, if necessary, the font," Google said.