目指すは1秒以内でウェブサイトを高速化するための方法 - ソーシャルメディア集客術SEO/SMO情報

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
このエントリーをはてなブックマークに追加

目指すは1秒以内でウェブサイトを高速化するための方法

目指すは1秒以内でウェブサイトを高速化するための方法ページの表示速度が、Googleのランキングを
決める指標として日本を含むインターナショナ
ルで導入されていることが判明しています。ウ
ェブページの表示速度を高速化させる方法を紹
介いたします。

サイトを表示速度を高速化する理由


●コンバージョン率の最適化。

●カスタマーエクスペリエンスとカスタマー満足度の向上。

●直帰率を下げる。

●競争率が非常に激しいキーワードでオーガニックからのトラフィックを増やす。

●全体的な競争力を高める。

●運用費を節約する。


Googleではページスピードが検索の1%に影響していて、
ユーザーがWEBページ表示に待てるのは2秒まと発表されています。


3秒以上かかると40%以上のユーザーは離脱すると言われていて、
表示が1秒遅れるごとにコンバージョン率は7%落ちます。


さらには、表示が1秒遅れるごとに顧客満足度は16%落ちます。


画像ファイル表示を高速化してサイトのパフォーマンスを向上させる方法


いちばん簡単にできて効果が期待できるのは画像のファイルサイズを小さくすることです。


画像編集ソフトを使ってサイズを縮小できますが、
画質を損ねることなく小さくすることは初心者さんには難しいところです。


画像のファイル縮小ツールはたくさん出回っていますが、
インストールするのが面倒な場合はオンラインのツールを使うと便利です。


使用サイト:JPEGmini:JPEG画像を自動で最適化してくれます。
使用サイト:TinyPNG:PNG画像を自動で最適化してくれます。


使い方はいたって簡単でファイルサイズを小さくしたい画像を選んで、
ブラウザにアップロードするかそのままドラッグ&ドロップするだけです。


実際にJPEGminiを試してみたら、ファイルサイズが402KBのファイルを
縮小させたら縮小版は73KBまでちいさくなり60%近く縮小されました。


TinyPNGも同様に優れもので、画像によっては画質を
保ったまま70%以上もファイルサイズを縮小できます。


width属性とheight属性で表示サイズを小さくしない


本来の大きさより縮小表示させるためにwidth属性とHeight属性で指定することができますが
この方法で表示サイズを調整しないようにします。


表示は小さくても読み込む画像のファイルサイズは同じになります。


一般的に、大きさが小さくなればファイルサイズも小さくなりますので、
それなら最初からファイルサイズが小さい画像を使いましょう^^


画像ファイルを別サーバーに置く事でパフォーマンスの向上をさせます


ブラウザが1つのサーバー(ホスト)と同時に張るコネクションの数には上限があります。
※ほとんどのブラウザは1ホストにつき6コネクションがマックスらしいです。


簡単に言えば、たくさんの画像(その他の要素)があるときはすべてを
同時にダウンロードできないことがあるということです。


そこで画像だけを別のサーバーに置きます!!


もっともサーバーの高性能なら、同じサーバーの別ドメインである、
サブドメインの使用でも構いません。


CSSスプライトを使う


サイト全体で共通して使う、比較的小さな画像は1枚の画像にまとめてしまって、
必要な部分だけを切り取って表示させるCSSスプライトを使います。


HTTPリクエストの数を減らせるのでスピードアップに効果があります。


JavaScriptファイルやCSS参照ファイルを1つにまとめたりと、
HTTPリクエストを減らすのはパフォーマンス改善にとても重要です。


コーディングについて私は決して詳しくはないので
CSSスプライトの具体的な実装手順については検索等で調べてください^^


『自分のサイトが参考になる』という方がいたら教えて下さい!!』


CSSスプライトを作るのに便利そうなSpriteMeというオンラインツールがあります。



どんなサイトであれ運営している以上は、常にパフォーマンス向上に取り組みたいものでね^^


ただ必要性は感じていても何をどうやったらいいのか分からないのも実情ですので、
今回の記事ではファイルサイズの縮小のようにサイトの規模を問わず効果を期待できて
今すぐに実行できる対策を紹介させて頂きましたので、参考にしてみてください。
関連記事
このエントリーをはてなブックマークに追加
サイト作成ツールSIRIUS『シリウス』

この記事はあなたのお役に立てましたか?

もし誰かの役に立ちそうだと思っていただけたなら、下のボタンから共有をお願いします

あなたの応援のおかげで明日も頑張って記事が書けます

にほんブログ村 小遣いブログ ネットビジネスへ
コメント
非公開コメント

 

トラックバック

http://socialmagazine.blog.fc2.com/tb.php/65-bde6c93a

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。