Facebookカバー作成＆プレビュー

Facebookのカバー写真は、Facebookページ、グループ、イベントでそれぞれ異なる役割を持ちます。アップロードする画像ファイルは1つですが、FacebookはPC画面とスマートフォン画面で異なるトリミング表示を行います。一般的なFacebookページカバー（推奨820×360ピクセル）の場合、PCデスクトップ画面では横長の820×312 px（上下各24ピクセルが非表示）で表示され、スマートフォンでは縦に長い640×360 px（左右各90ピクセルが非表示）で表示されます。Facebookカバー作成＆プレビューツールは、1つのマスターキャンバスからPCとスマホの両方の表示を同時に並べてシミュレーションし、ブランドロゴや重要なテキストがどの端末でも欠けずに収まるよう支援します。

具体的な実装シナリオ： 担当者が中央に企業ロゴ、右端にお問い合わせ先電話番号を記載したカバー画像を準備しました。PCデスクトップ上では良好に見えますが、スマートフォンで確認すると右端の電話番号がスマホ版の切り抜き領域によって切れてしまいます。このツールの「デュアル比較表示」で重要領域マークを電話番号の上に配置すると、スマホ安全領域（640×312 px）からはみ出していることが即座に検知されます。水平パン調整スライダーで画像を中央寄りに再配置することで、複数画像を作成することなく1つのファイルで両環境に対応できます。

すべてのトリミング、拡大縮小、キャンバス出力はHTML5 Canvas APIを利用してブラウザのローカルメモリ内で100％処理されます。ダウンロードされるファイルには端末の枠線やアイコンなどは含まれず、高品位な画像のみが出力されます。