こんにちは、りゅうのすけ(@k_r001)です。
この記事では、ブログの最適な画像のサイズについてまとめています。
こういった方は読むことをおすすめします。
ブログ用画像の最適なサイズは？
ブログのおすすめな画像サイズは、横幅1280pxの画像です。
- 記事に直接属するマークアップされた画像のみを指定する必要があります。
- 画像の幅は 1,200 ピクセル以上にする必要があります。
- すべてのページに画像を少なくとも 1 つ含める必要があります（マークアップを含めるかどうかは問わない）。Google は、アスペクト比と解像度に基づいて、検索結果に表示する最適な画像を選択します。
- 画像の URL は、クロールやインデックス登録に対応できる必要があります。
- 画像はマークアップされたコンテンツを表している必要があります。
- ファイル形式は Google 画像検索でサポートされている必要があります。
- 適切な画像が選択されるようにするために、アスペクト比が 16×9、4×3、1×1 の高解像度画像（幅と高さをかけて 800,000 ピクセル以上の画像）を複数指定してください。
- 画像の幅は 1,200 ピクセル以上
- アスペクト比が 16×9、4×3、1×1 の高解像度画像（幅と高さをかけて 800,000 ピクセル以上の画像）
この2つの条件を満たすのが、1280 × 720 pxです。
画像サイズが大きいことによるメリット
画像サイズが大きいと画像がキレイに表示されます。
単純な話ですが、大きいものを小さく表示するとキレイに見えるのは当然です。
純粋に粗い画像の影響で、サイト自体の完成度を下げてしまうのでできる限り高画質の画像を使いましょう。
画像サイズが大きいことによるデメリット
画像が大きいことによるデメリットは、サイトが重くなることです。
サイトの容量が重いと、表示速度が重くなってしまい、表示速度が重いと離脱率を上げる原因になってしまいます。
画像サイズが小さいことによるメリット・デメリット
画像サイズが小さいメリット・デメリットは、サイズが大きいことによる影響の真逆です。
表示速度が速くなる反面、見栄えが悪くなります。
だからこそ最適な画像サイズを決めましょう。
フリーのイラストサイトから画像を取得したら、画像のサイズを確認してWordPressにアップロードしましょう。
ブログに最適な画像サイズの調べ方
自分のブログの横幅を調べる方法は2種類あります。
- デベロッパーツールで確認する。
- スクリーンショットを使う
デベロッパーツールを使うことで正確なサイズを割り出すことができます。
ですが、使い方がわからない場合はスクリーンショットを使いましょう。
デベロッパーツールで画像サイズを調べる
デベロッパーツールは、「F12」を押すことで開くことができます。
デベロッパーツールが開けたら「Computed」を押しましょう。
画像サイズの確認はこれだけです。
1680 × 10373.600
青枠に中にこんな感じで表示されています。
これが縦横比です。
- 横：1680
- 縦：10373.600
つまり筆者のサイトは、横幅が1680pxに設定しておけばちょうどいいサイズになります。
スクリーンショットで画像サイズを調べる
簡単に画像サイズを調べるためには、スクリーンショットを撮りましょう。
- MAC ➡︎ 「shift⇧」＋「command(またはcmd)⌘」＋「3」
- Windows ➡︎ 「Windows」＋「PrintScreen」
変わってるといけないので、ショートカットキーのリンクも貼っておきます。
画像の編集画面の枠で囲えばサイズが表示されます。
この方法で画像サイズを調べた場合は、1,500pxと表示されます。
正確性はあまりないですが、参考程度に試してみるといいかと思います。
まとめ
おすすめの画像サイズは、「1280 × 720 px」です。
「構造化データタイプの定義」でも指定されているように、
- 画像の幅は 1,200 ピクセル以上
- アスペクト比が 16×9、4×3、1×1 の高解像度画像（幅と高さをかけて 800,000 ピクセル以上の画像）
この2つの条件を満たすのが、1280 × 720 pxです。
画像を作成する時に活かしてください。
【パソコン用】Canvaとは？画像作成ツールCanvaの使い方
最後まで見ていただき、ありがとうございました。
