読み込み速度を向上させるためのテクニック
外部からのCSSファイルは結合させる
これ、私はやってしまっていました。
CSSを作成していくと、どんどん、コードが増えていって見通しが悪くなってしまいます。
ヘッダー、フッター、記事内、サイドバー、ナビゲーションメニュ…と
独学Web制作者はどんどんCSSが増えていってしまいます。
そのうちに知ったCSSの分割。
飛びつきました。
整理されて、非常に解決。
それが、まさか、遅くなる原因とは。
泣く泣く、統合しました。
CSSファイル内で「@import」で読み込ませない
これも、上述と同様にやってしまっていました!
だって、コードがスッキリするんだもん。
上記2項のために、
潔く、すべて、一つのCSSにまとめました。
かなり早くなりました。
存在しないページのリンクをなくす
いわゆる404エラーというやつですね
これは、時々、
WordPressプラグインである「404Notifier」でチェックするといいです。
Javascriptの外部読み込みは可能限り結合する
これはまだ対処できていません。
またわかったらアップします。
CSSとJavascriptの順番
これは、HTMLの[]タグ内のCSSとJavascriptの順番に気をつけることです。
CSSは並列ダウンロードが可能なため、
「CSS」→「Javascript」
の順で記述するといいということです。
まとめ
いかがでしょうか?
このCSSは非常に強力でこれを直すだけでかなり変わりました。
こもりまさあき,岡本渉 エムディエヌコーポレーション 2012-03-16
photo credit:
atzu via
photopin cc