その他もろもろ

CSS、JSファイルの圧縮によるサイトの速度改善!!

今日は、WordPressで組んだあるブログの速度改善を少し行っていました。

 

速度改善の際には、

私はまず状況を把握する為に

[ GTmetrix ]のサイトでいつもサイトの評価をを判定します。

 

結果はこんな感じです↓
ブログ速度改善

Google(左側)が「C」、Yahoo(右側)が「B」

 

WPを使用しているので、まずは高速化を行ってくれるプラグインをいくつか試してみたのですが、

評価はほぼ変わらず。。。。

 

そこで、CSSやJavascriptの圧縮を行うことにしました。

 

方法は、

まず、CSSやJavascriptのコードを圧縮します。
http://refresh-sf.com/yui/#output
のサイトで簡単に圧縮できます。
※圧縮前のファイルのバックアップも忘れずに!!

 

で、圧縮が完了すれば、

 

次は各ファイルをgzip形式(拡張子は「.gz」)で圧縮します。
※例えば、「style.css」「common.js」というファイルであれば、
 圧縮後には「style.css.gz」「common.js.gz」というファイルが完成していると思います。

 

圧縮後のファイルをサーバー上にアップして、

「.htaccess」に以下の記述を追記してやります。

RewriteEngine on
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule .+ %{REQUEST_URI}.gz
<FilesMatch "\.css\.gz$">
ForceType text/css
AddEncoding x-gzip .gz
</FilesMatch>
<FilesMatch "\.js\.gz$">
ForceType application/x-javascript
AddEncoding x-gzip .gz
</FilesMatch>

これで、設定は完了です!!

 

で、

もう一度

[ GTmetrix ]のサイトで評価判定をしてみました。

 

結果は、

Google(左側)は「C」から「B」へ改善、

Yahoo(右側)は「B」のままですが「73%」から「78%」へと

微妙な改善結果でした。。。

 

が、少しでも改善されればそれば良しとします。

 

あとは、

画像の圧縮とキャッシュの設定を行って、

もう少しいろいろ粘ってみる事にします。

 

因みに、

サイトの改善点の把握には、

[ PageSpeed Insights ]のサイトも参考になると思います。

弊社では、以下の方に向けて、WordPressの短期学習プログラムを
格安(15,000円~)で提供しております。

  • 個人でWordPressを使ったサイト(個人ブログやアフィリエイトサイトなど)構築をお考えの方
  • WordPressを使って副業で稼ぎたい方
  • フリーランスでWordPressを使ったお仕事をお考えの方
  • 自社でホームページの構築・運用をお考えの方
  • 企業のWEB担当者の方

内容

基本的には、初心者の方を対象にした学習プログラムです。

※ WordPress制作の上級者の方の場合、弊社の学習プログラムはあまり役に立たないと考えています。

  • ・ WordPressのインストールからセッティングの方法
  • ・ WordPressのテーマ選びについて
  • ・ WordPressのプラグイン選びと設定方法について
  • ・ サーバの準備方法
  • ・ ドメインの取得・管理の方法
  • ・ FTPの設定方法
  • など

ご用意頂くもの

  • ・ ノートPC
    ※ 弊社はWindowsを業務で利用しておりますので、できればWindowsのPCをおすすめしています。
  • WordPressでサイトの制作を考えているが、何から始めればいいのか分からない。
  • ドメインやサーバはどうやって準備すればいいの?
  • そもそもホームページの公開には何が必要なの?

などなど、

どのような内容でも構いませんので、お気軽にお問い合わせ下さい。

お客様の目的をお聞きした上で、最適の学習プランを提案致します。

ご興味のある方は、以下の内容を記載の上、一度お問い合わせ下さい。
こちらより、折り返しメールを致します。

  • ① お名前
  • ② 折り返し先のメールアドレス
  • ③ 希望の学習内容

関連記事

  1. その他もろもろ

    360playerを試してみました

    無料で使用できる「360player」というサービスを試してみました。…

  2. その他もろもろ

    .htaccessで半角スペースを使用する場合には、注意が必要です

    元々は弊社で組んだシステムではないのですが、既存システムに対して、…

  3. Piwikインストール10

    その他もろもろ

    Piwikでアクセス解析をしてみました

    Piwikを使用するには、まずサーバーにインストールを行います。&…

  4. その他もろもろ

    ドットインストールでお勉強です

    最近、ドットインストールで勉強しています。ここ…

  5. その他もろもろ

    Cドライブのお掃除です!!

    今日は台風の為、少し遅れて9時半頃に出社しました!!&nbsp…

  6. Java

    その他もろもろ

    Tomcatプロジェクトの作成

    「Eclipse+Tomcatの開発環境を作成」と「Eclip…

最近の記事

  1. PHP(ピー・エイチ・ピー)
  2. SONY 広角レンズ「SEL1018」
  3. PHP(ピー・エイチ・ピー)
  4. 俺流塩ラーメン
  5. SEO(エスイーオー)
  6. Linux(リナックス)
  7. Linux(リナックス)
  8. PHP(ピー・エイチ・ピー)
  9. バージョンアップ
  10. Google Search(グーグル検索)
PAGE TOP