• 0k
  • 0
Wix でウェブデザインしよう \ 2016年10月26日

サイトが重い?サイトの読み込み時間を改善する方法

気になるサイトがあるのにクリックしてもなかなかページが開かない、画像がいつまでたっても表示されない、という経験はありませんか?

サイトの読み込み速度は、ユーザーエクスペリエンスに関わる非常に重要な要素です。サイトがなかなか読み込まれないために、せっかく興味をもってくれた訪問者を逃してしまっているかもしれません。

そこで、今回はサイトが重くなる原因、そしてWixサイトの読み込み速度を改善するためのヒントをご紹介します!

サイト読み込みに時間がかかる原因

サイトの読み込みに時間がかかる原因はさまざまです。近年、公開されたレポートでは、サイトの読み込み時間は平均で21%増加しているとの結果がでています。これはサイトを閲覧している側にも、サイト制作者側にも原因が考えられます。

サイト閲覧側に考えられる原因として、

  • インターネット速度
  • ブラウザの環境
  • コンピュータ自体の速度が遅い(プロセッサまたはメモリが狭い)

サイト作成者側に考えれる原因として、

  • サイト上の画像を最適化していない
  • 容量が非常に大きいMP3ファイルが読み込まれている
  • HTMLアプリを使い外部コードを多数埋め込んでいる
  • コンテンツが非常に多い
  • フォント(1~3個が最適)や色を多用している

などが挙げられます。

もちろん上記以外にも多くの原因が考えられますが、訪問者のパソコンやモバイルのプロセッサになるべく負担をかけないように、コンテンツを最適化することが重要です。

サイト作成者である、あなたが出来る5つの事

上記を踏まえ、あなたができる事は以下の通りです。

ホームページの読み込み速度改善

1.掲載するコンテンツを厳選する

サイトを作成するからには、より多くの情報を発信したい!と考えるのは当然のことです。でも情報量が多ければ多いほど、サイト訪問者の為になるという訳ではありません。

コンピュータ環境が良くない訪問者にとっては、莫大な情報量で負担をかけてしまうだけでなく、一番伝えたいことが伝わらないという結果に終わってしまうことも。

「一番伝えたいこと」は何かを見極めて、掲載するページ数、画像、動画の数やWixアプリなどを調整しましょう。アプリの中でも、Instagramフィード等の画像を読み込むアプリは重くなりがちなので絞って使ってください。

2.各ページのゴールを定める

掲載するコンテンツを厳選するのに苦労しているという方は、各ページのゴールを考えてみてください。そのページの目的が『新商品の宣伝』であれば、新商品の画像と説明がそのページのメインになるべきです。他の情報は最小限に抑えましょう。

ロックバンドのオフィシャルサイトであれば、一番聞いて欲しい曲を動画として、音楽紹介ページの一番目立つところにもってきましょう。音楽ファイルと動画ファイルをアップする際の注意点は以下の通りです。

  • 音楽ファイル
    ビットレート128kbps のファイルをアップロードすることをお勧めします。
  • 動画
    YouTube や Vimeo など、複数の動画をサイトに追加することは避けてください。サイトの読み込み時間に影響を与えます。

3.デザインをシンプルにする

昔のサイトの読み込み速度が速かったのは、コンテンツがテキストと画像に限られていたという理由も挙げられます。

今は、アニメーション、動画、スライドショーなど様々な機能が利用可能になりました。これらの機能はユーザー・エクスペリエンスを向上させる一方で、サイトを重くし、サイト読み込み時間に影響を与えます。

アニメーション効果やスライドショーは最小限にとどめましょう。特に自動再生が設定されているパーツには注意しましょう。効率的な読み込み時間を考えるとおススメのウェブデザインはフラットデザインです。

4.サイトの画像を最適化する

サイトの読み込み速度を改善する一番手軽な方法が、画像の最適化です。

Wixにはアップロードされた画像を編集するための画像編集ツールが入っていますが、撮影した写真をそのままアップしてしまうと、ファイルサイズが大きく、サイトが重くなってしまいます。

画質を保ちつつ、ファイルサイズ圧縮してくれる優れた無料ツール(以下参照)を活用して、画像を最適化しましょう。画像ファイルを圧縮してからサイトへアップすることで、ページの読み込み時間を短縮することができます。このひと手間が大きな違いを生みますので、ぜひお試しを!

Optimizilla
日本語対応の画像最適化ツールです。

画像最適化ツール

TinyPNG
中心にある「Drop your .JPG or .PNG file here」をクリックして、ファイルをドロップすると、あっという間にファイルを圧縮してくれる優れもの。「Download」をクリックすると、圧縮されたファイルをダウンロードすることができます。

画像最適化ツール

Compressor.io
「TRY IT !」をクリックし、JPEGファイルをアップデートすると、画質はそのままでファイルサイズを大幅に縮小してくれます。縮小後に、オリジナルと圧縮後の画質を見比べることができます。

画像最適化ツール

5.ランディングページを利用する

多くの情報をどうしてもたくさん掲載したい場合にはランディングページを利用しましょう。メニューにリンクを追加し、訪問者がそこをクリックするとランディングページに飛ぶような仕組みにすることで、読み込み速度を犠牲にする必要がなくなります。

最後に…

最後に、読み込み速度を自分で確認してみてください。
読込み速度を把握するために役立つ無料ツールを2つご紹介します。

WEBPAGETEST
こちらのサイトは、ロケーションやブラウザを指定してサイトの読み込み速度をテストすることができます。ロード時間やサイト内の各コンテンツが占める割合などを分析してくれます。

読み込み速度を確認

PageSpeed Insights
Google社が提供する「PageSpeed Insights」は、ウェブページのコンテンツを解析し、ページの読み込み時間を短縮するための方法、ユーザーエクスペリエンスの改善案を提案してくれます。
ページのURLを入力して分析をクリックすると、モバイルとパソコンの両方を分析してくれます。

読み込み速度を確認

いかがでしたでしょうか?
自分のサイトが重いかも…と感じている方は、是非、ここで紹介した方法をお試しください。

ホームページならWix


今すぐ Wixブログ を
無料購読しよう!

Wixブログを購読しよう 役立つ情報をいち早くゲット!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email

Wixブログを購読 \ 

WebデザインやWix新機能についての
最新情報を無料でお届けします!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email