ブログやホームページ、サイトの読み込み速度の向上

2012年10月18日


サイトの読み込み速度みなさんのブログやホームページ、重〜くて遅〜くないですか?



ども、ピアノ教室管理人です。

ブログやホームページなど
サイトの読み込み速度の改善についてまとめてみました。


サイトの読み込み速度は検索結果にも影響を与え、
またサイト訪問者の利便性にも関わる大切な要素です。



普通に考えても、遅いより速い方がいいのは当然ですよね。




サイトの読み込みスピードの向上には2つのステップがあると思います。

  1. 読み込み速度の阻害要素の改善

  2. 読み込み速度向上への取り組み


今回は
1. 読み込み速度の阻害要素の改善」について見ていきましょう。




読み込み速度の阻害要素の改善


まずサイトの読み込みスピードを阻害している要素を知り、
何らかの対策を施していく必要があります。



そもそも重いサービスを使っている


ブログでは使うブログサービスによって、
ホームページでは借りたレンタルサーバーによって、
元々の反応スピードが遅い場合があります。


ここのSeesaaブログは少し前まで
重〜くて遅〜いブログとして割りと有名でした。^^;

(今はかなり改善されたかな?)


またレンタルサーバーは一般的に
利用料金とサーバー性能が比例する傾向があります。

つまり「安かろう悪かろう」ですね。^^;


もちろん安くて快適なレンタルサーバーもありますが、
事前の入念なリサーチが必要になります。




もし遅〜いブログ、遅〜いレンタルサーバーに当たったら、
・・・引っ越すしかないかも。。。




外部サービスから読み込んで表示しているパーツ類


サイトを表示するたびに外部にアクセスし、
データやプログラムなどを参照してから表示するため、
どうしてタイムラグが発生しやすくなります。


また参照先のサーバのレスポンスによっては
恒常的に読み込み速度が遅くなってしまいます。


代表的なものとその対策です。

  • 各種ブログパーツ
    ⇒ 装飾やにぎやかしのブログパーツは削除して、機能的にどうしても必要なモノのみ残す。

  • YouTubeなどの動画
    ⇒ 1ページに複数の動画が表示されないようにする。特にブログのサイドバーの動画は、全ページでボトルネックになりやすい。

  • 各種ソーシャルボタン
    ⇒ 主流となっているボタンのみに絞る。(※)

  • にほんブログ村などのランキングボタン
    ⇒ ボタン画像を一旦ダウンロードし、自分のブログにアップロードしてから画像リンクとして作成する。


※Twitterの公式ツイートボタンやfacebookのいいね!ボタンが、読み込み速度の足を引っ張っていることがままあるので泣けてきます。
(;´Д`)


外部サービスの利用は
「機能性」と「読み込み速度」のシーソーゲームになるのが宿命です。


ブログの目的に応じて取捨選択していきましょう。




データサイズの大きな写真や画像


特にブログで多く見られるんですが、
撮影した写真をそのままアップロードして使うケースが多く、
読み込み速度の低下につながりやすくなります。


写真を見せることがメインの「写真ブログ」でない限り、
撮影した写真は一旦画像編集ソフトなどで
サイズを調整してから使うようにすると改善されます。


■JTrim
jtrim.gif
写真や画像の簡単な編集加工に便利な無料ソフトです。

窓の杜「JTrim」




FlashやJavaScriptによるリッチコンテンツの使用


FlashやJavaScriptの多用は
読み込み速度の低下につながりやすくなります。


使わないのが一番なんですが、
FlashはともかくJavaScriptの方は
普通にブログで使われてますから避けるのは難しいですよね。


もしHTMLやCSSが理解でき、
使っているブログサービスでHTMLの編集ができれば、

JavaScriptの記述位置をソースの最後の方
(</body>の直前)に移動することで読者目線では改善されます。

(不具合を起こす可能性もあるので確認しながら慎重に、ね。)





普通のブログの場合は外部サービスの使い過ぎが
読み込み速度の低下の主原因になっているケースが多いと思います。


おもしろがってブログパーツや動画、外部参照バナー、
アフィリタグをなんかを貼り過ぎていると
重〜くて遅〜いサイトになってしまいます。


読者にも検索エンジンにも嫌われている、
そんなサイトにはなりたくないものですね。


必要のないものは外していきましょう。
(これぞまさに仕分けですね。^^)



最後に

サイトの読み込み速度を計測できるサービス色々です。

■webwait
http://webwait.com/

■ダウンロード時間測定
http://www.downloadtimer.com/checker.html

■ファイルサイズのチェック
http://www.kaipara.net/cgi-bin/size_check.cgi


でわ ^^)/~

ランキング参加中!応援ポチお願いします。ヾ(*´∀`*)ノ♪

にほんブログ村 デザインブログ Webデザインへ 人気ブログランキングへ
このブログの目次
 
この記事へのコメント
コメントを書く
お名前: [必須入力]

URL(任意):

コメント: [必須入力]

×

この広告は1年以上新しい記事の投稿がないブログに表示されております。