WordPress超高速化ノウハウ:3.ファイルサイズの削減

goto_jp 336views 更新:2014年4月16日

前回からの続きです。

高速化のための対応項目

・HTTPリクエスト減らせ
・gzip圧縮しろ
・ブラウザキャッシュ使え
画像サイズ削減しろ
HTML/CSS/JSを縮小化しろ
CSS/JSの読み込み順序を最適化しろ

今回は上記太字の3点について紹介します。

画像サイズの削減

最近はPNGが便利なため何でもPNGにされがちですが、JPEGとGIFも画像形式の特長を正しく把握して使うことで画像サイズを削減できます。

下記のような画像サイズを削減するサービスも存在するので、大きい写真を使う時には効果が高いです。
http://www.jpegmini.com/

HTML/CSS/JSの縮小化

HTMLなどのソース内から改行やスペースなどを除去して少しでもサイズを減らします。
これは1回目にも紹介したプラグイン「WP Minify」で一括して縮小・結合ができます。

CSSは改行やスペースが除去されても影響ありませんが、HTMLやJavaScriptに関しては改行・スペースの有無で表示に影響が出ることもあるので表示を確認しつつ行うのがベターです。

CSS/JSの読み込み最適化

内でCSS・JS・CSS、のような読み方をせず、CSSを先に全て読み、次にJSを読むという流れ。 前者の WP Minify などを使ってファイル結合ができていればあまり気にする必要はなくなってきます。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません