Facebook用カバー写真を作っているとどうしても目につくのがスマートフォンでの見え方です。

パソコンではちゃんと見えているのにスマホでは画像が切れてしまう。これで悩んでいる方も多いのではないでしょうか。
Googleで検索しても情報が古く、カチっとレイアウトを決めることができなかったので情報をシェアいたしました。
ベースサイズは828×416px、内部領域サイズは746×316pxでの制作が一番しっくりきた
ベースサイズは828×416pxで制作します。その中に746×316pxの枠を中心に置きます。その枠のサイズ内にテキストや画像などを配置するとスマホでもパソコンでも最適化されて表示されるようになります。
Facebookカバー写真をスマホ・パソコン用に最適化した際の見え方
パソコンで見た場合は上下が削られ、スマホで見たときは左右が削られるようになるため、ルールがわかっていればFacebook用カバー写真を制作しても悩む必要はありません。
Facebookカバー画像最適化ルールに従い、バナーを制作
内部領域を意識しながら枠に合わせて画像や文字をレイアウトしてゆきます。
参考バナー
ささっと作ったバナーなのでクオリティは無視してください^^;
実際にFacebookのカバー写真にするとこのようになります。
レイアウトが綺麗に収まっていいですね^^
株式会社ウィズ・プランニング 代表取締役
北海道北見市留辺蘂町を拠点に、ホームページ制作・システム開発・アプリ開発・デザイン制作をはじめ、AIを活用した業務改善やマーケティング支援など、インターネットビジネス全般を手掛ける。
AIを活用したホームページ運営プラットフォーム「OptiB(オプティブ)」、地域の情報発信・集客プラットフォーム「みんなのタウンマップ」の開発者・運営者。
これまで300社を超えるWebサイト・システム制作に携わり、上場企業やテレビ・CMで活躍する企業、芸能プロダクションなど、多様な業種のWebプロジェクトを担当。
近年は生成AIの専門家として、企業・自治体・各種団体向けのセミナー・研修に登壇し、AI導入、業務効率化、DX推進を支援している。
「ホームページを作るだけでは終わらせない」をコンセプトに、企画・開発・マーケティング・運用まで一貫した支援を行う。
趣味はベースギター、一眼レフカメラ、腕時計収集、海外旅行。











