公開日：
WordPressサイトに限らず、サイトの高速化を行う時にまず手を付けるべきは
画像をのデータサイズを小さくする！
です。
これはエンジニアじゃなくてもできますので、加藤のように「プログラムとか言われても分からんよ」という方はとりあえずこれからやってみましょう。
画像の圧縮だけでも結構奥深くて楽しいですよ～
何故画像の圧縮が大事なのか
画像というのは文字に比べるとめちゃデータサイズが大きいんです。
例えば上に貼った美女の画像は
72,692 バイト
あります。
これをテキストに換算すると全角で
36,346文字
書ける訳です。
例えば、上の美女画像を30枚くらい貼るとサイトが重くなるとして、
「あー、画像置いてないけど文章書きすぎでサイト重くなっちゃったな～～～」
という状況に陥るには
100万文字くらい
書かないといかんという訳です。って書けるか！
つまり画像というのはそれだけデータサイズが大きいのであって、テキストと比べると比較にならないくらい読み込みに時間がかかるのです。ここを圧縮してデータサイズを小さくしようとするのは当然！という訳ですよ！
特にゲームの情報サイトみたいに画像をたくさん使うサイトはここから始めるのが効果的だと思います。
小難しいことを色々やるより、画像1枚減らしたほうが良いよ！
サイトの高速化に関してググると、色々と「やるべきこと」が出てきます。
WordPressサイトの場合に多いのが以下のような項目。
・ウィジェットを減らす
・phpの記述を減らす
・1カラム構成にする
等々。
正直に申し上げれば、「ウィジェット」を全部消して1カラム構成にしてみるよりも（当然phpの記述量も減ってる）、
大きな画像を1枚消す方がサイトスピードは速くなりました。
上記の項目が無意味とは言いませんが、「些細なことをやるよりもまずは大きいところを何とか」したほうが良いかと思います。
実際に目に見えてスピードが速くなった方がモチベーションも上がりますしね。
サイト内の画像を全部圧縮する！
これは前記事にしたのでそれを読んで頂ければと思いますが
結果どれくらい変わったのか？をご報告します。
Googleアナリティクスの「平均ダウンロード時間」推移
Googleアナリティクスを使用している場合、アナリティクスの管理画面から「平均ダウンロード時間」を確認することができます。
ページの平均ダウンロード時間: ページのダウンロードにかかった時間。
ゲーム攻略！SQOOL.NET（http://sqool.net/）の「平均ダウンロード時間」の推移は以下の通りです。
※2015年2月にサーバーを上位サーバーに移行したことでダウンロード時間が改善しています。（強いサーバーに引っ越すのもサイト高速化の有効な手段ですね！）
※2015年7月ごろからサイトへのアクセス増加や、長文（画像も多い）記事の投入などで再びダウンロード時間が悪化しています。
画像の全量圧縮を行ったのは2015年9月末。
そこからダウンロード時間が改善しているのが分かります。
サーチコンソールの「ページのダウンロード時間」
Googleのサーチコンソールを使ている場合、その管理画面から「ページのダウンロード時間」を知ることができます。
検索エンジンのクローラーがサイト内をクロールする際に、1ページあたりのダウンロード時間が短いほど多くのページをクロールしてくれます。
9月に画像圧縮を実施して以降、急激に改善しているのが分かります。
（スミマセン、これ以前のスクリーンショットは撮っていませんでした；；）
WordPressユーザー限定 画像のデータサイズを（ある程度）自動的に圧縮する！
WordPressは「プラグイン」で色々な機能を追加する便利な仕様があります。
不要なプラグインをたくさん追加するとプログラムが肥大化してあまりよろしくないのですが、正しく使う分には是非積極的に使うべきです。
加藤が色々試して、「画像のデータサイズをコントロールするのにイイな」とおもったプラグインを紹介します。
Imsanity
アップロードする画像の長辺を制御することで、大きすぎるサイズの画像になることを抑止できます。
大きな画像を使っても、CSSなどで自動的に画面のサイズに圧縮されて表示されますが、それって「わざわざデータサイズ大きい画像を読み込んで小さく表示している」という、大変な無駄をやっているわけです。
じゃあ、最初から適切な小さなサイズでアップロードしたほうが良いよね、ということになりますが、1枚1枚サイズを調整してからアップロードするのは面倒です。
このプラグインで自動的に調整すると楽でしょう。
SQOOL.NETでは、長辺を500pxに調整しています。
さらに画像の形式を全てjpgにする、なども可能。
一般的にpngよりもjpgの方が画像のデータサイズは小さいのでSQOOL.NETはjpgに統一しています。
EWWW Image Optimizer
有名な画像のデータサイズ圧縮のプラグインです。
実はあまり圧縮率は高くなくて平均で10％程度ですが、無いよりはましです。
管理画面が若干重くなりますが、ページを閲覧するユーザーの快適性の方が重要でしょう。
一応入れておいても良いと思われるプラグインです。
TinyPNG
これは加藤は使っていませんが、かなり良さそうな感じがしますので一応ご紹介だけ。
ウェブブラウザで画像を圧縮できるサービスとして有名な「TinyPNG」ですが、実はWordPressのプラグインもあります。
https://wordpress.org/plugins/tiny-compress-images/
ウェブ版のTinyPNGは圧縮率が非常に高い優秀なサービスなのでプラグインもかなり期待できますが、
無料アカウントでは月に100枚の画像までしか圧縮ができません。
有料分は枚数ごとに課金されるようなので、大量の画像を使用するサイトで使う場合は収益性とのバランスをよく計算する必要があります。
全量の圧縮はちょっと無理；；という方は共通部分の画像から手を付けよう
画像を全部圧縮するのはちょっと無理、という場合は、サイトのヘッダーやフッター部分など、「全ページに表示されている部分」の画像だけでも圧縮しておくと良いでしょう。
場合によっては「共通部分には画像を置かない！」というのもアリです。
圧縮はもちろんだけど、枚数を減らすのも大事！
画像を圧縮してデータサイズを小さくするのはもちろん大事なんですが、
できれば画像は無い方が良いくらい
枚数も極力減らす
ってのもとても大事です。
そもそも画像が無ければ画像のデータサイズに悩むこともないのです。
とはいえ画像を全撤去するのは現実的ではないので、せめて不要な画像は除去するようにしましょう。
リンクボタンの代わりにイラスト画像にリンクを設置、などやっていないでしょうか。
見た目華やかで作りやすくていいのですが、できればCSSでボタン型のリンクを作るなどしたほうが良いです。（サイトスピード的には。デザイン重視のサイトは難しいかもしれませんね。）
CSSで作るボタンは画像に比べれば格段に読み込み速度が早いです！アイツらは文字データですから！
とにかく画像！まずここからやる！
という訳でしつこいですが、
まずは画像を何とかしよう！
マジで！
タグ
