What is the format for nesting one microdata itemscope inside of another? - seo

I'm new to SEO and heard that using microdata tags in html can dramatically improve SEO. So, for one of my pages, the schema type is an organization... in particular a sports team. One of the properties for a sports team is the members. So, I have the following code:
<div itemscope itemtype="http://schema.org/SportsTeam">
<span itemprop="name">New York Yankees</span>
<span itemprop="members">Derek Jeter</span>
</div>
The "members" itemprop has to be a person itemscope (http://schema.org/Person). What is the format for nesting one itemscope inside of another?

From the Google article on microdata tags:
The example below shows the same HTML, but in this case, it includes the address property.
<div itemscope itemtype="http://data-vocabulary.org/Person">
My name is <span itemprop="name">Bob Smith</span>,
but people call me <span itemprop="nickname">Smithy</span>.
Here is my homepage:
www.example.com.
I live in
<span itemprop="address" itemscope
itemtype="http://data-vocabulary.org/Address">
<span itemprop="locality">Albuquerque</span>,
<span itemprop="region">NM</span>
</span>
and work as an <span itemprop="title">engineer</span>
at <span itemprop="affiliation">ACME Corp</span>.
</div>
Here's how this sample works:
The address property is itself an item, containing its own set of properties. This is indicated by putting the itemscope attribute on the item that declares the address property, and using the itemtype attribute to specify the type of item being described, like this: <span itemprop="address" itemscope itemtype="http://data-vocabulary.org/Address">.
I would add that microtags are in their infancy, so you cannot guarantee that the specification will remain intact for very long. I personally predict that the blackhat SEO guys are going to be all over this, and it'll be a headache for Google to keep up with the tricks. So, whilst they might provide you a temporary SEO boost, don't rely on them too heavily.
On a more positive note, I can certainly see these microtags being useful for non-SEO purposes, especially in the field of screen-readers. Fun stuff!

Related

Google share button not taking the right schema.org data in multiple itemscope situation

The following mark up is quite complex, I know, it derives from a typical wordpress site building structure. So I cannot change it. And I wish to reproduce it here completely (leaving out the classes etc.):
<div id="myOuterSection" itemscope itemtype="http://schema.org/CreativeWork">
<meta itemprop="name" content="A name for this section that contains several artworks" />
<meta itemprop="description" content="A brief description also." />
<meta itemprop="url" content="http://www.mywebsite.com/#where-to-scroll-to" />
<div id="myId" class="myClasses">
<div class="container">
<div class="myInnerClasses">
<div class="mySecondInnerClasses">
<div class="myThirdInnerClasses">
<div class="artwork-container" itemprop="workExample" itemscope itemtype="http://schema.org/VisualArtwork">
<meta itemprop="image" content="http://www.mywebsite.com/wp-content/uploads/2017/06/my-svg-replace-image.png" />
<meta itemprop="name" content="My desired share post title" />
<meta itemprop="description" content="The description of the shared stuff I would love to see here also." />
<meta itemprop="url" content="http://www.mywebsite.com/#where-to-scroll-to" />
<div class="svg-code-content-wrapper">
<!-- svg code -->
</div>
<div class="social-share-wrapper">
<ul class="social-share-list">
<li>
<a class="share-btn-google" href="https://plus.google.com/share?url=http%3A%2F%2Fwww.mywebsite.com%2F" target="_blank">
<i class="fa fa-google-plus"></i>
</a>
<!-- some others -->
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
To explain a little why I use meta tags here (well knowing that this technique should be used “sparingly” as I read): I have no visible texts on the artworks and the images are in svg code. However, I want them to be sharable without website context adding some explanation on the shared post. (which is, by the way, very easy to achieve with fb, pinterest, tumblr, twitter etc.)
I also tested the result of this structure in Google testing tool (https://search.google.com/structured-data/testing-tool)
It showes a perfect tree with outer and inner itemscope and all the data (names, description, image url etc.). At least it looks so for me and displays no errors or anything similar. For Google so it seems ok, also, I guess.
Yet, the Google share button which is nested perfectly inside the second (inner) scope does not reflect any of the shown data, neither images nor names or titles when the post opens in the new share tab. The weird thing is that in the beginning sometimes it worked, but later he seemed to fetch only the top first one on the page, later he skipped them all and took the site’s regular title and description with the first real image (img tag) he founds on the page.
I tried also emptying the cache, placed no-cache tags in the website header and so on.
This Google share button casuality stuff drives me nuts.
Is there someone out there with similar experiences? Or someone who scans my code and sees some obvious errors that I am not able to see? False schema.org structure or whatever?
Thanks so much in advance. Any help is much appreciated.
I can also give the real web url if someone likes to see it.

Schema.org memberOf error

This problem's driving me crazy second day in a row. So, the problem:
I'm trying to use "memberOf" property for "organization", and google structured data tool say that there is error:
Error: Page contains property "memberOf" which is not part of the schema.
At the same time schema.org says, that this is a property of "organization":
http://schema.org/memberOf
If I change "organization" to "programMembership", no more errors, all good. The problem is that I need to use organization.
The code I'm trying to run on Google tester:
<div itemscope itemtype="http://schema.org/Organization">
<div itemprop="name">
NAME
<div itemprop="memberOf" itemscope itemtype="http://schema.org/Organization">
<div itemprop="name">
NAME2
</div>
</div>
</div>
</div>
You can ignore this error. Your use of Microdata and schema.org is valid.
The Google Structured Data Testing Tool is probably not up-to-date (it has the same problem with the license property), maybe because the allowed values of this property changed "recently" (couldn’t find anything about it, just my guess).

Why is Person and Breadcrumb data not showing?

On most pages of my site I make use of Microdata. Some things such as the data blog post was created, and review ratings show up in search results. Other information such as Person and Breadcrumb data doesn't.
Person
On my homepage I have a the following code. Pasting it into the Google Structured Data Testing Tool shows "Abergavenny Wales - Web Developer", but pasting the URL in doesn't show this, any idea why?
<div id="banner" itemscope itemtype="http://schema.org/Person">
<h1>Working Web Solutions</h1>
<h2>
Ruby on Rails, Sinatra & Drupal Development by <br class="responsive" />
Award Nominated <span itemprop="jobtitle">Web Developer</span><br class="responsive" />
<span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">Based in <span itemprop="addressLocality">Abergavenny</span>, <span itemprop="addressRegion">Wales</span>, <span itemprop="addressCountry">UK</span></span>.
</h2>
</div>
Breadcrumb
The same is also apparent with breadcrumbs. The following code works when pasted into the Google Structured Data Testing Tool but the URL doesn't return the breadcrumb.
<ol id="breadcrumb">
<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="/services" itemprop="url">
<span itemprop="title">Services</span>
</a> ›
</li>
<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="/services/freelance-ruby-on-rails-development-cardiff-abergavenny-wales-uk" itemprop="url">
<span itemprop="title">Ruby on Rails Development</span>
</a>
</li>
</ol>
Maybe because Google can't show everything in the preview, and it seems that your Google+ profile takes precedence over other metadata.
I've not tested any Person functionality of schema.org yet. But I've had a nice conversation with a person that could explain me, why breadcrumbs are not working with schema.org yet. May that answer is matching for Person too.
Additionaly:
Also this helper can help you create valid microdata: http://www.google.com/webmasters/tools/richsnippets

Multiple aria role "navigation" and "complementary"?

In a document, there are multiple <nav> and <aside> elements. Should I add role="navigation" on all <nav>s and role="complementary" on all <aside>s?
In other words, is it more beneficial or more redundant that there are multiple <nav role="navigation">...</nav>s and multiple <aside role="complementary">...</aside>s in a document?
According to the HTML5 spec, role="navigation" is implicit to the <nav> element, and role="complementary" is implicit to the <aside> element. As such, you do not need to add them according to the spec.
The question is how many ATs actually honor the spec, so if you want to play it safe, you can add those roles, it won't hurt.
Also rememebr that some <aside> elements should however be marked as role=note.
Another thing to consider is that the HTML5 spec allows multiple seperate <ul>s to be grouped under a <nav>. I am uncertain if this implies that role="navigation" is enough on just the <nav> or that each <ul> should be marked as such. I am unable to find any information on this.

Doesn’t Google support Schema.org’s AggregateRating at the moment?

A rich snippet example from Schema.org http://schema.org/AggregateRating:
<html>
<div itemscope itemtype="http://schema.org/Product">
<img itemprop="image" src="dell-30in-lcd.jpg" />
<span itemprop="name">Dell UltraSharp 30" LCD Monitor</span>
<div itemprop="aggregateRating"
itemscope itemtype="http://schema.org/AggregateRating">
<span itemprop="ratingValue">87</span>
out of <span itemprop="bestRating">100</span>
based on <span itemprop="ratingCount">24</span> user ratings
</div>
</div>
</html>
But http://www.google.com/webmasters/tools/richsnippets won't show a preview.
So, the following words from http://support.google.com/webmasters/bin/answer.py?hl=en&answer=146645 are just lies?
New! schema.org lets you mark up a much wider range of item types on
your pages, using a vocabulary that Google, Microsoft, and Yahoo! can
all understand. Find out more. (Google still supports your existing
rich snippets markup, though.)
It is working absolutely fine.
Google is not obliged to show you preview every time, and here it shows an error when I inserted your give example from schema.org:
The following errors were found during preview generation:
This page does not contain authorship or rich snippet markup.
I have done it in my website's news pieces and it shows fine.