Top Trends in Cybersecurity for 2024 | 
eコマースにおける競争が激化するにつれ、小売業者は目立つ新たな方法を模索しており、競争の激化がテクノロジーに向かって着実に進んでいる。 マルチチャネルの出現により、カスタマージャーニーは非常に複雑になったが、1つ確かなことは、スピードがこれまで以上に重要であるということだ。 Googleが最近発表した「ページエクスペリエンス」という新しいランキングアルゴリズムは、ユーザーがどのようにウェブページを操作したかを判断するために設計されている。これは、ユーザーがページを読み込んだときの速度である知覚速度を重視していることを示している。
eコマースの新しいカスタマージャーニーは瞬時に実現。 閲覧者の53%は、読み込みに3秒以上かかるとモバイルウェブサイトを放棄する。 同時に、読み込み時間の1秒ごとの遅延は、コンバージョンの7%の低下にリンクされている。 新しい技術によって、以前は不可能だったウェブサイトの速度が可能になっている。 最新のポータブルフロントエンド、サーバーサイドレンダリング(SSR)、アクセラレーテッドモバイルページ(AMP)、最新のCDNテクノロジーの組み合わせにより、1秒未満のページ読み込みは可能ではなく、eコマースにおける新たな競争の場となっている。
目次
- eコマースにおけるウェブサイトの速度の重要性
- スピード=お金
- AMPとは何か、どのように機能するか
- 小売の新興企業は数十億ドル規模の競合他社を上回っている
- SSRとは何か、どのように機能するか？
- 最新のCDNとエッジコンピューティングとは
- 概要
eコマースにおけるウェブサイトの速度の重要性
ウェブサイトの速度は、可視性(SEOとSEM)からトラフィック、ユーザーエクスペリエンス、最終的にコンバージョンと収益に至るまで、デジタル戦略全体に影響を与える。 これは、Googleがモバイルとスピードに重点を置くようになったことによるものである。
この検索大手は、ウェブサイトの速度が重要であることを明確にするために、10年に及ぶ調査を行ってきた。 彼らは、検索結果とSEMで上位にランクインするために不可欠なモバイルウェブサイトの速度の重要性を固めるために、モバイルに焦点を当てた複数のアップデートを展開した。
これらの取り組みには、2016年のモバイルファーストインデックス、2017年のモバイル広告付きAMP、2019年のスピードアップデート、2021年初頭に公開予定のページエクスペリエンスランキングアップデートなどが含まれる。 最後に、Googleの恥のバッジはすぐにロールアウトし、悪名高い遅いウェブサイトにフラグを立て、検索エンジン結果ページ(SERP)からサイトに移動しているユーザーに警告する。
公平に見て、サイト速度の役割を強調するためにアルゴリズムの変更やウェブサイトの恥を流すことは別として、Googleはより高速なウェブを実現するためのさまざまなツールも作成している。 これには、PageSpeed Insights、AMP、Impact Calculator、Mobile Speed Scorecardなど、ウェブサイトの速度を促進し測定するためのさまざまなツールが含まれる。
出典:個人用サイトのテスト
GoogleのTest My Siteはあなたの場所の迅速な監査をし、場所の速度の推薦が実施されれば年次収入の潜在的な影響を推定することを可能にするツールである。
検索の58%、広告収入の65%がモバイルからのものであるため、これらのツールを作成する努力はGoogleの興味にある。
1対1のデモをスケジュールする
コンサルティングカンバセーションをスケジュールして、Edgio (Layer0) XDNを使用して1秒未満のページロードを実現する方法を学習する。 ここをクリック！
スピード=お金
ウェブサイトの速度は顧客体験と収益、特にモバイルデバイスに影響を与えることは周知の事実である。消費者の70%は、サイトの速度が購入意欲に影響を与えると述べている。 Amazonは、ページ読み込みが1秒遅れると年間16億ドルの収益損失が生じると試算した。 より多くを販売するためには、訪問者がどこにでも、例えば、あなたのプロダクトリストかプロダクト記述ページ、内容はすぐにそして容易にロードすることを保障しなければならない。 同様に、支払いプロセスは速く、簡単であるべきである。 これは再エンゲージメントのための基礎を築き、バイヤーはあなたからのより多くを買い、戻って傾向があるようにする。
しかし、現状では、スピーディーなモバイル体験の提供が難しくなっている。 過度に最適化された肥大化したウェブサイトに加えて、サイズの大きな画像と乱雑なコードを含むモバイルページは、平均214件のサーバーリクエストを行っており、そのうち100件は広告関連である。 その結果、モバイルデバイス（4G）では平均ページの読み込みに15.3秒かかる。 競争の激しい小売業者の中には、モバイルページの読み込み時間をわずか3~5秒に短縮できるものもあるが、まだ改善の余地がある。 そして、これは5Gが解決できる問題ではない。
広告、パーソナライゼーション、分析、トラッキング、優れたユーザーエクスペリエンスの間の妥協の余地のない妥協
スピードの基盤
最初のページ読み込みを高速に行うための最初の構成要素は、検索トラフィックにAMPを使用し、他のチャネルにSSRを使用することである。 2番目のステップは、後続のページロードを非常に高速にすることである。 これはProgressive Web Apps (PWA)のような、速度のために構築されたポータブルフロントエンドで行われる。 最後の柱は、ページロードからミリ秒単位で絞るエッジコンピューティング機能を備えた最新のCDNである。
実際、Googleは理想的なカスタマージャーニーを推奨している。ウェブサイトは最初にユーザーを検索するためのAMPページを提供し、その後のページでサイトの完全なPWAバージョンに移行する。 小売業者のウェブサイトのトラフィックの半分近くがオーガニック検索から来ているので、AMPとPWAの両方をサポートすることは理にかなっている。
このトピックはGoogle I/O 2017で広く議論された。
PWAを使用することで、開発者はネイティブアプリに匹敵する魅力的で超高速な体験を提供できる。 しかし、検索生成トラフィックに関しては、AMPは読み込み時間の中央値が0.5秒である可能な限り最速のオプションである。
したがって、一言で言えば、SERPの上位に登るには、高速な最初のロードのためのAMPとSSRと、超高速のブラウジング遷移のためのPWAの組み合わせが必要である。 問題は、企業のeコマースWebサイトにSSRサポートを追加する必要があるため、言うほど簡単ではないことである。SSRサポートは単独で複雑な作業であり、PWA用の2つの別々のWebサイト(通常はReact、Angular、Vue、Next、またはNuxtで書かれている)とAMP HTMLで書かれた別々のWebサイトを維持する必要がある。
AMPページはCDN (Content Delivery Network)によってプリフェッチ、プリレンダリング、キャッシュされるため、非常に高速である。 GoogleのAMPキャッシュはほとんどのAMPページを配信する。
そう、ウェブサイトの速度の基礎はこれらの3つの主要な要素から成っている:
SSR + AMPにより、高速な初回ロードを実現
SERPから、ユーザーは最初のページを驚くほど高速にロードするためにページのAMPバージョンに誘導される。 SSRは、Eメール、ソーシャル、紹介など、他のチャネルからの訪問者に対しても同じことを行っている。
PWAポータブルフロントエンドで超高速ブラウジングを実現
PWAは、訪問者が後続のウェブサイトページをナビゲートするときに、即座のブラウジング速度を提供するために引き継ぐ。 このようにして、消費者は、最初のページの読み込みと、最初のページを超えた瞬間的なページ遷移の強化された経験を楽しむ。
予測プリフェッチ+最新のCDN
予測プリフェッチとエッジコンピューティング機能を備えた最新のCDNにより、動的データをエッジにストリーミングし、そこからユーザーのブラウザに要求する前にストリーミングできる。 これにより、消費者が待っているものをキャッシュして提供することができる。つまり、在庫のさまざまな製品、価格、情報に変換するJSONデータ。 これは、eコマースのウェブサイトやその他のデータベース駆動型のウェブサイトが瞬時に体験を提供し、消費者のタップよりも5秒先に留まる方法である(例えば、ユーザーがリンクをクリックする前にクリックする可能性が最も高い製品説明ページをプリフェッチする)。
今私達はウェブサイトの速度の基礎を形作る3本の柱を理解したので、私達はそれぞれに深く潜ることができる。
AMPとは何か、どのように機能するか
Google AMPは、読み込み時間の中央値が500msのモバイルウェブページを作成するためのオープンソースのフレームワークである。 AMPはHTMLを単純化し、CSSとJavaScriptの厳しい制限を適用することで、モバイルウェブ上でより良い、より速い体験を作り出す。 これらのページはキャッシュされ、Googleサーバー上にプレレンダリングされるため、このようにして素早く配信される。
AMPの利点
AMPページはGoogleのSERPからのトラフィックの中央値500ミリ秒のページロードを可能にする。 これはGoogleサーバーがAMPページのリンクをクリックする前にユーザーのブラウザにAMPコンテンツをプリフェッチしてレンダリングするためである。 平均的なeコマースサイトのためにGoogleの調査(有機および支払済)は交通の約50%を占めている従ってこれらの利益はあなたの交通の大きいパーセントに適用できる。
AMPを使用しているサイトでは、直帰率が低下するという利点も見られる。ページの読み込みを待つ間に通常跳ね返る可能性があるユーザーは、超高速の体験を得られるようになるからだ。
AMP+PWAがゲームを変える方法
AMPとProgressive Web Apps（PWA）の組み合わせは、検索からカスタマージャーニー全体をカバーし、エンドツーエンドの高速化を実現する。 買い物客はGoogle SERPからAMPページをロードし、AMPページを閲覧している間に、PWAバージョンのサイトに必要なリソースをバックグラウンドでロードする。 この方法では、ユーザーがアクションを起こしたとき(例えばサイト上の任意の場所をクリックしたとき)、PWAはすでに後続のページのコンテンツをプリロードすることに先行しており、そこから残りのトランジションはすべてクライアント側でレンダリングされたブラウジングトランジションであり、新鮮なナビゲーションではない。
なぜみんなAMPを使わないのか?
AMPとPWAの組み合わせはスピードのために天国で作られた試合だが、開発面では悪夢だ。 この技術を効果的にサポートするには、フロントエンドが記述されている言語(JavascriptまたはCSSが多い傾向がある)と、AMPプロジェクトの標準に従う2つのバージョンのサイトを作成することが必要である。 バグ修正、レイアウト変更、新機能などは、AMPとPWAの両方のコードベースに伝播する必要があるかもしれない。
React StorefrontフレームワークとLayer0は、開発者がReactアプリでAMPをサポートすることをはるかに容易にする。
小売の新興企業は数十億ドル規模の競合他社を上回っている
Layer0 AMP技術を利用することで、ファッション小売業者Akiraは検索からの即時の最初のロードを提供するだけでなく、Amazon、Nordstrom、Zappos、および他の大手ブランドのキーフレーズを凌駕する。
Layer0技術を利用する前は、Akiraの最初のページの読み込みは平均4.8秒であり、その後のページの読み込みは2.5秒であった。
Akiraは、Edgio(Layer0)に組み込まれた高度な技術を利用することで、これらの結果を改善し、サブ秒のページロードを得ることができた。サーバーサイドレンダリングとAMP変換を備えたeコマースPWA、エッジで動的コンテンツのキャッシュヒット率95%以上を提供するLayer0 CDN-as-JavaScript、サーバーとAPIを最適化するフロントエンド用のLayer0のServerless JavaScriptバックエンド。
Edgio（Layer0）により、ディーラーは次のような多くの分野で即座に改善を見た。
- 最初のロード時間は70.8%減少して1秒近くになった
- ブラウジングトランジションが驚異的な500ミリ秒に低下
- Webサイトページの半分が500ミリ秒未満で読み込まれるようになった
- モバイルのコンバージョン率が37.25%上昇
ライトハウスはまた、これらの改善を反映している。アキラのパフォーマンススコアは36ポイント上昇し、ウェブ上のサイトの75%を上回り、顧客のブラウジング体験が向上した。
アニー・セルケは、ウェブサイトの速度に投資することで、小売業者が検索エンジンの結果ページを上達させるのに役立つことを示すもう一つの素晴らしい例である。
Edgio (Layer0)に飛びつく前は、家庭用品と装飾品を扱う小売業者のアニー・セルケ氏は、Googleの検索結果の折り目の上にさえ現れなかった。 今日では、オーガニックトラフィックが32%増加し、モバイルオーガニックトラフィックが40.41%増加しており、数十億ドル規模の競合他社を凌駕している。
興味があれば、アニー・セルケのケーススタディもあるので、私たちが真髄に入る。
アキラやアニー・セルケのようなオンライン小売業者にとっては、パフォーマンスの良いモバイルウェブサイトは実を結ばない。 Amazon、Nordstrom、Zapposなどのeコマース大手との絶え間ない競争に立ち向かうために必要なものである。
サイトが速くなるほど、瞬時の保証SEOのようにランクが高くなる。 Edgio (Layer0)ポートフォリオには、それを証明する多くの例がある。 Akira、Annie Selke、Shoe Carnivalは、Amazonを含む多くのビッグネームを凌駕している。
Layer0は、eコマースをスピードアップするための高度なテクノロジーの組み合わせを提供する
- サーバーサイドレンダリングのサポートとAMP変換を備えたeCommerce PWA
- 予測プリフェッチ
- CDN-as-JavaScriptエッジでの動的コンテンツのキャッシュヒット率95%以上を実現し、ウェブサイトを買い物客より5秒早く維持する。
- Layer0 Serverless -フロントエンド用のJavaScriptバックエンドがサーバとAPIを最適化。
1対1のデモをスケジュールする
コンサルティング会話をスケジュールして、Edgio (Layer0)がどのようにページ読み込みを1秒未満にするのに役立つかを学習する。 ここをクリック！
サーバーサイドレンダリングとは?
Server-Side Rendering（別名SSR）は、通常はクライアント側のみのPWAページをサーバ上でレンダリングし、完全にレンダリングされたページをブラウザに送信する一般的な手法である。 クライアントのJavaScriptバンドルが引き継ぎ、PWAは通常通り動作する。 SSRは本質的にJavaScriptページをHTMLに変換するが、これは検索クローラーとブラウザの両方がサーバー上で理解できる言語である。 これにより、ブラウザと検索クローラーが簡単にページを配信し、インデックスを作成できるようになる。
SSRを利用する主な利点の1つに、すべての検索エンジンでクロールして適切にインデックスを作成できるアプリがある。 これはSEOとソーシャルメディアチャネルへのメタデータの提供に役立つ。
SSRの利点
SSRはまた、最初のリクエストで完全にロードされたアプリがサーバーから送信されるため、パフォーマンスの向上に役立つことが多い。 しかし、単純ではないアプリの場合、SSRはセットアップを必要とし、サーバー負荷が大きくなるため、マイレージは異なる可能性がある。 ありがたいことに、同型フロントエンドやLayer0 with SSR support out-of-the-boxのようなサービスやツールがある。
最終的に、ウェブサイトにサーバーサイドレンダリングを使用するかどうかは、特定のニーズとユースケースに最も適したトレードオフに依存する。
最新のCDNとエッジコンピューティングとは
エッジコンピューティングは、コンピューティングをデータソースに近づけること、およびプロセスにおける遅延と帯域幅の使用を減らすことに焦点を当てたネットワーク哲学である。 多くの異なる技術を使うことでこれを実現できる。 計算をネットワークのエッジ(ユーザーのコンピューター、IoTデバイス、エッジサーバー)に近づけることで、クライアントとサーバー間で発生する長距離通信の量を最小限に抑えることができる。
エッジコンピューティング機能を備えたCDN コンテンツをユーザーに最も近いCDN Point of Presence（POP）にストリーミングすることで、ウェブサイトのサーバーからユーザーのブラウザまでの移動時間を短縮できる（サンフランシスコのユーザーはサンフランシスコ南部のPOPからコンテンツを配信し、ニューヨークのユーザーはブルックリンのPOPからコンテンツを配信する）。
エッジコンピューティングを備えたCDNの利点
CDNはキャッシュされたバージョンのWebサイトを複数の場所に保存して、ページの読み込みを高速化する。 それぞれのPoPには、訪問者へのコンテンツ配信を担ういくつかのキャッシングサーバが含まれている。
Layer0のCDN-as-JavaScriptはこの概念を別のレベルに引き上げる。 アプリケーションを理解するアプリケーション認識型CDN。 フロントエンド開発者がすでに知っている言語と同じ言語を使用し、キャッシュを完全に制御できる。 その結果、Layer0を使用しているWebサイトでは、エッジでの動的コンテンツのキャッシュヒット率が95%以上になる。
Layer0 CDN-as-JavaScriptのエッジコンピューティング機能は、最も可能性の高い次のページを予測的にプリフェッチし、要求される前にそれらをエッジにストリーミングすることで、買い物客より5秒早くあなたを保つ。
概要
読み込み時間が長いと、ユーザーの体験やウェブサイトの検索ランキングが台無しになる。 AMPはこの問題の一部を解決し、検索からの最初のページを驚くほど高速にする。 しかし、それは戦いの半分に過ぎない。 ウェブサイトを高速化するためには、さらに一歩進んで、より包括的なアプローチが必要である。アクセラレーテッドモバイルページ(AMP)、最新のポータブルフロントエンド、サーバーサイドレンダリング(SSR)、エッジコンピューティング機能を備えたCDNなどのテクノロジーを組み合わせたものだ。
Layer0は、複雑で動的なeコマースWebサイトが1秒未満の速度に到達するのを支援する一方で、開発速度と収益の増加を高め、DevOpsコストを削減する。 また、他のCDNではわずか15%であるのに対し、動的コンテンツでは95%以上のキャッシュヒット率を実現するCDN-as-JavaScriptも搭載している。
Layer0は、動的な価格設定とリアルタイムの在庫検索はもちろんのこと、多数のタグとスクリプトを使用して、大規模なeコマースWebサイトに一貫して500ミリ秒以下のページロードを提供する。 これらのスピードの向上は、コンバージョンの15-30%の上昇、より良い可視性、リーチ、そして最終的にはより高い収益につながることが知られている。
インスタントeコマースWebサイトで競争優位性を獲得する方法を確認するために、サイトスピードの専門家とのコンサルティング会話をスケジュールする!
