OGP設定の最適な画像サイズ 1枚の画像で全SNS対応の「セーフエリア」

SNSでシェアされた際に表示されるOGP画像は、ホームページ（ウェブサイト）へのアクセス数やクリック率を大きく左右する非常に重要な要素です。画像を準備する際、適当なサイズで作ってしまうと、せっかくの魅力的なデザインがSNSのタイムラインで途中で切れてしまったり、不格好に縮小されてしまったりすることがあります。

SNSの表示に最適化されたサイズを知っておくことが、より多くの人に記事を届けるための最初のステップです。

今回は、各プラットフォームに合わせたOGP画像の設定方法や、効果的なデザインのポイントについてお伝えします。

クリック率を高めるOGP画像のサイズ

画像を準備する際、適当なサイズで作ってしまうと、せっかくの魅力的なデザインがSNSのタイムラインで途中で切れてしまったり、不格好に縮小されてしまったりすることがあります。

SNSの表示に最適化された「黄金サイズ」を知っておくことが、多くの人に記事を届けるための最初のステップです。

FacebookとX（旧Twitter）で共通の最適サイズ

実は、FacebookとX（旧Twitter）の多くの表示形式で、ほぼ共通して使える推奨サイズがあります。このサイズで作成しておけば、一つ画像を作るだけで両方のプラットフォームで綺麗に表示されるので効率的です。

推奨サイズは「横1200ピクセル、縦630ピクセル」です。

この1.91：1という横長の比率で作成すると、タイムライン上で画像が大きく表示され、ユーザーの目を引きやすくなります（厳密に合わせる必要はありません）。

• 最低サイズ: 画質の劣化を防ぐためにも、最低でも横600px：縦315px以上のサイズで作成することをおすすめします。
• ファイル容量: 画像ファイルが重すぎると、表示速度が遅くなる原因になります。一般的に5MB以下に抑えておくと安心です。（Facebookは8MBまで対応していますが、できるだけ軽くしましょう）

X（旧Twitter）のもう一つの選択肢

X（旧Twitter）では、twitter:cardというタグの設定によって、画像の表示形式を大きく変えることができます。

記事の内容を最大限にアピールできるsummary_large_image（大きな画像）の表示がいいですね。
この形式が、先ほどお話しした1200px:630pxの画像を使用する表示方法になります。

画像が切れないための「中央配置」の工夫

推奨サイズで作っても、スマートフォンやタブレットなど、見るデバイスや画面のサイズによって、上下や左右が少しだけトリミング（切り抜き）されてしまうことがあります。

これを避けるためには、ロゴや記事のタイトルなど、一番伝えたい重要な要素を、画像の中央に配置するように心がけてください。画像の端ギリギリに文字を置かないように、デザインの段階で少し余白を作っておくと安心です。

最適なサイズで最高の「顔」を作って、たくさんの人にあなたの記事を見てもらいましょう。

OGP画像の工夫

OGPの中でも特に画像は重要です。タイムラインで一番に目に入るところですからね。画像作成のときにちょっとした工夫を心がけることで、SNSシェアの効果が変化することがあります。

それではSNSシェア時に表示される画像の工夫について少し見ていきましょう。

画像内の文字は少なめに

OGP画像はSNSのフィードで小さく表示されることが多いです。そのため、画像の中にたくさんの文字を詰め込むと、読みにくくなってしまいます。タイトルや伝えたいことをシンプルにして、一瞬で内容が伝わるデザインにしましょう。

アスペクト比の「調整」も大切

先ほどFacebookやX（旧Twitter）で推奨されているアスペクト比（縦横比）について触れましたが、時には「その記事に一番合う比率」を優先することも大切です。

例えば、料理のレシピなら正方形に近い方が見栄えが良いかもしれませんし、風景写真なら横長の方が迫力が出るかもしれません。各種SNSで実際にどう表示されるかをテストして、一番魅力的に見える形を探ってみてください。

1枚の画像で全SNSを攻略する「セーフエリア」の考え方

OGP画像を作成する際、SNSごとにバラバラのサイズを用意するのは運用上とても手間がかかります。そこで、1つの画像だけで主要なSNSすべてに美しく対応するためのサイズ設定と、デザインのセーフエリアという重要な概念についてお伝えします。

最も汎用性が高いサイズは「1200px × 630px」

