OG画像プレビューツール

SNSシェア用のOGP画像を、Facebook、Twitter、LINEでの実際の表示形式でプレビューできます。

このツールの使い方

特徴

• ブラウザ内完結：入力情報はサーバーに送信されません。
• 3つのSNS対応：Facebook、Twitter、LINEでの表示を確認できます。
• リアルタイムプレビュー：入力内容が即座に反映されます。
• 画像サイズチェック：画像の実際のサイズと推奨サイズを比較できます。
• 実際の表示形式：各SNSの実際のカードデザインを再現しています。
• レスポンシブ対応：スマホ・タブレットでも快適に操作できます。
• 完全無料：登録不要で今すぐ使えます。

よくある使用例

• ブログ記事公開前のOGP画像確認
• SNSシェア時の見た目チェック
• OG画像のサイズ最適化確認
• 複数のSNSでの表示比較
• ランディングページのOGP設定確認
• キャンペーンページのSNS表示テスト

注意点

画像URLは公開されている必要があります（ローカルファイルは使用できません）。CORS（Cross-Origin Resource Sharing）の制限により、一部の画像は読み込めない場合があります。入力内容はブラウザ上でのみ処理され、サーバーには保存されません。

OGP画像について

推奨画像サイズ

OGP画像の推奨サイズは1200×630pxです。このサイズは以下の理由で推奨されています：

• 高解像度ディスプレイ対応：Retinaディスプレイなどでも鮮明に表示されます。
• 各SNSで最適：Facebook、Twitter、LINEなど主要SNSで適切に表示されます。
• アスペクト比1.91:1：最も一般的なOGP画像の比率です。

各SNSの仕様

• Facebook：
  • 推奨サイズ: 1200×630px
  • 最小サイズ: 600×315px
  • アスペクト比: 1.91:1
  • 形式: JPG、PNG
• Twitter：
  • 推奨サイズ: 1200×628px（summary_large_image）
  • 最小サイズ: 300×157px
  • 最大ファイルサイズ: 5MB
  • 形式: JPG、PNG、WEBP、GIF
• LINE：
  • 推奨サイズ: 1200×630px
  • アスペクト比: 1.91:1
  • 形式: JPG、PNG

OGP画像作成のポイント

• テキストは大きく：小さい画面でも読めるように、テキストは大きめに配置します。
• 重要な要素は中央に：SNSによって切り取られる部分が異なるため、重要な要素は中央に配置します。
• 高コントラスト：背景と文字のコントラストを高くし、可読性を確保します。
• ブランドカラーを活用：企業やサイトのブランドカラーを使用して、統一感を出します。
• シンプルに：情報を詰め込みすぎず、シンプルで分かりやすいデザインにします。

OGP画像の重要性

適切なOGP画像は、以下の効果があります：

• クリック率向上：魅力的な画像でユーザーの注目を集め、クリック率が向上します。
• シェア促進：視覚的に魅力的なカードは、シェアされやすくなります。
• ブランド認知：統一されたデザインで、ブランドイメージを強化できます。
• プロフェッショナルな印象：適切な画像設定により、信頼性が向上します。