ここでは、OGPタグの設定方法と、各ページのOGPをカンタンに確認できるツールを紹介します。
OGPとは
OGPとは、”Open Graph Protocol”の略称です。
FacebookやTwitterなど、SNSでシェアされた際に、そのページのURL、タイトル、概要、アイキャッチ画像を表示させる仕組みです。
OGPタグの設定方法
以下のmetaタグをサイトのhead内に記述します。
<meta property="og:title" content="ページのタイトル" />
<meta property="og:type" content="website か blog か article" />
<meta property="og:description" content="ページの説明"/>
<meta property="og:url" content="ページのURL" />
<meta property="og:site_name" content="ページのタイトル" />
<meta property="og:image" content="アイキャッチ画像のURL" />
そして、HTMLタグにも以下の記述を追加
<html prefix="og: http://ogp.me/ns#">
これで該当ページをシェアした際に、アイキャッチ画像などが表示されるようになります。
それぞれのOGPタグの説明
og:title・・・ページのタイトル
og:type・・・ページのタイプ。WebサイトのTOPページなら「website」。TOPページ以外は「article」。ブログは「blog」。
og:description・・・ページの説明
og:url・・・ページのURL。絶対パスで表記。
og:site_name・・・ページの名前
og:image・・・ページのアイキャッチ画像。絶対パスで表記。画像サイズは「縦630px×横1200px」だと汎用性が高い。
アナトミーで各ページのOGPタグを確認する方法
Webサイト分析ツール「アナトミー」のタイルビュー機能は、1つのページを1つのタイルで表現しています。タイルをクリックすると、そのページに設定してあるOGPタグを簡単に確認できます
アナトミーではOGPタグの確認だけでなくページのタイトルやHタグの構造も確認できるのでページの状況を把握したい場合にも便利です。また、ページ情報を更新した場合も週次で自動取得するので常に最新の情報を確認することが可能です。
まとめ
このように画面キャプチャと一緒にサイト全体のOGPタグを素早くカンタンに確認できます。流入が多いページやシェアを目的としているページにきちんとOGPが設定されているか「アナトミー」を使って確認してみましょう。
もしも、気になるページがうまく計測されない、などGoogleアナリティクスの設定に関して懸念点があれば、Googleアナリティクスの設定状況が診断できるサービスも含まれていますので、合せてお試しください。
