記事の「アイキャッチ画像(サムネイル)」を設定する方法
旧マニュアル番号: No.20
「アイキャッチ画像」とは、ブログの一覧ページやSNSでシェアされた際に表示される、その記事の「顔」となる画像のことです。サムネイル画像とも呼ばれます。魅力的的なアイキャッチ画像は、記事のクリック率を大きく向上させる重要な要素です。
1. アイキャッチ画像が表示される場所
- ブログやお知らせの一覧ページ
- 記事ページの冒頭
- トップページの「最新記事」セクション
- FacebookやX (Twitter) などでシェアされた際のプレビュー
2. アイキャッチ画像の設定欄
CMSの入力フォームの中に、画像を設定するための専用フィールドがあります。通常、「Thumbnail Image」「Main Image」「アイキャッチ画像」といった名前が付いています。
「Click to upload an image」や、雲のマークが表示されているエリアが目印です。
3. アイキャッチ画像を設定する手順
-
画像アップロードエリアをクリック: 入力フォーム内の、アイキャッチ画像を設定するエリアをクリックします。
-
ファイル選択ウィンドウが開く: お使いのパソコンのファイル選択ウィンドウ(エクスプローラーやFinder)が開きます。
-
画像ファイルを選択: あらかじめ記事用に準備しておいた画像ファイルを選択し、「開く」ボタンをクリックします。
-
アップロードとプレビュー確認: 画像がWebflowにアップロードされ、設定欄にプレビューが表示されます。意図した画像が正しく設定されたかを確認してください。
4. 画像を差し替える・削除する方法
- 差し替え: 設定された画像の上にマウスカーソルを合わせると表示される「Replace」ボタンをクリックすると、再度ファイル選択ウィンドウが開き、別の画像に差し替えることができます。
- 削除: 画像の上にマウスカーソルを合わせると表示される「ゴミ箱」アイコンをクリックすると、設定した画像を削除し、未設定の状態に戻すことができます。
5. 推奨される画像について
- 画像サイズ(寸法): サイトのデザインによって最適な画像の縦横比(アスペクト比)や推奨サイズ(例: 横1200px × 縦630pxなど)が決められている場合があります。制作会社から指示があれば、それに従ってください。統一されたサイズの画像を使うと、一覧ページが美しく整います。
- ファイルサイズ(容量): ページの表示速度に影響するため、ファイル容量はなるべく小さく圧縮することが推奨されます。(目安: 500KB以下)
- 著作権: 使用する画像は、ご自身で撮影したものか、利用許諾を得たもの、あるいは商用利用可能なフリー素材など、著作権に問題がないものを必ず使用してください。
次のステップ: 記事の顔となる画像が設定できました。次は、記事を分類し、整理しやすくするための「No.21 記事の「カテゴリー」を選択する方法」です。