WEBコミュニケーション事業部の安田です。

先日お客様からTwitterでシェアしたときに画像や説明文を表示させる方法を教えてほしいとご質問をいただきました。今回はTwitterやFacebookなどで画像や説明文を表示させるOGPのお話をしたいと思います。

OGPとは？

TwitterやFacebookなどでWEBページをシェアやページURLを張り付けた際にタイムラインに表示される画像や説明文などを指定するmetaタグです。

OGPの設定はなぜ必要？

設定していないとページタイトルやディスクリプションが表示されますが何も表示されなかったり、意図しない表示をされてしまったりすることもあります。シェアされた内容を見た人にそのWEBページ内容を理解して訪問してもらうためには適切な内容の設定が必要です。

OGPの設定方法は？

HTMLのheadタグ内に以下の内容を記載します。

<meta property=”og:種類” content=”種類に対応する内容”>

主に使うのは以下の5つです。
〇WEBページのURL
<meta property="og:url" content="WEBページのURL">

〇WEBページの種類
<meta property="og:type" content="WEBページの種類">

〇画像URL
<meta property="og:image" content="画像URL">

〇WEBページのタイトル
<meta property="og:title" content="WEBページのタイトル">

〇WEBページの説明文
<meta property="og:description" content="WEBページの説明文">

OGP設定の注意点

WEBページによって「WEBページの種類(og:type)」のcontent指定が異なります。またTwitterはTwitter用のタグ指定もあります。これらをHTMLに記載するのでHTMLの知識も必要になります。ご自身で対応が難しい場合は制作会社などに相談するのがよいと思います。

最後に

シェアされた際にOGP設定の有無で表示は大きく変わります。シェアから訪問を増やすためにも適切にOGPを設定してマーケティングにいかしていただければと思います。