OGPを理解しなければいけない理由-マーケティングに役立つOGPの書き方

OGPを理解しなければいけない理由-マーケティングに役立つOGPの書き方

ハウツー

FacebookやTwitterなどのSNSで自社のWebサイトをシェアしてもらえると、より多くのユーザからのアクセスを期待できるようになります。もはや「ネット上の口コミ」は、Webマーケティングに欠かせない必須の対策項目です。そこで今回は、自社のWebサイトがSNSでシェアされたときの効果を最大限に高める、OGPの設定について紹介します。

こちらもオススメ

OGPのメリット

OGPはOpen Graph Protocolの略で、SNSでWebページがシェアされた際に、あらかじめ指定しておいた「タイトル」、「紹介文」、「アイキャッチ画像」などをタイムライン上に表示させる記述となります。

OGPを指定していなかった場合は、Webページ内にある「画像」や「文章」が適当にピックアップされてシェア表示されるため、Webページの内容が的確に伝わらない、訴求力の乏しいシェアになってしまう可能性が高いと言えます。これでは、せっかくシェアしてもらっても、クリックしてもらえる確率が低くなり、コンテンツの拡散を見込めません。SNSのシェアをより効果的なものにするには、それぞれのWebページに適切なOGPを設定し、意図したとおりにシェアを表示させる必要があります。

OGPの設定方法

OGPはHTMLのmetaタグを使って指定します。SNSごとに独自の記述方法が定められていますが、共通の記述方法も多いため、同じ記述でFacebookやTwitterといった複数のSNSに対応させることが可能です。

ここではその一例として、多くのSNSに共通する基本的な記述方法を紹介しておきます。OGPを設定するときは、metaタグのproperty属性に以下の値を指定します。例えば、property="og:title"と記述すると、シェアに表示される「タイトル」を指定できます。各項目の指定内容は、content属性に記述します。

og:title

タイムラインに表示されるシェアの「タイトル」を指定します。

og:type

シェアされる「Webページ」の種類を指定します。トップページの場合はcontent="website"、その下位にある記事ページなどの場合はcontent="article"を指定するのが一般的です。

og:url

シェアされるWebページの「URL」を指定します。このURLは絶対パスで記述するのが基本です。

og:site_name

シェアされるWebページの「サイト名」を指定します。

og:description

シェアされるWebページの概要を示す「紹介文」を指定します。

og:image

シェアされた際に表示される「アイキャッチ画像」のURLを指定します。このURLも絶対パスで記述するのが基本です。

これらの情報をHTML内に記述しておくと、意図した内容でシェアを表示できるようになり、それだけSNSでの拡散効果が高くなると期待されます。

OGPの画像推奨サイズ

OGPを設定する際は、「アイキャッチ画像」として使用する画像にも注意しなければいけません。「アイキャッチ画像」の推奨サイズは1200 × 630pxとなっており、最低でも600 × 315pxが必要とされています。とはいえ、必ずしもこの数値を厳守しなくても構いません。基本的には、画像の縦横比が1.91:1になっていれば大丈夫です。

画像の縦横比が1.91:1になっていなかった場合は、画像の上下(または左右)がトリミングされた状態でアイキャッチ画像が表示されます。このため、画像の構図が意図していた配置にならない場合があります。

「画像がどのように表示されるか?」は、実際にシェアボタンなどをクリックしてみると確認できます。ただし、ブラウザにキャッシュが残っていると、OGPの設定が正しく反映されず、古いOGP設定のままシェアが表示されてしまう場合もあります。このような場合は、ブラウザのキャッシュを削除してから、もう一度確認を行うと、正しい表示を確認できます。

SNSマーケティングに必須のOGP

SNSが広く浸透した現在において、SNSを利用したコンテンツの拡散は、SEOと同じくらい重要な役割を担っています。Webページに掲載したコンテンツを「意図したカタチ」で拡散してもらうには、適切なOGPの設定が欠かせません。Webページの内容を連想させる「画像」と「紹介文」を準備し、ユーザがクリックしたくなる、魅力的なシェアが表示されるように努める必要があります。

こちらもオススメ