Webサイトの表示に時間がかかる原因

6月18日の地震の影響が大きかった高槻市や茨木市のサイトを「災害モード」に切り替えている。トップページに避難所や給水所の情報、通行止めの場所等を配信している。また、大阪市のサイトは「災害時用(軽量版)」に切り替え、被害状況や注意喚起などをまとめている。
大規模災害時には、情報を求める人が自治体Webサイトに集中し、アクセスしづらくなることがある。「災害モード」のサイトは一般に、アクセス集中に耐えられるよう通常のサイトより軽量に作られており、災害時に求められる情報に絞って提供されている。

引用:http://www.itmedia.co.jp/news/articles/1806/19/news066.html

─ YODOQの見方───────────────────────────
Webサイトの重さについて、表示にかかる時間を災害モードと通常のサイトをそれぞれ比べてみた。(同じ時間帯・条件で比較)
高槻市の通常ページはすべての読み込みが完了するまでに2.74秒かかっているのに対し、災害モードのページは1.62秒と約1秒短縮されている。
ちなみに軽量版と書かれている大阪市のページは627ミリ秒、ヨドックのオフィシャルサイトは4.91秒という結果からも、災害モードのサイトは軽量な作りになっていることが分かる。

では、何がWebサイトを重くさせているのか。考えられる原因は以下のものがある。

  • ・メディアファイルの容量
    画像や動画。これらのファイルが一番影響を受けやすい。
  • ・Javascriptの影響
    リアルタイムでスクリプトが動作するものほどページが重くなりやすい。
  • ・外部サーバからの読み込み
    CSSやJavascriptを外部サーバから読み込んだり、ツイッターやYouTubeを埋め込むなど。
  • ・アニメーション
  • ・Webフォント
    明朝体やゴシック体以外に、特殊なフォントを何種類も入れると、フォントの収録数だけ毎回読み込むので重くなることがある。

改善策としては、これらの原因であるものを最適化、または本当に必要なのかを見直すことだ。
ここ数年のデザインの流行りといえばアニメーションを使用したりと、凝った構成にすることが多いが、誰がどんな情報を必要とするのか、この構成でコンテンツが見にくくならないかなどを考えてデザインや構成を考えていきたい。

参考:https://online.dhw.co.jp/kuritama/display-speed-method-of-improving-web-site/