RakkoTools

OGP確認

SNSシェア時のOGP画像・タイトル・説明文のサイズ・見え方を確認

お気に入りツール登録
OGP確認 | RAKKOTOOLS ブックマークバーなどにドラッグ&ドロップで登録しておくと、クリックするだけで閲覧中のサイトのOGP設定がすぐに確認出来ます。
複数確認

シミュレーションに失敗しました。 選択した画像をご確認ください。

設定情報が取得出来ませんでした。 URLをご確認ください。

Facebook

Twitter

はてなブックマーク

LINE

画像をドラッグ&ドロップ
またはクリックで画像を選択

【推薦画像】 横1200×縦630(比率1:0.525) 一番目立たせたい物が真ん中に配置された画像

シミュレーションに失敗しました。 選択した画像をご確認ください。

Facebook

パソコン

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

スマートフォン

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

Twitter

パソコン

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

スマートフォン

RAKKOTOOLS | サクッと使えるウェブツール

パソコン Large

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

スマートフォン Large

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

はてなブックマーク

パソコン

RAKKOTOOLS | サクッと使えるウェブツール

スマートフォン

RAKKOTOOLS | サクッと使えるウェブツール

スマートフォン アプリ

RAKKOTOOLS | サクッと使えるウェブツール

LINE

パソコン、スマートフォン

RAKKOTOOLS | サクッと使えるウェブツール

ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください!

一度に選択出来る画像は50枚までです。 RAKKOTOOLS | サクッと使えるウェブツール ラッコツールズはちょっとした便利なウェブツールを提供するサイトです。「ユーザー登録なし」「直感的に使える」「サクサク動く」Web系のツールを中心に、多様なジャンルを展開していきます。追加・改善の要望どしどしください! 個別確認 設定情報が取得出来ませんでした。URLをご確認ください。 OGPイメージ指定がありません OGPタイトル指定がありません OGP description指定がありません no image URLを入力してください ご指定出来るURLは50件までです

できること

各SNSに対応したOGPデバッガー・シミュレーターです。
  • URLを入力することで、そのページのOGP設定の確認ができます
  • facebook・twitter・はてなブックマーク・LINEでページをシェアした際のOGP画像・タイトル・説明文を表示(プレビュー)できます
  • PC版だけでなく、スマートフォン版・アプリ版で表示サイズ・表示文字数が異なるものも、それぞれ全て確認できます
  • 画像をアップして確認する場合、画像は50枚まで選択可能です。画像の表示比較にもご活用ください。 複数画像を表示している際、表示画像をクリックすると該当画像のみを変更する事ができます。
※各SNSの表示方法の変更などに伴い、実際の表示とは異なる場合もありますので、ご了承ください。 ※一度SNSでシェアしたページは、SNS側でOGP設定がキャッシュされます。 設定を変更してもOGP画像などが変わらない場合は、各SNSのキャッシュクリアをご利用ください。

OGPとは

「Open Graph Protocol」の略で、SNS上でWebコンテンツの内容を伝えるために定められた仕組みです。 OGPを正しく設定しておくことで、Webコンテンツがシェアされた際に、指定の画像・タイトル・説明文を表示させることができます。参考:facebook・twitterのOGP設定方法まとめ

OGP画像の重要性とは?

ページをシェアした際に表示の大部分を占めるがOGP画像です。 このOGP画像を最適なサイズで設定し、目に留まりやすい画像にする事でユーザーへの訴求力が高まり、クリック率が上がり、ページの閲覧数が伸びる事に繋がると考えられます。

OGPに最適な画像

【2019年5月時点での推奨画像】
  • 一番目立たせたい物が真ん中に配置されている
  • 1200*630(比率 1:0.525)
  • PNG画像
推奨理由には各SNSでの「画像の表示比率」・SNS側で行われる「画像の圧縮処理」が関係しています。 【画像の表示比率】
  • Facebook:1:0.522
  • Twitter(large):PC版 1:0.502、スマホ版 1:0.524
  • はてなブックマーク:PC版 1:0.68、スマホ版 1:0.75
上記のように表示比率は横長が主流です。OGP画像に正方形の画像を使用すると、上下が切り落とされて表示されます。 Twitter(summary)・はてなブックマークのアプリ・LINEでは正方形表示です。ここでOGP画像に縦長や横長の画像を使うと、上下左右が切り落とされて正方形表示されます。 【画像の圧縮処理】 OGP画像は表示される際に、SNS側で画像の圧縮処理が行われる事があります。 PNGは可逆圧縮(圧縮前のデータと、圧縮・展開の処理を経たデータが完全に等しくなるデータ圧縮方法)なので、画質が変わらずに表示されます。

ブックマークレットとは?

ユーザーがブラウザのブックマーク(お気に入り)から起動出来る簡易的なプログラムです。 本ツールでは、「Bookmarklet」のリンクをブックマークバーなどにドラッグ&ドロップし登録しておき、OGP設定を確認したいサイトを閲覧中に登録したブックマークレットをクリックすると、本ツールが表示されOGP設定取得結果が表示されます。

使用例

  • 既存のWebページがシェアされた場合の見え方を確認する
  • 複数ページのOGP設定を一括で確認する

関連ツール