Por que minha marcação itemprop = 'image' está incorreta?

9

Eu tenho experimentado o Microdata e pensei em experimentar no meu blog. Acontece que o modelo que eu estava usando já adicionou alguma marcação. Não foi ótimo e então eu arrumei o que pude.

Para tentar dar sorte, eu adicionei mais marcações à minha postagem mais recente, mas a Ferramenta de Teste de Dados Estruturados (SDTT) do Google está descontente com os itemprop='image'atributos e não sei por que.

Erros da Ferramenta de Teste Estruturado

Página de resultados .

Entendo, ignorando todo o código intermediário, que estruturei os dados da seguinte maneira:

<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
  <div itemprop='articleBody'>
    <a href="1.png" itemprop="url"><img itemprop="image sharedContent" src="1.png" /></a>
    <a href="2.png" itemprop="url"><img itemprop="image sharedContent" src="2.png" /></a>
    <a href="3.png" itemprop="url"><img itemprop="image sharedContent" src="3.png" /></a>
  </div>
</div>

E isso parece correto para mim. BlogPostingpode ter as propriedades articleBodye de imageacordo com https://schema.org/BlogPosting , mas de acordo com o SDTT:

O atributo itemtype possui um valor inválido.

Na verdade, eu apenas tentei o SDTT com o código de exemplo acima e ele está falhando na validação.

Código de exemplo no SDTT

Então, obviamente, estou perdendo alguma coisa. O que estou fazendo errado?

Ken Sharp
fonte
Alguns dos links nestas perguntas foram removidos porque não são necessários para que a pergunta seja respondida.
John Conde
Por que as tags amplamente usadas foram removidas?
Ken afiada

Respostas:

15

A imagem schema.org/BlogPosting permite ImageObject e URL, no entanto, o Google permite apenas ImageObject , daí o erro. A marcação pretendida é:

<!-- my code -->
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
  <img src="image.jpg" itemprop="url">
</div>

               

Outra discrepância é schema.org/ImageObject recomenda contentUrl, mas o Google recomenda url, portanto, meu uso acima.


Em resposta ao código do seu comentário , sua estrutura ainda está incorreta. Vou levá-lo linha por linha:

<!-- your code -->
<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Ponto secundário, mas a menos que você esteja usando o XHTML, itemscope='itemscope'está errado. Use itemscope(como você fez mais tarde).

<!-- your code -->
  <div itemprop='articleBody'>
    <div itemscope itemtype="http://schema.org/ImageObject"/>

Seu ImageObject é filho da propriedade articleBody, mas você não a associou dessa maneira. Assim, você tem um articleBody sem propriedades associadas e um ImageObject não associado. Você deveria usar

<!-- my code -->
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">

Além disso, />está incorreto, mesmo se você estiver tentando usar XHTML, pois esse elemento tem filhos e um fechamento </div>. Basta usar >como eu incluí no snippet acima.

<!-- your code -->
      <a href="1.png" itemprop="url"><img itemprop="image sharedContent" src="1.png" /></a>

O que o sharedContent está fazendo aqui? sharedContent espera um CreativeWork quando usado como uma propriedade do SocialMediaPosting - nunca como uma propriedade do ImageObject e nunca em um img.

Seu outro trecho de código que coloca a propriedade sharedContent como abaixo também está errado.

<!-- your code -->
<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
  <div itemprop='articleBody'>
    <div itemprop='sharedContent'>
      <div itemscope itemtype="http://schema.org/ImageObject"/>

Embora o sharedContent esteja agora no lugar certo, ele ainda precisa ser um CreativeWork. Seus ImageObjects ainda não estão associados ao BlogPosting, como mostra a Ferramenta de Teste de Dados Estruturados.

                                          

A seguir está o código correto.

<!-- my code -->
<div itemscope itemtype="http://schema.org/BlogPosting">
  <div itemprop="articleBody">
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="1.png" itemprop="url"><img itemprop="image" src="1.png"></a>
    </div>
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="2.png" itemprop="url"><img itemprop="image" src="2.png"></a>
    </div>
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="3.png" itemprop="url"><img itemprop="image" src="3.png"></a>
    </div>
  </div>
</div>
grg
fonte
Eu vejo. A adição ImageObjectfalha com sharedContentum filho dela: pastebin.com/cSgVZNyE . A remoção sharedContentfaz com que seja feliz: pastebin.com/rieWwSM6 . O agrupamento de cada imageum em um pai sharedContent( pastebin.com/AmpBDqJs ) valida com satisfação, mas é porque o STDD do Google simplesmente o ignora? O STDD fica muito feliz se contentURLfor usado também : pastebin.com/23wBvx8F . Parece que eu fiz isso corretamente e o Google fez errado? Isso tem que ser o primeiro. 😉 Acho que posso apaziguar todos eles adicionando todas as tags relevantes. Obrigado!
Ken
11
@ Ken Veja minha edição para obter comentários sobre seu código.
grg
O TS usa um tipo de modelo básico do Blogger, portanto, ele não poderá usar seu código sem renovar o modelo inteiro. As alterações devem ser feitas no nível do modelo, não no nível dos dados estruturados.
Evgeniy
Mais uma vez obrigado @grgarside. Você certamente está certo sobre sharedContent- eu usei tudo errado. Eu o removi por enquanto. Vendo outra vez o esquema que vejo, acho que não preciso usá-lo em um arquivo CreativeWork. Apenas ignore />, ele foi digitado com pressa 😉 e o código original é XHTML. Acabei de misturar os dois no meu exemplo (daí as duas versões do itemscope). O código final está correto, honesto! 😁
Ken afiada
@ Evgeniy O modelo está sendo editado ou não funcionaria. Minha pergunta original continha links que qualquer um poderia ter verificado facilmente, mas agora dois wallies editaram os links e estou cansado de editá-los. Então, aqui estou me explicando mais uma vez, como previ que precisaria.
22616 Ken Sharp
2

Eu tive um problema semelhante com o Google Structured Data Tester marcando minhas imagens como inválidas. Aparentemente, ele não aceita imagens em que a origem é um domínio de host local. Assim que implantei no servidor intermediário, a marcação estruturada passou na validação.

Mike
fonte