web-dev-qa-db-ja.com

MicrodataでsameAs itempropを使用する正しい方法

私のクライアントは最近、ソーシャルメディアプロファイルのsameAsマークアップを実装しました。彼らはJSON-LDを使いたくないのでMicrositeを使用しました。彼らはサイトを通り抜けてそれを全面的に変更するのがいくらかの仕事であると感じているので。

divのitemtypeがOrganizationでlinkタグがitempropでラップされていないことに気づきました。

例：

<div itemtype="http://schema.org/Organization">
    <link itemprop="url" href="domain name">
    <a itemprop="sameAs" href="instagram"></a>
    <a itemprop="sameAs" href="facebook/"></a>
    <a itemprop="sameAs" href="Twitter"></a>
    <a itemprop="sameAs" href="google+"></a>
</div>

その結果、ナレッジグラフに表示されるソーシャルメディアプロファイルは2つだけになりました。

ページのさらに下には、ソーシャルメディアプロファイルへのリンクを含むアイコンがあります。代わりにこれらのアンカーをそれらの周りにラップするべきではありませんか？

seohtml5schema.orgmicrodatasocial-media
2
GrapeSoda

これらのソーシャルメディアプロファイルへの可視リンクがある場合、リンクを繰り返して「不可視」バリアントをマークアップするのではなく、これらのリンクをマークアップするのがベストプラクティスです。

<div itemscope itemtype="http://schema.org/Organization">

  <!-- … -->

  <ul>
   <li><a itemprop="sameAs" href="http://social-network-1.example.net/foo">Social Network 1</a></li>
   <li><a itemprop="sameAs" href="http://social-network-2.example.net/foo">Social Network 2</a></li>
  </ul>

</div>

リンクが表示されていない場合、または既存のリンクにMicrodataマークアップを追加できない場合（たとえば、CMSで許可されていないため）、Microdataをまったく提供しないよりも、それらを繰り返すほうがよいでしょう。

それらを繰り返して非表示にする必要がある場合は、空のlink要素の代わりにa要素を使用する必要があります。

<div itemscope itemtype="http://schema.org/Organization">
  <meta itemprop="name" href="Foo" />
  <link itemprop="url" href="http://example.com/" />
  <link itemprop="sameAs" href="http://social-network-1.example.net/foo" />
  <link itemprop="sameAs" href="http://social-network-2.example.net/foo" />
</div>

ページに表示可能なソーシャルメディアリンクが含まれていない場合でも、Microdataに追加する方が、追加しないよりも優れています。しかし、そのような場合、Googleはそれらを Social Profile Links に使用しないことを決定するかもしれません。

3
unor