• FVM大賞2015 優秀賞 受賞
  • 平成26年度福岡市トライアル発注認定事業者
  • 平成25年度福岡市ステップアップ最優秀賞 受賞
  • 平成25年度九州ニュービジネス優秀賞 受賞
  • 福岡県情報セキュリティ連絡協議会加盟企業
  • 福岡ベンチャーマーケットプレゼン企業
  • 福岡大学共同開発企業
  • 経営革新計画 第1936承認企業
  • 平成23年度九州地域中小企業事業家支援
    お助け隊事業アドバイザー企業
  • 平成23年度福岡市競争入札参加有資格企業

ITの進化論

ITは常に新しい技術やシステムが生まれている。
そこで得た技術や知識を書いていきます。
ITの進化論

2017年7月24日(月曜日)  (神山 拓也)

サイトの表示速度の重要性

こんにちは!神山です!
今回はサイトの表示速度とその対策について書きます!

ここ最近、表示速度というのが重要になってきています。
表示速度を爆速にするAMPの登場などが例に挙げられます。

Aberdenn Group Reportによると表示速度というのは下記に影響するという結果が出ているそうです。
・Amazonは0.1秒遅くなると、売上が1%ダウンする
・Googleのページ反応が0.5秒遅くなると、アクセス数が20%ダウンする
・一般的に表示スピードが1秒遅くなると、PVは11%、コンバージョンは7%、顧客満足度は16%ダウンする

Webページの表示速度は、売上や顧客満足度に影響を与えます。
たった0.1秒や0.5秒かもしれませんが、影響はとても大きいと思います。

そこで、表示速度を高速化するポイントを書きたいと思います!

実際の対策の前に、人間には3つの限界があります。
・心理的・感情的な違和感を感じないのは、0.1秒まで
・思考の流れが妨げられないのは1秒まで
・注意力を維持する限界の時間は10秒まで

Webサイトでは心理学というのが多く活用されており、とても重要になってきます!

では、実際の対策について説明していきます。
パフォーマンスの改善を行う際は、よくシステム側の改良を行いがちですが、
表示速度についてはHTML,CSS,Javascriptを改善するほうが、
開発コストが削減できる点とすぐに効果を発揮することができます。

特に下記の3つが非常に効果的です。
1.ダウンロードサイズを減らす
・javascriptから不要な空白を削除して、圧縮する
・20-30%の高速化が見込めます
2.リクエスト回数を減らす
・CSSスプライトを利用する
・CSS,javascriptを結合する
・30-40%の高速化が見込めます
3.心理的な負担を減らす
・CSSは先頭に置く
・CSSは最後に置いたほうが速いが、視覚的なフィードバックがあるので、体感速度は先頭の方が速い。

HTML,CSS,javascriptを結合したりすることで、表示速度を簡単に高速化することができます。
上記の対策はほとんど、タスクランナーできます!

まずは、CSSやjavascriptの圧縮化からやってみてください!