8のヒントあなたのウェブサイトをスピードアップする

書かれた記事:
  • インバウンドマーケティング
  • 最終更新日:Nov 02、2018

私が確信していることが他に何もない場合でも、確かにあなたの人生で少なくとも1つの痛いほど遅いウェブサイトに遭遇しました。 それはおなじみのようですが、ここ数年で私が獲得したいくつかのヒントをあなたのウェブサイトをスピードアップするのに役立ててください。

あなたのウェブサイトの速度があなたにとって重要であるかどうかわからない場合は、サイトが読み込まれるのを待っている間にブラウザウィンドウを閉じた時間を考え直してください。 実際には、53%の人がウェブサイトを放棄して3秒以上の時間がかかることがあります。

あなたのウェブサイトのパフォーマンスは重要であり、それは 検索エンジンランキングに影響を与える。 たとえば、Googleは高速のウェブサイトを好んで検索結果に上位のランキングを付けます。

異なる業界での平均ウェブページ読み込み時間(source).

サイトの速度をテストする

まず、サイトの読み込み速度をテストします。 いくつかの推奨ツールは次のとおりです。

  • WebPageTest:一般的なオペレーティングシステムを実行する実際のブラウザからWebページのパフォーマンスを収集します。
  • Pingdomの:ウェブサイトのパフォーマンスを分析し、ボトルネックを見つけるのに役立ちます。
  • GTmetrix:ウェブページのスピードを最適化する最適な方法を分析し、実用的な洞察を提供します。
  • Bitcatcha:8カ国のサイト速度を確認します。
サイトスピードテスターを使用すると、現在のサイトの最適化の程度を知ることができます。

ここにあなたのウェブサイトをスピードアップするためのヒントです...

1。 素晴らしいWebホストを選択する

私の経験では、ウェブホスティングは、おそらく最も独特に重要な選択肢の1つです。 ウェブホストがあり、そこには 優れた ウェブホスト。 各Webホストにはさまざまな機能がありますので、独自のキャッシング技術、ソリッドステートドライブ、重要領域の制御などの重要な項目については、 nginxの.

私は十分にこれを強調することはできません。 Webホストの選択は非常に重要です。 あなたがそれらに精通していない場合は、 トップのWebホストの包括的なレビュー 十分な情報に基づいた決定に導くのに役立ちます。

2。 細分化:より小さい方が良い

今日のウェブサイトでは、JavascriptやCSSファイルがあふれているのが一般的です。 訪問中に大量のHTTPリクエストが生成されるため、サイトの速度が大幅に低下する可能性があります。 これがミニン化が起こる場所です。

JavascriptファイルとCSSファイルのサイズを小さくするには、すべてのスクリプトを(各タイプの)単一のファイルにまとめてください。 これは簡単な作業ではありませんが、心配する必要はありません。あなたのためにこれを処理できるWordPressプラグインがあります。

次のいずれかを試してみてください: Autoptimize, 高速ベロシティを縮小する or Merge + Minify + Refresh

細分化によってコードがすべて混乱して見える可能性があります - 気にしないでください! これは正常です。

3。 KISSの原則に従う

これは、通常、ほとんどのウェブの達人によって教えられているものではありませんが、私はそれが非常に多くの点で非常に有用であることがわかりました。 KISSは頭字語です。「シンプルで馬鹿だよ」 シンプルなシステムの効率性を重視した1960のスマートチャップによって、

経験則として、これは人生のほとんどすべてに適用され、ウェブサイトの設定にも適用されます。 過度に複雑な実装や設計を避けることで、迅速かつ重要なことに、管理と保守が簡単なサイトのメリットが得られます。

デザインとビジュアル

あなたのデザインとビジュアルをシンプルに保つことによって、私は主にオーバーヘッドを減らすという形をとっています。 巨大で息を呑むような画像や魅力的なビデオのサイトは、悪い一日のように素人のようにすぐに読み込まれる可能性があります。 それをすっきりと整えて、さまざまなページにビデオと画像の読み込みを分割しようとします。

