Jetpackプラグインは多機能でWordPressのダッシュボードでも確認が出来ることから多くのサイトで使われてるが、唯一の欠点とも言えるのが重いこと。高機能ゆえの状況なので仕方ないのだが、ホームページの表示が遅くなる、レスポンスが悪くなるのは残念なところ。
当然、総括的にアクセス解析をするならばGoogle Analysisがベストの選択となるが、気軽さの点ではプラグインひとつで済ませたい。
(さらに…)
軽量化
-
-
WordPressの高速化にはコードのスリム化が有効
WordPressはアップデートのたびに安全で便利になっていますが、様々な機能と引き換えに出力されるHTMLも増える傾向にある。
WordPress 4.2から導入された絵文字対応もそのひとつ。絵文字を使用することができるようになったことと引き換えにデフォルトで以下スクリプトが挿入される。 -
ウェブサイトの表示は高速であればあるほどユーザーの離脱率は低くなりUX（ユーザーエクスペリエンス）も向上する。
表示速度もサイト評価の対象となるとGoogleもコメントしているように、サイトの高速化は急務といえる。大きな変更を必要としない高速化として、スタイルシートの最適化、圧縮、軽量化は効果的な方法。
検索すると様々なcss圧縮のウェブサービスが見つかるが、難読化がメインだったり、圧縮のレベルを設定できないなど、不便なサイトも多い。
最適化・軽量化の処理をした後も、サイトの更新等でcssの修正が必要となる場合も多いことから「適度な軽量化」が出来るサイトとして、以下のサイトをおススメする。http://e-optimize.jp/services/csstidy/css_optimiser.php
使い方は簡単。
1. ページ左側にある「CSS Input」のテキストボックスの中にcssファイルの中身をペーストするか、「URLから入力」で最適化・軽量化したいcssファイルのURLを指定する。
2. 実行ボタンを押す。
3. 画面下部に最適化・軽量化されたcssファイルが表示される。
4. 表示されたcssファイルをコピーして保存。
最適化・軽量化されたcssファイルの上部には
入力: 6.901KB, 出力:4.964KB, 圧縮率: 28.1% (-1937 Bytes)
のように表示されるので、どれだけ圧縮、軽量化できたかも確認できる。
また、オプションとしてCode LayoutとOptionsの項目があり、
Code Layoutでは
圧縮率（コードレイアウト）を
最高 (改行なし)
高 (セレクタ1行表記)
標準 (プロパティごと改行)
低 (プロパティをインデント)からプルダウンで選択することが出来る。
Optionsでは
CSSの内容を保護する
セレクタをアルファベット順で整列（注意）
プロパティをアルファベット順で整列
セレクタの再編成
ショートハンドCSSの最適化
colorの値を簡略化する
font-weightを数値にする
セレクタを小文字にする
プロパティの文字:
変更なし 小文字 大文字
不要なバックスラッシュを削除
最後のプロパティには ; をつけない
規格外のプロパティは削除
タイムスタンプを追加
最適化の結果を保存するからチェックボックスで有効にする項目が指定出来る。
今後の修正を必要としないcssファイルの場合は圧縮率を「最高」にしてもいいが、修正や追加などのメンテナンスが必要なcssファイルの場合は
標準 (プロパティごと改行)
がおススメ。
また、Optionsは以下のcolorの値を簡略化する
font-weightを数値にする
不要なバックスラッシュを削除にチェックのままで良いだろう。
なお、最適化のためにcssファイル内のコードの順序等も変更されるから、必ず元のcssファイルは保存しておき、表示に問題が無いことを確認することが大切。