SNSごとに推奨サイズは異なりますが、すべてのプラットフォーム用に別々の画像を用意するのは管理が大変です。基本的には、最も汎用性が高い「1200px × 630px（比率 1.91:1）」のサイズで作っておけば、FacebookやX（Twitter）の大きなカード表示で美しく表示されます。

この比率は現在、業界の標準的なフォーマットとして定着しており、ホームページ（ウェブサイト）の制作現場でも基本のキャンバスサイズとして採用されています。高解像度のディスプレイ（Retinaディスプレイなど）で閲覧された場合でも画像がぼやけないように、横幅1200ピクセルという十分な大きさを確保しておくことが重要です。

正方形（1:1）にトリミングされるケースへの対策

ただし、注意点があります。LINEやInstagramのチャット、あるいはXのスマホ表示の一部では、この横長画像の両端が切り落とされ「正方形（1:1）」にトリミングされて表示されることがあります。そのため、絶対に切れてほしくない「ロゴ」や「記事タイトル」などの重要な情報は、画像の真ん中の「正方形エリア（中央の630px × 630pxの範囲）」の内側に収まるように配置してください。

これが、どのSNSでシェアされても大丈夫な「安全なデザイン（セーフエリア）」の鉄則です。背景の写真やあしらいは画像の端まで広げておき、文字情報だけを中央に寄せるレイアウトにすることで、どんなデバイスでも美しく情報を伝えることができます。

画像の容量とファイル形式（WebP・JPG・PNG）の最適化

画像のサイズや比率だけでなく、ファイルの容量や形式にも気をつける必要があります。高画質な画像を作成しても、ファイルサイズが大きすぎるとSNSのクローラーが読み込みをタイムアウトで諦めてしまい、結果として画像が表示されないことがあります。一般的には、ファイルサイズを1MBから2MB以下に抑えることが推奨されています。

ファイル形式については、高画質で容量を軽くできる「WebP（ウェッピー）」形式の利用が増えていますが、一部の古いシステムやマイナーなSNSでは正しく読み込まれないリスクがまだ残っています。事業用のホームページ（ウェブサイト）において確実な表示を優先する場合は、現在でも最も互換性の高い「JPG（ジェイペグ）」または「PNG（ピング）」形式を使用するのが安全な選択と言えます。

スマートフォン閲覧を前提とした文字サイズの工夫

パソコンの大きなモニターで画像を作成していると気づきにくいですが、SNSのタイムラインを見るユーザーの大部分はスマートフォンを利用しています。スマートフォンの画面上でOGP画像が表示されるサイズは、横幅がわずか数センチ程度になることも珍しくありません。そのため、画像の中に長い文章や小さすぎる文字を入れてしまうと、ユーザーには全く読めなくなってしまいます。

画像内に入れるテキストは、記事のメインタイトルなど最も伝えたい内容だけに絞り、太く読みやすいフォントで大きく配置することが、クリック率を高めるための重要なポイントです。

OGP画像の表示確認と更新されない時の対処法

最適なサイズとセーフエリアでOGP画像を作成し、ホームページ（ウェブサイト）に設定した後は、実際にSNS上でどのように表示されるかをテストすることが重要です。また、ホームページの運用において、画像を新しいものに差し替えた際に生じやすいトラブルとその解決策についても触れておきます。

表示確認には各SNSのデバッガーを活用します

Facebookのシェアデバッガーなど、専用の確認ツールを利用することで、タイムライン上でシェアされた際の実際の見え方を事前に確認できます。意図した通りに画像がトリミングされているか、セーフエリアに配置した重要な文字が隠れていないかをチェックする工程は、SNSからのアクセス向上において非常に大切です。

画像が古いまま反映されない原因はキャッシュです

設定したはずの新しいOGP画像がSNSに反映されず、古い画像が出続けてしまうというご相談をよくいただきます。これは、各SNS側に過去の画像データが「キャッシュ」として一時保存されていることが原因です。この状態を解消するには、古いキャッシュをクリアして、最新の画像を再度読み込ませる手続きを行います。

具体的な確認手順とキャッシュクリアの方法

デバッガーを使った具体的な表示確認の手順や、SNSごとのキャッシュクリアの方法については、別の記事で詳しく解説しています。せっかく作成した最適なOGP画像を正しく表示させるために、ぜひこちらの記事も合わせてご参照ください。

OGPデバッガーの使い方とキャッシュクリア手順

SNSシェアが楽しくなる！OGP設定で差をつける方法とSEOとの意外な関係