リッチリザルトの ロゴ への対応

引き続き，リッチリザルトへの対応の記事．

Google ではロゴ | Google 検索セントラル | Google Developersで記述方法を説明している．

ロゴと言っても
https://schema.org/Organization
なので組織をロゴのリッチリザルトに流用している感じか．

ld+json でのロゴのリッチリザルト

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "url": "http://www.example.com",
  "logo": "http://www.example.com/images/logo.png"
}
</script>

トップページなど自社URLへのリンクを張る必要のないページの場合はこの記述方式がよいだろう．

microdata でのロゴのリッチリザルト

トップページの場合は ld+json でよいが，トップページ以外のページには左上や右上にロゴがあるはずだ．
そして，そこにはトップページへのリンクが張ってあることが普通だろう．

その場合，埋め込んでしまったほうが早い．
例えば以下のようになる．

<div itemscope itemtype="https://schema.org/Organization">
  <a itemprop="url" href="http://www.example.com">
    <img itemprop="logo" width="48" height="48" src="/images/logo.png" alt="株式会社○○○○○○">株式会社○○○○○○
  </a>
</div>

リッチリザルトテスト

埋め込んだ後は下記URLでテストするのを忘れないようにする．
リッチリザルトテスト(google)

関連ページ

• リッチリザルト への BlogPosting での対応
• 【WordPress】リッチリザルト対応の自動パンくずリスト生成
• 【WordPress】リッチリザルト対応サイト内検索設置方法
• Hタグ(見出しタグ)とHTML5 アウトライン
• 【レスポンシブ対応】メガメニューをCSSのみで作成