シェアしたときに画像が出ない！デバッガーを活用しよう！

みなさんこんにちは！CB部広報担当のさいまりです！

ブログや募集記事などWEBページをSNSでシェアする時、ついついわすれがちな「OGP」設定。 こいつがあるのとないのではクリック率が全然違います。

「OGP」って何？

OGPとは、”Open Graph Protocol”の略です。 facebook、TwitterなどのSNSで利用されている、WEBページの情報をSNSを連携させるためのタグ……なんですが

聞きたいのはそうじゃない。

難しいことは置いておいて、「シェアしたときに画像を表示させる方法」を紹介します。 こういうのって今更まわりに聞いてもあれですし、ググってもよくわからないんですよね。。

タグの設定方法などは会社のエンジニアさんに聞くとして、

・リンクカード（画像リンク）が表示されない ・自分が意図した画像が表示されない

時の対処法です。

facebookの場合

よくあるのがこの状態↓　アイキャッチやサムネイル画像指定したのに！なんで！出ないの！！

もしくは、

いや違う！画像出てきたけどきみじゃない！！ということってありますよね。（ある人向けのブログです）

対処法：シェアデバッガーを使う

https://developers.facebook.com/tools/debug/

上記リンクにアクセスして、対象のリンクをデバッグします。

すると……

リンクカードがプレビューされます。 この時表示させたい画像以外のものが出た場合、投稿元で画像設定がされていないかキャッシュが残っているので何度かデバッグを繰り返しましょう。

シェア前にデバッグすると…？

ただし、「1度でもリンクをシェアしたことがない」と、↓のような画面になります。

投稿する必要はありませんので、デバッガーを使用する前に1度リンクカードを作ってみてくださいね。

Twitterの場合

↓の図のように、PCからはリンクカードの表示が確認できません。（モバイルからだと出るか出ないかわかる）

ですが投稿後もリンクカードは更新できるのでご安心を！

対処法：Card validator

https://cards-dev.twitter.com/validator

URLを入れてPreview cardをクリックすると…？

出た！けどなんか違う！ジャ◯ーズタレントのWEBマガジンみたくなってる！！

こういう場合は何回か「Preview card」をクリックしているとそのうち表示されます。

↑こんな感じ

画像設定が大事な理由

画像を設定していないと「かわいくない」とか「目立たない」とか心理的なものはともかく

物理的なタイムラインの占有スペースが大きく異なります

ご自身がSNSをチェックする時って１スワイプでターーーーっと情報は流れていきますよね。

その１スクロール中に「タイトルのみのカード」と「タイトル＋サムネイル画像付きカード」があった場合、その画面占有スペースの大きさはおよそ二倍です。

できるだけたくさんの人の目に物理的にとまるためにも、OGPの設定は必ずしておきましょう！

それでは～

#広報 #画像 #ブランディング #採用広報 #シェア #ブログ #OGP #CB部 #コーポレートブランディング #企業ブランディング #企業広報 #活用 #コーポレート #とき #デバッガー