大阪市中央区 システムソフトウェア開発会社

営業時間:平日09:15〜18:15
MENU

ファイル数を減らす:猫でもできるWordPressサイトの高速化06

株式会社クローバーフィールドの経営理念
著者:YOSHIDA Takayuki
公開日:2018/01/06
最終更新日:2018/01/05
カテゴリー:技術情報
タグ:

次に、読み込むファイル数を減らす方法を考えましょう。ページにアクセスした際、サーバーとデバイスとがやり取りする回数を少なくすることを目指します。これも多いよりは少ない方が良さそうなのは感覚的にわかりますね。ファイル数を削減する方法はファイルの種類によって変わります。

CSSやJavaScriptなど、HTMLとは別のファイルで読み込むものは、種類ごとに出来る限りまとめます。厳密にやるのであれば、プラグインに同梱されているもののように自分が把握していないCSSやJavaScriptファイルもまとめたいところですが、なかなか面倒な作業だと思います。どちらかと言えばそこまで考慮した上で、独自のCSSやJSを必要としないプラグイン選びをする方がよりスマートなアプローチだといえます。

CDNなどのように外部サイトを参照している場合も注意が必要です。読み込むァイル数が増えるだけではなく、参照元の稼働状況やレスポンスが速度のボトルネックになっていることは少なくないからです。遅くなっている原因だと思われる外部ファイルがダウンロード出来るコンテンツなのであれば、自分のサーバーにまとめてしまうのも一つの方法です。

画像ファイルで、更新頻度の低いもの、例えばアイコンや見出しの装飾に使う画像については、CSSスプライトで対応します。レスポンシブなサイトでCSSスプライトを使おうとすると、多少工夫が必要ですが、ファイル数を大きく減らすことができるので効果は期待できます。アイコンなどについては、前述のアイコンフォントなどで対応できれば使い勝手や美しさの点でメリットも多いです。アイコンの数が少ない場合などはアイコンフォント一式を読み込むのに時間がかかる場合もありますので、画像を使用した方が良い場合もありますので気をつけましょう。

オンラインショップなどでは写真の数を抑えるのが難しい場合もあるでしょう。たとえばカラーバリエーションがある商品では、別々の写真を撮影するのではなく、まとめて撮影して、同じ画像を使いまわす、という方法もあります。もちろん、この方法をとることで逆にユーザビリティが悪くなってしまってはどうしようもありませんので、よく考えて対応する必要があります。

これまでも何度か違う表現で書いてきましたが、サイトの高速化は使い勝手やコストなど他の要素とのバランスの中で初めて意義があります。高速化の絶対的な方法があるわけではなく、「チューニング」と呼ばれるのはこのあたりが理由だと思われます。

    上に戻る