WordPressに貼る画像のファイルサイズは出来る限り小さいほうが良い。なぜなら、画像サイズはテキストと違って非常にファイルサイズが大きいので、画像がたくさん貼られる記事は表示速度がとても遅くなってしまう。
テキストのファイルサイズは1万文字でも数十キロバイト程度だが、画像だと500×500の大きさでも1つで数十キロから100キロバイトにもなってしまう。
従って、貼る画像の大きさをなるべく小さく設定することが大事だ。今回は私が実践している、画像サイズをなるべく圧縮してWordPress表示を高速化する手順を解説する。
1.オリジナルの画像サイズを小さくする
プラグインを使うのも手だが、そもそもアップする画像の元サイズを小さくしたほうが良い。それと余談だが、WordPressは1つ画像をアップロードすると「大サイズ」「中サイズ」など違うサイズの画像を自動で生成してしまう。
画像数が多くなるとフォルダが圧迫されかねないので、「勝手に複数サイズ作成を禁止するWordPressメディア設定」でメディア設定をしておこう。
それではMacのプレビュー機能を使って画像サイズを編集する方法を解説する。
1−1.一個の画像サイズを変更する
まずは変更したい画像をダブルクリックしよう。普通はプレビューというソフトで開かれると思うが、違いソフトで開く場合は右クリックで「このアプリケーションで開く」からプレビューを選択しよう。

画像がプレビューで開いたら、上部のツールバーに注目。

「ツール」を押すと「サイズを調整」と出るので押そう。

ここでファイルサイズを変更できる。ここでは幅を500に変更してみる。OKを押す。

画像サイズが小さくなった。

1−2.複数の画像ファイルのサイズを一括で変更する
今度は10個20個の複数ファイルを変更したい時の方法だ。まずはサイズを変更したいファイルを複数選択しよう。

次にファイルを選択したまま右クリックを押して「このアプリケーションで開く」>「プレビュー」を押そう。

するとプレビューでファイルが見られるようになる。

次はPC上部のツールバーで「表示」>「サムネール」を選ぼう。

すると左側にファイル一覧が出るようになった。今度はここにカーソルを合わせて全選択(⌘A)を押そう。

下図のようにファイル名が青くなっているファイルが選択された状態だ。全てのファイルが選択されたことを確認して

上部の「ツール」から「サイズを調整」を押そう。

ここで変更したい画像サイズを入力する。私はこのブログで画像を貼る時はいつも500pxくらいにしているが、今回は450pxにしてみる。入力したらOKを押す。

すると画像サイズが変更された。この見た目では分からないので、アプリを終了(⌘Q)しよう。

すぐには反映されないが、しばらくすると画像サイズが小さなったことが確認できるようになる。

画像サイズの元サイズを変更してなるべくファイルサイズを小さくするのはSEO的にはかなり玄人向け?になるかもしれないが、ここまで丁寧に考えている人にとってはかなり時短テクニックになると思う。
実際私もこのテクニックを覚えてからは画像サイズの変更にかかる時間が半分以下になった。ぜひぜひ参考にして頂きたい。
2.画像圧縮サービスを使ってさらに画像サイズを小さくする
2−1.TinyPNG
TinyPNGというサイトにアクセス。パンダのいるサイトだ。ここで縮小させたいファイルをアップロードする。

圧縮させたいファイルを選択する。

すると自動的に圧縮が開始させる。PNGファイルの場合は70〜80%もサイズダウンしてくれる。「download」というボタ ンを押してダウンロードしよう。複数ファイルを一気に圧縮した場合は「save to dropbox」でdropboxに一括ダウンロードしても良い。


ちなみに私はなるべくPNG形式ファイルを使うようにしていて、それはPNGファイルは劣化しづらいからだ。
2−2.JPEGminiでjpegファイルを圧縮する
JPEGminiというサイトにアクセス。赤枠の「UPLOAD PHOTO」を押す。

Press to Upload Photosを押す。

縮小させたいファイルを選択して開くを押す。

圧縮が開始される。

60KBから42KBまで圧縮された。矢印先を押してダウンロードしよう。

任意のフォルダにダウンロードする。
