【SWELLで使用する画像サイズ】アイキャッチ・ファビコン・ロゴ・メインビジュアル・プロフィールなど

この記事では、当サイトで使用している画像サイズの情報を紹介しています。

事前に画像サイズを知っていると「ここの画像サイズはどのくらいが適切なの？」と悩むことがなく準備がしやすくなります。

目安の参考にしてみてください。

SWELLで使用する画像サイズ

当サイトで使用している画像サイズを紹介します。

ファビコン画像（512×512px）

「ファビコン画像」とは、ブラウザのタブに表示されるサイトアイコンのことです。

ファビコン画像サイズ ：512×512px

SWELLでは以下の手順で設定をします。

ヘッダーロゴ画像 （1600×400px）

「ヘッダーロゴ画像 」とは、ヘッダーなどに表示されるサイト名やサイトアイコンのことです。

ヘッダーロゴ画像サイズ ：1600×400px

SWELLでは以下の手順で設定をします。

SWELLでは、「トップページでの特別設定」で当サイトのトップページのように背景を透明にすることができます。

そのため当サイトでは、「文字に色のついた画像」とトップページ用に使用する「文字色が白の画像」の、2通りの画像を準備しました。

メインビジュアル画像（PC：1600px × 900px）

「メインビジュアル画像」とは、トップページ上部、または全体にに表示される画像や動画のことです。

PCでは以下のサイズに設定しています。

メインビジュアル画像サイズ（PC） ：1600px × 900px

SWELLでは以下の手順で設定をします。

メインビジュアル画像（スマホ：1080×1920px）

スマホでの「メインビジュアル画像」は、以下のサイズに設定しています。

メインビジュアル画像サイズ（スマホ） ：1080×1920px

SWELLでは以下の手順で設定をします。

プロフィール画像（512×512px）

「プロフィール画像」とは、サイドバーなどのプロフィールで表示される画像のことです。

プロフィール画像サイズ ：512×512px

SWELLでサイドバーにプロフィールを配置する場合は、以下の手順で設定をします。

アイキャッチ画像（1200×630px）

「アイキャッチ画像」とは、各記事に表示することができる画像のことです。

アイキャッチ画像サイズ ：1200×630px

SWELLでは以下の手順で設定をします。

まとめ

当サイトで使用している画像サイズの情報を紹介してきました。

私がSWELLでサイトを作る際、Canvaで画像を準備します。

Canvaで画像を作成するときは、「デザインを作成」→「カスタムサイズ」でサイズを指定して作成してくださいね。