コードとプラグイン

WordPressは非常にモジュラーで使いやすいので、すばらしいことです。 あなたが何をしたいのかにかかわらず、誰かが 既にそのプラグインを設計しました.

それが刺激的なので、プラグインでサイトを過負荷にすることに注意してください。 それぞれのプラグインは、さまざまな人々(そしておそらく異なる企業)によって設計されていることに注意してください。 その目的は、サイトのパフォーマンスを合理化するのではなく、特定の目的を達成することです。

可能であれば、あなた自身で管理できるもののプラグインを避けてください。 たとえば、テーブルにテキストを挿入するのに役立つプラグインを考えてみましょう。 そのためにプラグインを使わなくても、テーブルを描画するための基本的なHTMLコードを簡単に学ぶことができます。

いくつかの個別のプラグインはサイトの速度を大幅に低下させる可能性がありますので、新しいプラグインをインストールするたびにスピードテストを行ってください。

4。 コンテンツ配信ネットワークの活用

私にとっては、コンテンツ配信ネットワークは神からの贈り物です。 例えば、 CloudFlareのLimeLightネットワーク 世界各地にあるサーバーのネットワークを通じて、他の人々が安定したコンテンツ配信を楽しむことを可能にし、生きていきます。

CDNを使用すると、世界中のどこから来ても、Webページの配信速度が向上し、読み込み速度が向上します。

それとは別に、CDNを使用すると、 分散型サービス拒否(DDoS).

あなたが小規模なウェブサイトの所有者であれば、Cloudflareには、うまく動作する無料のオプションがあります。 企業や大規模なサイトでは、より良い計画を立てるために支払う必要がありますが、CNDの妥当性を考えれば、それは価格の価値があります!

5。 キャッシングを利用する

静的なファイルを保存することで、訪問者が来たときにサイトが以前構築したページから共有できるようになり、処理時間が短縮されます。 ほとんどの場合、関心を持つ必要があるのはサーバー側のキャッシュです。

サーバー側のキャッシュを実装する最も効率的な方法は、 アパッチ or nginxの サーバ。 これらのドキュメントを調べて、サーバーのキャッシュ設定に役立つ適切な設定を見つける必要があります。

経験則は、サーバーサポート作業(処理)を多く必要とするものは、可能な限りキャッシュする必要があるということです。

あまりにも奇妙な場合は、プラグインは別のオプションですが、私はこの場合、あなたはそれに頼らないことをお勧めします。

6。 画像豚の帯域幅、あなたの最適化!

これは、KISSの原則に基づく大規模な画像や動画に対する私の初期の暴言に対する少しの拡張です。 それを考えると、私はビジュアルがサイトをきれいに見せるための鍵であることを理解しています。 その使用を完全に避けることはできないので、使用するイメージができるだけ合理化されていることを確認しましょう。

Webコンテンツは、たとえ画像であっても、ほとんどの場合基本的なものです。 私が瀕死の豚のような負荷に遭遇したウェブサイトの大部分は、実際の目的を果たしていない大量の画像によって引きずられます。

私はあなたが大きな画像を持つことはできませんが、それらをアップロードする前に適切に最適化されていることを確認していないわけではありません。

これを行うには2つの方法があります。 繰り返しますが、最初はプラグインのようなものです WPがどんな。 代わりに、またはWordPressを使用していないユーザーは、サードパーティの画像最適化ツール 画像圧縮 or JPEGオプティマイザ.

ほとんどの画像最適化ツールでは、画像の解像度の詳細を細かく調整できるので、徐々に色を落とすことができます。 彼らは訓練されていない目にはほとんど同じように見えますが、サイズははるかに小さくなります。

これらは、HD画像の領域を拡大して表示します(左)。 オリジナルは2.3MBで、最適化後は331kbに縮小されました!

7。 gzip圧縮を使用する

