WordPressの記事に画像をアップロードする前の２つの必須作業とは？

WordPress でサイトを公開したあなたは記事を書く作業に入るでしょう。

その際にいくらかの画像を挿入することは、コンテンツを豊かにする観点からとても重要です。

ただしそれら画像に対しては記事に貼る前にやっておくべき、リサイズと圧縮という２つの作業があります。

これは SEO を語る上で重要なページの表示速度にも影響を及ぼすようなことです。

必ず実行するようにしましょう。

無料の画像を取得する

まずは画像をゲットしましょう。

有料である必要はありません。多くはタダで手に入ります。当サイトで使用している画像は、全てが無料のものです。

個人的には以下の２つのサイトがオススメです。

• Pixabay
• PEXELS

両方ともにフリー画像のコレクションで、全体的に美しいものばかりです。

ここでは Pixabay で話を進めます。

Pixabay は日本語で検索しても多くの画像が表示されますが、お目当ての画像がない場合は英語で再度検索をすると、求めていたタイプの画像が見つかる可能性があります。

今回は「Japan」という文字列で調べてみます。

欲しい画像が見つかったら、そのページへと進みましょう。するとそこに「無料ダウンロード」というボックスがあります。

ここで重要なのは、画像を自身のサイトのコンテンツ幅いっぱいに表示したい場合は、その幅以上の画像を選択することです。

当テーマ「スクラッチ」を利用している場合、横幅は最低でも 750px 欲しいので、上の例では1280×851を選びダウンロードします。

画像のサイズを縮小する

画像を取得しました。

ここからこの画像を小さくします。コンテンツ幅いっぱいのサイズがあればいいので、それ以上である必要性は一切ありません。

画像を縮小するために Image Resizer for Windows というソフトウェアを利用します。

操作がとても簡単なのでオススメです。

インストールが完了したら、お目当ての画像の上で右クリックをしコンテキストメニューを開いてください。

その中に「Resize pictures」という項目があるので、それをクリックしましょう。

するとダイアログが出現します。そこで Custom の Fit を選択し、横幅を入力します。

当テーマ「スクラッチ」を利用している場合は 750-800px ほどの幅でOKです。

縦幅は横幅との比率で自動算出されるので、空白のままで大丈夫です。

それではリサイズを実行しましょう。

画像を圧縮する

リサイズが成功するとファイル名の最後に (Custom) と付いた新たな画像が生成されます。

この時点で画像のデータサイズは以下のように半減しました。

• 元画像：284KB
• リサイズ：92.5KB

データが大きいとその分転送量も増加しページの表示速度にも影響を与えるので、これは非常に重要な要素です。

では次にリサイズした画像をさらに圧縮します。

ここでは Optimizilla というウェブサービスを利用します。

こちらも非常に簡単に操作可能でオススメです。

リサイズしたファイルをアップロードしてみましょう。

アップすると自動で90%のクオリティに圧縮した画像を作成してくれます。

その分画質は10%劣化しますが、それは厳密な話で、私たち人間の視覚ではほぼ同じクオリティーです。

また右側のゲージを調節することで、さらに圧縮することも可能です。

圧縮された画像のファイル名の最後に -min　という文字列が付加されます。

元の画像などと比較すると以下のようになりました。

• 元画像：284KB
• リサイズ：92.5KB
• リサイズ+圧縮：80.3KB

元のものと比較すると実に３分の１以下のサイズです。

以下が実際の画像です。

どうでしょうか。見る分には全く問題のないクオリティではないでしょうか。

ちなみにこのページのトップで使用しているカラフルな画像にも同じ処理を施していますが、同様にキレイに表示されています。

上で説明した画像をリサイズし圧縮するという作業は、慣れれば一瞬で行えます。

そうすることによりデータ転送量が減少し、ページの表示速度が改善し、結果として SEO にもプラスの効果をもたらすのです。

必ず実行するようにしましょう。