Magento eコマースストア用にPWAを開発する理由
公開: 2020-04-10世界がモバイルに向かっているので、ますます多くのビジネスオーナーが顧客にスムーズなショッピングとサービス体験を提供するために何の問題も残していません。 既存のネイティブiOSおよびAndroidアプリケーションに加えて、プログレッシブWebアプリケーションもこの業界でかなりのマージンを占めています。
ネイティブiOSおよびAndroidアプリケーションは、モバイルインタラクションを長い間サポートしてきました。PWAは、顧客がモバイルデバイスを利用する方法を完全に進化させる態勢を整えています。 非常に強力なアプリのようなブラウジング体験を備えたこの進化するテクノロジーは、今日のテクノロジーに精通した顧客の実験的な要求を吹き飛ばすように設定されています。
PWAに関する統計
スターバックスPWAは、毎日のアクティブユーザーを2倍に増やしました。 デスクトップでの注文は、モバイルとほぼ同じレートです。
英国の衣料品ブランドGeorgeは、PWAにアップグレードした後、コンバージョンが31%増加し、バウンス率が2分の1に減少し、ページビューが20%増加しました。 PWAは前のサイトより3.8倍高速でした。
PWAとは何ですか?
プログレッシブウェブアプリケーションは、モバイルウェブブラウザで実行されるJavaScriptアプリケーションです。 簡単に言うと、PWAは、Webブラウザーで実行しているときに一般的なモバイルアプリケーションの外観を提供するWebアプリまたはWebページです。 これらのPWAの作成に採用された高度なJS機能は、ユーザーエクスペリエンスの向上、訪問者のエンゲージメントの向上、および高いコンバージョン率とともに、超高速のWebページを提供します。 PWAは、Webページとネイティブモバイルアプリケーションの間のギャップを埋めます。 プログレッシブウェブアプリケーションは、ネイティブのAndroidアプリやiOSアプリなどのデスクトップに保存できます。 PWAは、APIを介してバックエンドとインターフェイスします。 バックエンドはデータベース、FTP、管理パネル、Cpanel、およびカタログで構成されていますが、分離されたフロントエンドは、顧客が表示および操作するすべてのもので構成されています。
フロントエンドPWAは、サーバーから製品の詳細などのデータをフェッチし、APIを介してカートアイテムなどのデータをサーバーに送信します。
JSは長年eコマース開発の一部でしたが、過去10年間で、ブラウザーとJSエンジンは新しいレベルの拡張に達し、アプリケーションが従来のWebページよりも優れたUIエクスペリエンスを提供できるようになりました。
プログレッシブWebアプリケーションの開発に使用される一般的なテクノロジは次のとおりです。
サービスワーカー
これらは、Webページとは独立して実行され、ネットワーク要求を傍受できるJavaScriptプログラムです。 これらはWebワーカーと同じですが、異なるブラウザータブで同時に実行されているメインスレッドからアクセスできます。
キャッシュAPI
名前が示すように、PWAが支援する要求/応答オブジェクトのタイプをキャッシュします。 これは、ネットワーク要求とその応答を保存および取得するためのシステムです。 これは、Service Workerがネットワーク要求をキャッシュして、オフライン中でも適切な応答を提供できるようにするために作成されました。
Webプッシュ通知
Webプッシュ通知は、Webアプリケーションからの通知またはメッセージです。 Webアプリケーションがブラウザーで実行されていない場合、顧客はブラウザー、デスクトップ、またはモバイルデバイスでそれらを取得します。
Webアプリマニフェスト
Web App Manifestは、モバイルブラウザにPWAについて、およびユーザーのデスクトップまたはモバイルデバイスにインストールした場合の応答方法を通知するJSONファイルです。
Magento eコマースストア用にPWAを開発する理由
Magentoは、eコマースアプリケーションを開発するための最も好ましいプラットフォームの1つです。 2018年、このプラットフォームはPWAスタジオを導入することで、その帽子にもう1つの羽を追加しました。
Magento PWA Studioは、Magentoで構築されたWebサイト用のプログレッシブWebアプリケーションの設計に特に重点を置いています。 MagentoとPWAはどちらも、eコマースアプリケーションに多くのメリットをもたらします。 PWAスタジオを使用すると、eコマースサイトをPWAアプリに簡単に変換できます。
MagentoアプリケーションのPWAを開発することの大きなメリットのいくつかを次に示します。
アベイルズMコマース
現在、人々は定期的な買い物にモバイルデバイスを使用することを好みます。 実際、レポートによると、2019年にはeコマースの28%がモバイルを使用して行われ、16億人がモバイルデバイスを使用して世界中で買い物をしています。 モバイルを介したショッピングに対するこの好みは、Mコマースまたはモバイルコマースを生み出しました。 ただし、すべての企業がeコマースストアの開発後にモバイルアプリケーションを開発できるわけではありません。 これは、PWAアプリケーションが役立つところです。 PWAアプリケーションは、eコマースサイト用のモバイルアプリを入手し、アプリの開発、保守、およびその他のコストを大幅に節約するためのコスト信頼性の高いソリューションを提供します。
デバイスの制限と高速インストールの問題はありません
すべてのPWAは、HTML、CSS、およびJSで記述されています。つまり、Web接続があります。 したがって、ユーザーはWebブラウザーでPWAにアクセスできます。 Google Chrome、Mozilla Firefox、Safariなどのすべての主要なWebブラウザはPWAをサポートしています。
これに加えて、PWAはアプリのインストールにかかる時間を節約します。 ネイティブのiOSまたはAndroidアプリとは異なり、数回タップするだけでPWAを画面に配置できます。 また、PWAは、ネイティブアプリやクロスプラットフォームアプリと比較して、はるかに少ないスペースを消費します。 つまり、PWAは、顧客がストアを簡単に閲覧できるため、デバイスの制限を取り除きます。 PWAを使用すると、すべての主要OSの任意のデバイスでMagentoeコマースをロードして共有できます。
また読む: Magento 2PWA-プログレッシブウェブアプリインストールガイド
よりよい性能
Googleは、次のように述べています。「ユーザーの53%は、読み込みに3秒以上かかるとサイトを放棄します。 そして、ロードされた後、ユーザーはサイトが高速で、スクロールがぎこちなく、応答が遅いことを期待しています。」 PWAは、メインのブラウザースレッドとは別に実行され、アセットのキャッシュをアクティブに制御するJSファイルであるサービスワーカーを利用するため、従来のネイティブアプリよりもはるかに優れた速度とパフォーマンスを提供します。
より高いコンバージョン率
Androidアプリを介したショッピングの一般的なユーザーフローは次のとおりです。-
GooglePlayStoreを開く->アプリを検索-> [インストール]-> [アクセス許可を受け入れる]-> [ダウンロードして待つ]-> [使用する]をクリックします
従来のユーザーフローとは異なり、PWA変換フローははるかに短くなります。-ブラウザを開く-> URLにアクセス->そこで買い物を開始するか、ネイティブポップアップのホーム画面に追加します。 PWAをダウンロードする必要はないことを常に覚えておいてください。 PWAは、ユーザーがホーム画面に追加することなく、モバイルWebブラウザー内のすべての機能を提供します。
オフラインモードを提供する
ブラウザはPWAをキャッシュでき、オフライン時に使用できます。 インターネットに接続していなくても買い物客が商品を確認できるので、商品カタログを持っている企業に最適です。 ユーザーのエンゲージメントを高め、売り上げを伸ばします。
非常にSEOにやさしい
あなたのeコマースサイトがトップ3のGoogleの結果でその位置を確保することは非常に重要です。 これは、MagentoアプリケーションをPWAに変換することで簡単に実現できます。 インデックス可能なWebページとして機能し、アプリのようなエクスペリエンスを顧客に提供します。
簡単に言えば、PWAはアプリだけでなくウェブサイトの複数の目的を果たします。 それは非常に短い時間でロードされ、あなたのウェブサイトをより良いランキングにします、そしてもちろん、より高いランキングはあなたのビジネスの可視性を高めることができます。
収益にやさしい
最後になりましたが、PWAは多くのお金を節約し、ネイティブまたはクロスプラットフォームのアプリケーションに費やす必要があります。 アプリをアップロードするためのGooglePlayストアの1回限りの料金は25ドルです。 アプリの販売またはGooglePlayプラットフォームを介したアプリ内での支払いのいずれかの取引手数料には、30%の取引手数料がかかります。
Appleのアプリストアにいる間、アプリケーションを公開および保守する権利に対して、年間99ドルを支払う必要があります。 Appleはまた、アプリの販売とアプリ内購入に30%の手数料を取ります。 PWAはこのコストを節約します。
PWAの恩恵を受けたブランド
成功する企業は、今後登場するすべてのテクノロジーを活用します。 大小を問わず、すべての企業は、顧客の大部分を失い、より多くを獲得しないように、自社のWebサイト用のPWAの開発を開始しました。 最もデジタル的に進んだ企業のいくつかは、すでにPWAを最大限に活用しています。 これらの名簿は次のとおりです。
ツイッター
Twitterは、TwitterLiteプラットフォームにPWAテクノロジーを使用しています。 2017年4月に、Twitterにログオンするすべての人のデフォルトのモバイルWebエクスペリエンスになりました。つまり、1日あたり1億に相当します。 ユーザーエンゲージメントを高め、データ消費量を削減します。
- セッションあたりのページ数が65%増加
- 送信されるツイートが75%増加
- バウンス率が20%減少
Uber
UberのPWAを使用すると、Uberアプリをダウンロードしてインストールしなくてもタクシーを予約できます。 Uberは2秒未満でロードできるPWAテクノロジーを採用しています。これは、Googleのランキングに不思議に思うでしょう。
フリップカート
2015年、Flipkartはモバイルのみの戦略を採用しました。 同社は、モバイルサイトをシャットダウンし、モバイルアプリのみに焦点を合わせた後、悪影響を及ぼしました。 PWAを採用した後、フリップカートは現場での時間を3倍にしました。 現在、ユーザーはFlipkart Liteで平均3.5分を費やしていますが、以前のバージョンでは70秒でした。 また、再エンゲージメント率が40%高く、コンバージョン率が70%高くなっています。
アリババ
eコマースの巨人の1つであるAlibabaは、サイトにPWAを採用した後、ブラウザ間でのエンゲージメントが増加していることを確認しています。 総コンバージョン数は76%増加しました。 「ホーム画面に追加」プロンプトを表示すると、ユーザーは他のモバイルユーザーの4倍の頻度で再エンゲージします。
フォーブス
最も本格的なグローバルメディア企業の1つであるフォーブスも、超高速で高速な読み込み機能のためにPWAを採用しています。 彼らの従来のモバイルブラウザエクスペリエンスは、平均してロードするのに3〜12秒かかりました。 現在、PWA techがインストールされている場合、0.8秒です。
ワシントンポスト
はい、あなたはそれを正しく聞きました。 アメリカを代表する新聞の1つもPWAを選択しています。 トラフィックの55%近くがモバイルデバイスからのものです。 PWAでは、1日あたり1,000を超える記事を公開でき、平均読み込み時間は400ミリ秒です。 また、7日以内に戻ってきたモバイル検索ユーザーも63%増加しています。
つまり、結論として、Magentoeコマースストア向けのプログレッシブWebアプリケーションは、ユーザーエンゲージメントと売上高を大幅に向上させることができると言えます。 したがって、PWA開発サービスを提供するeコマース開発会社を雇うことはあなたのビジネスにとって素晴らしいアイデアです。