【2016年版】Facebook、Twitterに最適なOGP記述設定まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、ディレクターのエリカです。 突然ですが、OGPの記述って意識していますか？ OGP（Open Graph protocol）とは、単刀直入に言うとSNSでシェアしたときに表示される情報のことです。 OGP記述を設定することで、SNSでシェアされたときの視認性が高まるので、設定は必須としたいところです。 過去に何度か設定変更があり、いつも「何が最新なの？」と迷ってしまうので、2016年最新版をまとめてみました。 OGPの記述設定 HTMLの内に下記を記載します。 //共通項目 <meta property="og:title" content="ページのタイトル" /> <meta property="og:type" content="ページのタイプ" /> <meta property="og:url" content="ページのURL" /> <meta property=
Open Graph protocol
Introduction The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook. While many different technologies and schemas exist and could be combined together, there isn't a single technology which provides enough information to richly represent any
html999 » はじめてのOGP設置方法とどこまで設定するかを考える
いまさら感ありますが、はじめてOGPを設定する機会があったのでまとめます。 （薄い知識でお届けします） そろそろ企業サイト（かため）のようなWebサイトでも、Faviconとセットくらいの感覚で設定するようおすすめした方がよさそうです。 （注意：OGPの仕様がころころかわるので、すぐに間違いになる可能性があります！だいたい2013年の4月頃に調べた内容を元にしています。気づいたところがあれば更新していく予定） ※og:imageの推奨サイズが変更になっていたので修正しました（2014/12/07追記） OGPとは SNS向けの記述で、<head>～</head>内に記述するmeta情報。 facebookなど（他にもmixi、Google＋などが対応しているらしい）で、そのページがシェア（facebookの「いいね！」とか）されたときにSNS上で表示される情報を指定するためのもの。 どんな
サイトURLをFacebookに貼り付けたときのOGP画像を作成して表示する | ゆーそうとITブログ〜WordPress・Xserver・アイキャッチ画像作成ツール〜(旧:ゆうそうとITブログ)
新しくサイトを作成したときにやっておいた方がいいことは色々あるのですが、その中でもFacebookなどのSNSでシェアされたときの画像を適切に指定しておく、ということは重要なことです。 特にFacebookは拡散力が強いので、Facebookでいい感じに表示される画像の作り方を考えてみました。 Facebookに表示するOGP画像の最適なサイズについて 色々検索してみたところFacebookに表示するOGP画像の最適なサイズは 横1200 x 縦630 ピクセル かなと思います。少なくとも 600 x 315 ピクセル ということですが、大きい方がより良いということが多く言われているので新しく作るなら大きいサイズの方で作っておいた方が良さそうです。 ということでとりあえず作ってみました。 実際にはとても大きいです→こちら Facebookの表示をシミュレートできるサービス og:image
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
