2017 年に最も効果的なウェブサイト パフォーマンス最適化のトリック

公開: 2017-11-09
第一印象は、印象を決める唯一のチャンスかもしれません。

ほとんどすべてのビジネスは、増え続けるオンライン コミュニティへのリーチを促進する Web サイトを誇っています。 ただし、すべての企業が Web サイトのパフォーマンス最適化の重要性を真に優先しているわけではなく、フランチャイズのリーチを定義する能力が損なわれています。

それに加えて、ウェブサイトの訪問者は、特にオンライン競争が日ごとに激化するにつれて、せっかちになり、要求が厳しくなります。

2015 年の FEVAD (Federation of E-Commerce and Distance Selling)は、インターネット ユーザーのほぼ 57% が Web サイトの読み込みを 3 秒以下で行う必要があると述べています。

実際、ロードに時間がかかる Web サイトは、どのユーザーからも最も優先度が低いというのは常識ですよね?

その質問を自問してください。

企業は、あらゆる企業の構成要素である顧客に大きく依存しており、ブランドが顧客に有利であることを知る必要があります。 彼らは待ちたくないのです。

不快な印象は、特に急速に広まる不満足なレビューを生み出し、その結果、トラフィックと最も重要なお金を失います。

Amazon は、サイトが 1 秒遅くなると、年間約 16 億ドルの売上損失につながる可能性があると述べています。

テクノロジー大手の Google は、トラフィックが20% 減少し、読み込み時間が 0.5 秒遅れた代償を払いました。

確かに時は金なりですね。

インターネットにはほぼ同様の目的を果たすウェブサイトがあふれているため、サイト内で完璧なバランスを取り、視聴者を喜ばせ、トラフィックを生成し、目的を果たすことができるようにする必要があります.

website speed

この世界のすべては変化する可能性があります。

統計的に言えば、 Mozilla がページ速度をほぼ 2 秒上げたときに、ダウンロードの 15.4% の増加が記録されました

Kinstaは、「人々は、関連性の高いページの読み込みが遅いよりも、些細なページの読み込みが速いことを好む」と述べています。

トップを維持するには競合他社を追い越す必要があるだけなので、これは大きな難問ではありません。

誰かウサイン・ボルトに電話して!

でも!

ウェブサイトをコーディングするのにジャマイカの戦略はまったく必要ありません。競合他社に先んじて、世界中の視聴者の間でページを後押しするためのヒントとコツをいくつか紹介したからです。

後で感謝することができます。

どうぞ:

これらを一気に実装するのは面倒なので、一つ一つステップを踏んでロード時間の違いを分析した方が良いでしょう。

むやみに真似するのではなく、理解してから実践することが肝要です。

01. ミニマルに

Web ページを整理して、目に優しく、できるだけ無駄を省きます。 余分な行、改行、画像、その他の不要な道具は無駄になります。

extra lines, line breaks,

AppleAudiなどの数十億ドル規模の企業のホームページからインスピレーションを得て、その構造化方法を分析します。

インスピレーションと盗作の微妙な境界線を理解していただけると思います。

02. 画像の最適化

写真は本質的に千の言葉よりも価値があり、確かにそれだけの重さもあります。

2016 年の HTTP レポートによると、「ウェブページの重量の 64% は画像だけで占められています。 」 それは確かに物事を大局的に見ています。

image seo, image optimization

あなたも気づいているでしょう、画像にはもっと時間がかかります。 今、私はあなたにそれを言う必要はありませんでしたよね?

それで、あなたは何ができますか?

  • 実際に重要な場所にのみ画像を挿入することを選択します。品質を優先する場合は JPEG を選択し、ロゴなどの重要度の低いものには PNG を使用します。BMP や TIFF はダメです。
  • 対応する要件に基づいて画像のサイズを適切に設定することで、帯域幅に負担をかける不要なジャンク データの形成が抑制されます。
  • SmushitJPEG/PNG Stripperなどのツールを使用すると、ボタンをクリックするだけで簡単に最適化できます。

03. CSS配信の最適化

少し前まで、Web ページの最適なサイズは、画像やテキストなどのすべての要素を含めて約 30KB であると考えられていました。

CSS と JavaScript の出現により、この 30KB の壁が近代化されて打ち破られ、ユーザーにより多くの充実したエクスペリエンスが提供されました。

ccs, delivery optimization, ccs blocks

「速記」方式を使用してコードを読み取るサイクルを減らすことで、配信の速度を最適化できます。 基本的に、冗長性は問題外にします。

ページを内部スタイル シートにレンダリングする前にロードできる外部スタイル シートを優先することも役立ちます。 それはすべて、「コーディングのスペシャリスト」がどのように取り組むかにかかっています。

複雑なスクリプトと冗長なコード行を減らします。 公平に思えますよね?

04.圧縮技術

CSS と Javascript は、実際には複数の方法で最適化できます。 以前、配信システムについて説明しました。

 compression strategies

