tel.0120-622835

営業時間/10:00〜18:00 
定休日/土日祝日

ブログ|アプリコットデザイン
トップページ > ブログ > そのホームページ、SNS用に重要な設定してありますか?

BLOG

ブログ

UPDATE:2017.1.12

CATEGORY
行動心理学と集客

そのホームページ、SNS用に重要な設定してありますか?

OGP設定について ホームページですばらしい商品や、コンテンツを扱っているとfacebookなどSNSでシェアされることがありますよね。

そうした時、ホームページはSNS用に設定はされているでしょうか?

せっかくシェアしてもらったのに情報がうまく伝わらなければもったいないですよね。

今回はそんなSNSに向けて設定する項目について紹介したいと思います。

SNSでシェアされた時のためのOGP設定

Facebook、mixi、Google+など、SNSでシェアされた際に記事のサムネイルやタイトル、URLなどを正しく表示されるようにするために設定するコードの事です。

OGPとはOpen Graph protocolの略称です。
簡単に言うと「このウェブページは○○を紹介しているんだよ!」と説明してくれるコードです。

このコードを設定する事によってSNSで画像、タイトルなどが目立つように表示されるためシェアしてもらった時によりクリック率がアップします。

OGP設定項目

OGPコードはホームページのheadの中に記述するだけで実装する事が出来ます!

headのタイトルの下ぐらいに記述して行きましょう。
コードは以下のように記述して行きます。


<meta property="og:title" content="ページのタイトル" />
<meta property="og:type" content="ページの種類" />
<meta property="og:url" content="ページのURL" />
<meta property="og:image" content="サムネイル画像のURL" />
<meta property="og:site_name" content="サイト名" />
<meta property="og:description" content="ページのディスクリプション" />
<!-- Facebook用設定 -->
<meta property="fb:app_id" content="App-ID(15文字の半角数字)" />
<!-- ※Twitter共通設定 -->
<meta name="twitter:card" content="Twitterカードの種類" />

og:title

SNS用に設定の出来るタイトルタグになります。
通常は

<title>ホームページのタイトル</title>
のタイトルタグを読みますが、SNSを変えたい場合は設定しましょう。

og:type

ページの種類を設定します。
websiteだったり、blog、videoなど設定して行きます。

詳しくはこちら → http://ogp.me/#types

og:url

ページのURLを設定します。
アプリコットのホームページであれば

<meta property="og:url" content="http://apricot-design.com/wp2023" />
となります。

og:image

SNSに表示される画像を指定することが出来ます。
特に関連する物でなくても、指定する事で様々な画像に変更可能です。

og:site_name

ホームページの名前を記載します。

アプリコットであれば、

<meta property="og:site_name" content="APRCOT DESIGN" />
と記載します。

og:description

そのページの説明文を記載します。
牛丼屋さんであれば

<meta property="og:description" content="安くて、早くて、うまい!スタミナの出る牛丼屋!" />
のように記載します。

fb:app_id

facebookにサムネイルや記事の説明を表示させるための設定をしています。
facebookでは表示させるためには必須の項目になりますので必ず設定しましょう!!

twitter:card

twitterでサムネイルや記事の説明を表示させるための設定をしています。

設定されると、その記事のタイトル、記事の抜粋分などが分かりやすくしっかりと表示されます。

まとめ

今回Facebook、mixi、Google+など、SNSでシェアされた際に記事の内容などをしっかりと表示させるための設定について紹介しました。

こういった設定によって記事の内容が視覚的に分かりやすく、よりインパクトを出すことが出来ます。

せっかくシェアしてもらうなら、より多くの人に見てもらいたいですよね。

SNSがどんどんと発展している時代なので、今回紹介したコードは必須と言えるでしょう。

まだ、未設定の場合は是非今回設定してみてください。

facebookなどは仕様がチョコチョコ変わっているので定期的にチェックして設定して行きましょう!

Happiness in Design

シアワセをデザインする会社

営業ゼロで年間600件以上
お問い合わせをいただいている
ノウハウを惜しみなく。

アプリコットデザインには創業当初から営業マンはいません。
創業当初からWEBを活用することに重点を置いて、これまで試行錯誤してきました。その結果、年間600件以上の問い合わせををこのホームページから得ています。ホームページという集客ツールを提供している私たち自身が、自社のホームページで集客できないのでは、お客様に自信を持ってオススメすることはできません。自社の実験から「WEBを活用して集客するためのノウハウを蓄積」した上で、誰よりもホームページの素晴らしさを知り、自信をもってお客様にご提供していきたいと考えます。

VIEW MORE

CONTACT

お問い合わせ・ご相談は
お気軽にどうぞ。

tel.0120-622835

営業時間/10:00〜18:00 
定休日/土日祝日

プロジェクト

それぞれの
らしさ溢れる日常を。

カフェ、トリミングサロン、ネイルサロン、スクール「tone village(トーンビレッジ)」

カフェ、トリミングサロン、ネイルサロン、スクール「tone village(トーンビレッジ)」

カフェ/トリミングサロン/
ネイルサロン/スクール

2023.6.2(FRI)

GRAND OPEN

採用情報

recruit info

豊かで彩りのある社会をつくる!

私たちは仕事を通して、一人でも多くの人が未来に対する希望を描けるような、そんなワクワクする社会をつくっていきたいと思っています。

VIEW MORE