SEOで1位を目指す｜テキスト広告JP 株式会社ディーボ
ここでは、OGPについて解説します。
OGPとは?
OGPとは、Open Graph Protocol(オープン・グラフ・プロトコル)の略で、Facebookやtwitter、はてなブックマークなどのSNS上でウェブページの内容を伝えるための情報のことです。
OGPをHTMLソースの<head>内に記述することで、シェアされた時に「ページタイトル、URL、内容、画像（サムネイル）」をユーザーに正しく伝えることが出来ます。
▼OGP設定なしの場合
OGPを設定していないと、タイトルや説明文、画像指定することはできません。SNS側が勝手に指定して表示してしまうため、意図しないテキストが表示されてしまいます。
▼OGP設定ありの場合
OGPを正しく設定することで、タイトルや説明文、画像などを最適に表示することができ、SNS上でのクリック率増加を見込めます。
OGPの記述方法
1.<head>要素にprefix属性の記述をする
まずは、これからOGPを使いますよ。という宣言を、下記のようにprefix属性で行います。
▼HTML5の場合
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> ▼XHTMLの場合は<html>要素に下記のように記述
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://ogp.me/ns/fb#" lang="ja">
※これを記述しなくても表示はされますが、記述するのが正式です。
2.<head>内に以下を追記します。
<meta property="og:site_name" content="サイト名" />
<meta property="og:title" content="タイトル" />
<meta property="og:type" content="トップページはwebsite、個別ページはarticle" />
<meta property="og:url" content="記事のURL" />
<meta property="og:image" content="サムネイル画像のURL" />
<meta property="og:description" content="記事のdescription（記事概要）"/>
<meta property="fb:app_id" content="FacebookのアプリID" />
<meta property="og:locale" content="ja_JP" /> 設定したOGPの確認方法
facebook for developersにアクセスし、チェックしたいURLを入力して[Debug]をクリックすると確認できます。
※事前にFacebookへのログインが必要です。
OGP設定することのメリット
- Facebookでいいねやシェアした人の友達のニュースフィードにサムネイル画像付きの情報が表示されます。たくさんの人に情報を拡散できる可能性があります。
- Facebookページにいいねをしてくれた人に、ウォールを更新するたびに情報を通知することができます。
SNSを利用した集客を目標とする場合は、OGP設定を必ず行ってください。
さらに、OGPではアイキャッチ画像を設定できるため、クリック率の増加を期待できます。
※個人情報の管理は、「プライバシーポリシー」に同意の上お申し込みください