画像圧縮やアーカイブ(ZIPやRAR)について聞いたことがあるなら、おそらくgzip圧縮の理論に精通しているでしょう。 これによりウェブサイトのコードが圧縮され、300%までの速度向上が得られます(結果は異なります)。

このような技術的なものであっても、あなたはすぐに行き、次のようなプラグインを使うことができます PageSpeed Ninja。 しかし、一度.htaccessファイルを編集するだけで、ずっと効率的な方法があります。

下のコードを.htaccessファイルに追加すると、次のように設定されます:

<IfModule mod_deflate.c>#HTML、CSS、JavaScript、テキスト、XMLおよびフォントを圧縮します。AddOutputFilterByType DEFLATEアプリケーション/ javascript AddOutputFilterByType DEFLATEアプリケーション/ rss + xml / x-font-opentype AddOutputFilterByType DEFLATEアプリケーション/ x-font-otf AddOutputFilterByType DEFLATEアプリケーション/ x-font-truetype AddOutputFilterByType DEFLATEアプリケーション/ x-font-ttf AddOutputFilterByTypeディレクティブDEFLATEフォント/ TTF AddOutputFilterByTypeディレクティブDEFLATE画像/ SVG + XML AddOutputFilterByTypeディレクティブDEFLATE画像/ X-アイコンAddOutputFilterByTypeディレクティブDEFLATEテキスト/ CSS AddOutputFilterByTypeディレクティブDEFLATEテキスト/ HTML AddOutputFilterByTypeディレクティブOTF / XML AddOutputFilterByTypeディレクティブDEFLATEフォント/ OpenTypeのAddOutputFilterByTypeディレクティブのDEFLATEフォントは/テキスト/ JavaScriptをDEFLATE AddOutputFilterByType DEFLATEテキスト/プレーンAddOutputFilterByType DEFLATEテキスト/ xml </IfModule>

*注:.htaccessファイルに現在ある内容を以下のコードに必ず追加してください。

8。 リダイレクトの削減

通常、ブラウザはさまざまな形式のアドレスを受け入れ、サーバによって認識された公式アドレスに変換されます。 たとえば、取る www.example.com and example.com。 どちらも同じサイトに行くことができますが、サーバーは正式に認識されたアドレスにリダイレクトする必要があります。

そのリダイレクトには時間とリソースがかかります。そのため、リダイレクトを1回してもサイトに到達できるようにすることが目的です。 これを使って リダイレクトマッパー あなたが正しいことをしているかどうかを確認する。

この権利と時間を継続的に実行することの複雑さを考えれば、これは私のようなプラグインを使用することをお勧めしたい リダイレクション.

より速いウェブサイトは訪問者(およびGoogle)を幸せにします

今日のブロードバンドのスピードは、モバイルでもそれほど増えており、ますます増えています。 つまり、ウェブサイトの所有者が、遅いローディングサイトを利用して訪問者を抱かせるという言い訳はほとんどありません。

私を信じて、あなたは失っていくでしょう。ある時点で、あなたが「ああ、 THAT ウェブサイト "。 あなたがオンラインビジネスをしているなら、自分のゴールデングースを殺してしまうので、それはさらに悪化します。

私が提供した上記の8のヒントは決してすべてで終わるわけではありませんが、それはあなたに少し良いものを管理する方法のスタートといくつかのアイデアを与えるはずです。 今日あなたのウェブサイトをスピードアップし、顧客や訪問者を維持してください。

終わらないように THAT ウェブサイト。

ティモシーシムについて

ティモシー・シム(Timothy Shim)は、作家、編集者、テクニカルオタクです。 情報技術分野でキャリアをスタートした彼は、急速に印刷物を見つけ、ComputerWorld、PC.com、Business Today、The Asian Bankerなどの国際、地域、国内メディアのタイトルを扱ってきました。 彼の専門知識は、消費者だけでなく企業の観点からも技術分野にあります。

接続します。