それでは、それらをそのまま圧縮する方法を見てみましょう。

  • CSS と JavaScript を縮小して圧縮し、その後 CSS と JavaScript を組み合わせてその間の空白を削除します。
  • その他には、 CSS OptimizerClean CSSなどが含まれます。
  • GZip 圧縮は、類似したコード要素を見つけて一時的に短い文字と交換することで支援します。

注意: Gzip を使用して画像や PDF などを圧縮すると、新しいファイルが以前のバージョンよりも大きくなる可能性があります。 また、古いブラウザのサポートは保証されない場合があります。 (ちなみに誰が古いものを使っていますか?)

05.「404エラー」

これはコーダーの間ではよく知られていることであり、彼らが恐れていることでもあります。 ファイルやページが見つからない場合にポップアップします。

単純に思えるかもしれませんが、典型的な 404 エラーが配信されるには、約 50 ~ 100 MB のメモリが必要です。 消化しにくそう? 私はそれが人々が恐れていることだと言いました。

404-error Page

プラグインは、この種のエラーをチェックしてデバッグするためのさまざまな方法を提供しますが、サーバーに長時間とどまり、対応する各サーバーのリソースを浪費します。

そのため、 Screaming Frogなどのツールを使用してクロールし、エラー ページを特定して修正することをお勧めします。これにより、帯域幅を浪費しすぎず、訪問者の無駄を減らすことができます。

Visual SEO StudioWildShark SEO Spider Toolがあります。これらは Screaming Frog のフリーウェアの代替品です。

06. アセットのオフロード

これにより、CSS や画像などのコンテンツをメイン サーバーから分離し、それらの読み込みを他のサーバーに依存することを意味します。

これにより、単一のメインサーバーへの依存が軽減され、他のサーバーにオフロードされるため、ページの読み込みにかかる時間が短縮されます。

dedicated hosting, offloading assets

共有は確かに思いやりがあります。

また、ニーズに合わせていくつかのオフロード サイドを提案します。

  • FlikrSmugmug 、5– 画像
  • Google フィードバーナー– RSS
  • アンケート – SurveyMonkeyには、いくつか例を挙げるだけでもあります。

専用ホスティングを利用することもできます。これは少し高価ですが、共有ホスティングよりもはるかに高速です.

07. サーバーの最適化

server optimization, apache optimization

より多くの RAM とキャッシュ サイズを備えたより優れたサーバーを選択すると、必然的にパフォーマンス インデックスが向上します。

定期的なソフトウェア更新とミラー サーバーの作成により、サーバー間の負荷が分散され、アクセス時間が短縮されます。

08. プラグインの使い方

server crashes

不要なプラグインは、複数のサーバー クラッシュの餌食になるだけでなく、読み込みに時間がかかります。

「あの」ウェブサイトで見た「素晴らしい」トランジションまたは要素が、常に正しい選択であるとは限りません。

要素を賢く選択してください。

09 デバッグ

debugging, coders beware

コーダーは注意してください! 皆さんはこれに完全に関係しているでしょう。

わずかな間違いでさえ、セミコロンに見積もると、メモリ ダンプの問題が発生し、サイトとサーバーの両方がクラッシュする可能性があります。

行が問題を引き起こさず、Microsoft Visual Studio のようなデバッグ アプリケーションを使用することが長期的に役立つと確信できるまで、繰り返しコードをレンダリングします。

10. 速度テスト

複数のプラットフォームで、ウェブサイトの読み込み速度を評価し、他のサイトと比較してサイトの読み込み速度を判断する速度テストが提供されています。

また、問題が存在する場所に関する必要な情報を提供するのにも役立ち、サイトの側面を変更するためのアドバイスを提供するものもあります.

PingdomGTmetrixなどのサイトをいくつか挙げると、

speed tests, speed test google

圧倒されたら、ただ深呼吸してください。 Dropbox 、Apple、Microsoft などの数十億ドル規模の企業の開発者も同じことを経験しています。

本当です、本当にそうです!

彼らは今でも修正を加えており、最適化は分刻みで行われています。 彼らは成功のマントラを複製したくはありません。

もちろん、技術に詳しくない人のために、Web ページの最適化などに関連する作業をアウトソーシングできるプラットフォームを紹介します。

当社のPrime One Globalがこれを処理し、最終的には、顧客だけでなくクライアントのニーズにも対応する Web サイトを自慢できます。 詳細については、 [email protected] までご連絡いただくか、Facebook ページでお問い合わせください。

行く前に!

これらはすべて複雑に聞こえるかもしれませんが、それが Web サイトのしくみです。 強化された最適化に関連する技術を知る必要があります。

重要なポイントを締めくくると、顧客は読み込み速度が最適であることを要求し、そのために最小限のデザインに固執し、用途に基づいて画像形式を選択します

見込み客の視点から考えてみてください。 ウェブサイトが読み込まれるまで長い間待ちますか?

もちろん違います。

今日でも忍耐は美徳ですが、私たちはそのほとんどすべての面でデジタル化された世界に住んでいるため、先を行くためには変化を受け入れる必要があります。