eコマースサイトを更新するための7つのベストプラクティス

フリーランスまたはエージェンシーデザイナーとして、WordPressサイトの更新はとても楽しいことがあります。 完全なブランド探索を行ったり、Webサイトを最新化したり、クライアントを「驚かせる」ことが確実な新機能を探索したりできる場合があります。

しかし、おそらくご存知のように、更新がeコマースサイト向けである場合、実際に何かを変更する前に考慮すべきことがいくつかあります。

ダウンタイムや売り上げの損失を最小限に抑えながら、これらのサイトの更新に取り組むために、FlywheelのHappinessEngineersとAgencyPartnersProgramのメンバーからのアドバイスに基づいてこのガイドを作成しました。

このガイドの内容は次のとおりです。

1. 5つの兆候eコマースの再設計（または少なくとも重要な更新）の時期です
2. eコマースサイトを更新するときに注意する必要がある理由
3. ダウンタイムや収益の損失を回避するために従うべきベストプラクティス

5つの兆候eコマースの再設計（または少なくとも重要な更新）の時期です

クライアントが完全なサイトの再設計を要求したからといって、それが常に最良の解決策であるとは限らないことは誰もが知っています。 特にeコマースサイトに関しては、再設計する必要がない場合は、小さな更新を試してみるのが最善の場合があります（次のセクションで説明する懸念事項の一部を回避するため）。

ただし、それは再設計がテーブルから外れているという意味ではありません。 実際、それがおそらく正しい呼び出しであるいくつかの素晴らしいシナリオがあります：

1. サイトのコンバージョン率は低いです。
2. サイトのバウンス率は高いです。
3. クライアントは、サイトの機能に関する顧客からの苦情を受けています。
4. サイトが構築されているテーマまたはキープラグインは、開発者によってサポートされなくなりました。
5. あなたはこの記事を読んでいます。

1.サイトのコンバージョン率が低い

クライアントのトラフィック量は多いがコンバージョン率が低い場合は、サイトでUXの問題が発生している可能性があります。 URLをプルアップして、クリックを開始します。 おそらく、問題が何であるかをすぐに気付くことができるでしょう。

あなたが自分自身に尋ねることができるいくつかの質問：

• ナビゲーションはわかりやすいですか？
• 製品ページは明確で購入しやすいですか？
• サイトとチェックアウトのフローはモバイルデバイスで機能しますか？
• ポップアップとウィジェットは正しく表示されますか？
• カートは見やすいですか？
• クレジットカード情報を入力しても安心ですか？

サイトの再設計はこれらの問題のいくつかを修正する唯一の方法ではありませんが（そしてそれは確かにコンバージョン率を上げる唯一の方法ではありません）、特にあなたが遭遇している場合、それは根本的な問題のいくつかに取り組む1つの方法です複数の。

2.サイトのバウンス率が高い

コンバージョン率と同様に、高いバウンス率は、現在のサイトデザインに関する何かが買い物客の共感を呼んでいないことを示している可能性があります。 最大の違反者の1つ：読み込み時間が遅い。

Googleによる2017年の調査によると、ページの読み込み時間が1秒から5秒になると、バウンスの確率が90％増加します。

eコマースサイトの場合、高いバウンス率は直接収益の損失につながります。 それがあなたのクライアントのためにあなたが修正できるものであるならば、あなたは彼らにたくさんの価値を提供するでしょう（そして彼らの銀行口座にもっとたくさんのお金を）。

繰り返しになりますが、WordPressサイトを高速化する方法は再設計だけではありませんが、サイトが構築されているテクノロジーの一部が原因であると思われる場合は、再設計が必要になる可能性があります。 今がWooCommerceに切り替えるか、オールインワンのeコマースソリューションにアップグレードするのに適切な時期だと思われる場合は、これらの変更をゆっくりと展開するのではなく、1つの大きなアップデートにまとめることが理にかなっているかもしれません。

3.クライアントはサイトの機能に関する顧客からの苦情を受けています

それが文字通り壊れているなら…それは再設計のかなり良い理由です。 クレジットカード情報の入力、配送先住所の追加、またはクライアントのサイトへの他の個人データの提供などを行うことに自信を持ってエンドカスタマーを感じる必要があるため、eコマースサイトではユーザーエクスペリエンスが重要です。

あなたまたはあなたのクライアントが定期的にサイトをテストしていない場合、機能上の問題がしばらく見過ごされる可能性があります。 うまくいけば、クライアントにはフィードバックを提供することを恐れない顧客がいて、サイトの要素が壊れているか混乱している場合は、電子メールを送信したり、サポートチケットを送信したりします。

クライアントがあちこちで苦情を受け取ることに言及している場合、それはおそらく大したことではありません（または、少なくとも1回限りのバグ修正で解決できます）。 クライアントがこれらの苦情の多くに言及している場合、またはパターンがあるように思われる場合、それはより大きな問題がある可能性があり、再設計が必要になる可能性がある良い兆候です。

4.サイトのテーマまたはキープラグインは、開発者によってサポートされなくなりました

これはおそらく、このリストの再設計の最も明白な理由であり、実際には、低い変換、高いバウンス率、および機能の破損の原因である可能性があります。 クライアントのサイトがサポートされなくなったソフトウェアに依存している場合、再設計が必要になるのは時間の問題です。

ただし、テーマまたはプラグインの廃止について結論を出す前に、調査を行って何が起こっているのかを確認することをお勧めします。 プラグインまたはテーマの作成者が、クライアントが見逃した重要な更新をリリースしたか、別の会社に買収されており、サポートのプロセスが異なる可能性があります。

最終的には、新しいテーマやプラグインを使用した再設計が必要であると判断することもできますが、変更を加える前にこのコンテキストを確立しておくと、将来的に驚くことはありません。

5.あなたはこの記事を読んでいます

あなたがここにいるなら、私はあなたの腸の何かがあなたにそれが繁栄するためにあなたのクライアントのeコマースサイトのために実際に重要な更新が必要であるとあなたに言っていると思います。

あなたの本能に耳を傾けてください。

再設計の正確な目標を正確に特定する必要がありますが、必要な変更の規模に合わせてクライアントと調整する場合は、小さなパッチで回避しようとするのではなく、それを優先するのに十分な理由です。

再設計は多くの作業になりますが、根本的な問題の解決を延期するほど、作業量（および潜在的な問題）は増加し続けることを覚えておいてください。

要約すると、eコマースサイトの問題を修正する方法はメジャーアップデートだけではありませんが、特にサイトの機能やユーザーエクスペリエンスが損なわれている場合は、メジャーアップデートが必要になることがあります。 クライアントのサイトでこの位置にいることに気付いた場合は、更新を実行する前に考慮したいことがいくつかあります。

eコマースサイトを更新するときに注意する必要がある理由

明確にするために、この意味での「用心深い」は「それをしない」という意味ではありません。 Webデザイナーは、eコマースサイトを問題なく毎日更新しています。あなたもそうすることができます。

私が「用心深い」と言うとき、eコマースサイトを更新するときに考慮すべき追加のことがいくつかあることを意味します。何かを本番環境にプッシュする前にそれらについて考えると、多くの頭痛の種を減らすことができます。

ダウンタイムとは、売り上げの損失と信頼性の低下を意味します

ダウンタイムは、おそらくすべてのクライアントサイトで回避しようとするものですが、eコマースストアの場合、アップタイムは非常に重要です。 サイト訪問者がクライアントのショップにアクセスできない場合、文字通り顧客になるチャンスはなく、他の場所でビジネスを行う可能性が高くなります。

壊れたサイトは、一部の訪問者を永久に遠ざけ、ストアがハッキングされたか廃業したと思わせる可能性さえあります。

プレッシャーをかけることはありませんが、eコマースサイトで作業する場合の賭け金は少し高くなります。 したがって、更新を行う前に準備することが最善である理由。

データベースを上書きすると、ライブサイトで注文が失われるリスクがあります

ライブサイトが通常どおり稼働しているときに、ステージング環境で変更を加えているとします。 コードを更新し、変更をテストして、4時間後に本番環境にプッシュします。

データベースを上書きすると、その4時間の時間枠内にライブサイトで発生した注文が消去される可能性があります。その結果、顧客が混乱し、顧客の在庫に問題が発生します。

彼らのサイトがまだあまり多くのトラフィックを受信して​​いない場合は、データベースを無傷で上書きすることで逃げることができるかもしれませんが、クライアントのストアがより成功する（そして注文の頻度が増加し始める）につれて、リスクが高まります。 つまり、サイトの更新を実行するためのワークフローは、意図しないものを上書きしないようにするために重要です。

大規模な変更は、ユーザーエクスペリエンスを危険にさらす可能性があります

eコマースサイトでは、カートへの商品の追加、請求情報の入力、支払いの送信など、重要なユーザーアクションが常にリアルタイムで発生しています。サイトのデザイン全体が完成したときに何かを購入しようとしていると想像してみてください。変更について。 あなたはそれを信頼しますか？

おそらくそうではありません。 更新を押して混乱し、代わりに競合他社のWebサイトをプルアップすることもあります。

次のセクションでは、この不確実性を更新から防ぐ方法を検討します（特に再設計の規模で）。 ただし、eコマースサイトを更新する場合は、更新時にサイトに現在アクセスしているユーザーが変更をどのように認識するかを検討して、あまり劇的なことをしていないことを確認することをお勧めします（特にチェックアウトフロー）。

eコマースサイトを更新するときに覚えておくべきいくつかのことを知ったので、良いものに取り掛かりましょう！

ダウンタイムや収益の損失を回避するために従うべきベストプラクティス

更新の規模に応じて、これらのすべての手順に従う必要がある場合とない場合があります。 私の目標は、これらのベストプラクティスを組み合わせて、自分とクライアントに最適なワークフローを見つけることができるようにすることです。

1. WordPress、テーマ、および主要なプラグインが更新されていることを確認します

このステップだけで、すべての更新の問題を解決できますか？ いいえ。

ただし、プラグインを最初に更新することで何かが壊れたり修正されたりする可能性があることを知るためだけに、サイトに大きな変更を加えないようにします。

さらに、再設計は常にサイトのハウスキーピングに適した時期なので、内側の近藤麻理恵を受け入れて整理してください。 WordPress、テーマ、プラグインの更新を実行し、古い注文をアーカイブし、データベースをクリーンアップし、サイトが使用しなくなったテーマやプラグインの一部をアンインストールすることもできます。

（特に、クライアントがあなたのところに来る前に自分のサイトを管理していた場合は、どれだけ早く合計できるかは誰もが知っています！）

すべてが最新バージョンで実行されると、この再設計に関して何を使用しているかが正確にわかります。 そして、誰が知っているか、多分あなたは何かを更新するだけで機能の問題を修正することによってあなたのやることリストを短くするでしょう！

2.サイトのメンテナンスについてユーザーに通知することを検討してください。そうすれば、ユーザーはいつ買い物をしないかを知ることができます。

これはすべてのeコマースサイトに適しているとは限りませんが、クライアントに買い物客の小さなコミュニティがある場合は、サイトの更新に関する通知の透明性が高く評価される可能性があります。 最良の部分は、それがあなたの側にあまり余分な作業を追加しないことです。 タイムラインをクライアントと明確に伝える必要があるだけなので、変更がいつ発生するかを誰もが正確に知ることができます。

クライアントにリピーターが多い場合は、メンテナンスウィンドウをユーザーに通知する電子メールを送信するように提案できます。 クライアントが多くの純新規訪問者に販売している場合は、更新がいつ行われるかについてのメッセージが記載されたポップアップまたはスティッキーヘッダーを調べる価値があるかもしれません。

そして、「更新が行われるとき」と言えば、あなたやあなたのクライアントがそれについて心配している場合、あなたが取ることができる別のステップは、「オフ」の営業時間中に変更を加えることです（彼らの売り上げのほとんどが9時から起こる場合の深夜のように） -5）。

これらの手法は、更新期間中に人々が買い物をしないことを保証することはできませんが、変更を本番環境にプッシュするときにサイトで発生するアクティビティのリスクの一部を軽減するのに役立ちます。

3.アップデートをライブでプッシュする間、メンテナンスページを表示します

訪問者がアクティブなときにeコマースサイトを更新することがリスクを冒したくない場合は、ショッピングを停止するための完全な方法は、サイトをメンテナンスモードにすることです。

メンテナンスページまたは「近日公開」ページは、基本的にサイトのすべてのコンテンツを非表示にし、通常は「更新が近づいています。 しばらくしてからもう一度確認してください。」

この手法の利点は、壊れたサイトよりもはるかにプロフェッショナルに見えることです。 再設計が進行中（および場合によっては壊れた状態）で表示される代わりに、訪問者には、何が起こっているかについてのコンテキストが記載された単純なランディングページが表示されます。

欠点は、サイトがメンテナンスモードになっている間は訪問者が買い物をすることができないことです。したがって、更新の準備ができたらこれをオンにして、完了したらすぐにオフにすることをお勧めします。そのため、クライアントは売り上げを取り戻すことができます。

これらのプラグインは、サイトをメンテナンスモードにするのに役立ちます。

• WPメンテナンスモード
• ファンシー近日公開＆メンテナンスモード
• スマートメンテナンスモード

また、営業時間外に更新を行うと、再設計による収益の損失を軽減するのに役立ちます。

4.最初にローカルサイトまたはステージングサイトで変更を加えてから、ライブサイトを更新します

ライブサイトで変更を加えてはならず、代わりにステージング環境またはローカル環境を使用して、本番環境にプッシュする前に更新をテストする必要があると聞いたことがあるでしょう。

最初に開発環境で更新をテストすることは依然として良い考えですが、プロセスがライブサイトのデータベースを上書きする場合に備えて、変更を本番環境に自動的にプッシュすることに注意する必要があります。 （前述したように、これにより注文が失われる可能性があります。これは、対処したい頭痛の種ではありません。）

多くのWebデザイナーは、対応する開発環境でコードをテストした後、代わりにライブサイトで手動で更新を行います。 これは最もスムーズなワークフローではありませんが、データベースが変更されないようにし、ストアを編集する前にテストする機会を提供します。

これまでにステージングサイトを使用したことがない場合は、WordPressホストが提供するものかどうかを確認してください。 （FlywheelとWP Engineには、すべてのプランにステージングサイトが含まれています！）ホスティングパッケージにまだ含まれていない場合は、プランのアップグレードを検討して、その機能のロックを解除する必要があります。

ローカル環境に関しては、Localは5分以内に開始できる無料のローカル開発プラットフォームです。 FlywheelまたはWPEngineサイトに接続して、eコマースサイトのコピーを非常に簡単にプルダウンできるため、環境とデータベースが一致していることがわかります。

5.変更をライブでプッシュする前後の品質チェック

eコマースサイトを再設計する場合はテストが重要です。変更を公開する前と後の両方でテストすることをお勧めします。

FlywheelとWPEngineのステージングサイトは、Localとともに、ライブサイトのコピーで作業することができます（したがって、そこで機能している場合は、本番環境で機能することを合理的に確信できます）が、確認するのは賢明です。変更が公開されると、すべてが意図したとおりに機能します。

結局のところ、何かが壊れて気づかなかったために、本番環境に変更を加え、立ち去り、クライアントから怒った電話を受けるリスクを冒したくはありません。

もちろん、更新するものは何でもテストし、デザインが大幅に変更されたページを確認する必要がありますが、チェックしたいeコマースサイトの他の要素は購入機能です。

これらのリソースは、チェックアウトフローをテストするときに役立ちます。

• WooCommerce支払いのテスト：WooCommerceヘルプドキュメント
• WooCommerceコアテストチェックリスト：GitHubのWooCommerceチェックリスト
• Ghost Inspector：Webサイトの更新をテストするためのアプリ
• Usetrace：コードを必要としないテストシステム
• サイプレス：JavaScriptのエンドツーエンドのテストフレームワーク
• Puppeteer：DevToolsプロトコルを介してChromeを制御するノードライブラリ

6.反復テストを採用する（可能な場合）

eコマースサイトに加える必要のある変更の数に圧倒されていると感じている場合は、ある時点で自問する価値があるかもしれません。それらは一度に行う必要がありますか、それとも複数の小さな更新に分割できますか？

ブランドの完全な再設計と機能のオーバーホールに取り組んでいる場合は、メンテナンスモードを設定して、一度にすべてをノックアウトすることをお勧めします。 ただし、小さな変更を行う場合、または更新を展開するための自然なフェーズを考えることができる場合は、時間の経過とともに反復的な変更を採用することをお勧めします。

これにはいくつかの利点があります。

1. 何かが壊れた場合、何がうまくいかなかったかを追跡するのが簡単になります（ソートするコードの行が少なくなるため）。
2. （全体ではなく）一度に1つのサイトを更新するため、ユーザーエクスペリエンスが中断される可能性は低くなります。
3. サイトの更新による影響（サイトの速度やコンバージョン率など）を測定している場合は、結果の原因となった変更を正確に特定できます。

これにより、完全に再設計するのではなく、多くの小さな変更を加えるように促された場合は、GitHubなどのバージョン管理システムを使用する価値があるかもしれません。 これは、コードがいつ/どのように変更されたかを追跡するのに役立ち、準備が整う前に何かがプッシュされた場合に更新を簡単にロールバックするのにも役立ちます。

7.何か問題が発生した場合に備えて、サポート計画を立てます。

うまくいけば、少なくとも、最初にステージングサイトで変更をテストするか、新しいコード行をプッシュする前にライブサイトのバックアップを作成しました。 このような手順により、何かが実際に壊れた場合に、開始した場所にロールバックできるようになります。

ただし、最悪のシナリオでは、友人に電話して助けを求める必要がある場合があります。壊れたWebページを見つめる前に、その計画を立てておくことをお勧めします。

あなたのリソースについて考えてください。 あなたがよく質問をするビジネスの友人がいるなら、あなたが大規模な再設計をしようとしているときに彼らに頭を上げて、質問が出てきたら同じ時間枠の間に彼らがたまたま利用可能かどうか確かめてください。

FacebookやSlackコミュニティでWebデザイナーのために活動している場合は、更新を開始する前に、同じことを行うか、アドバイスを求めることを検討してください。

最後に、WordPressホストのサポートチームと、サイトを強化している主要なテーマまたはプラグインに連絡する方法を知っていることを確認してください。特に、新しいものを初めてアクティブ化する場合はそうです。 FlywheelとWPEngineのお客様は、サーバーの問題が発生した場合に常にスタンバイ状態にあるWordPressエキスパートに24時間年中無休でアクセスできます。

Flywheelサポート、WPエンジンサポートの詳細については、ここをクリックしてください。Flywheelダッシュボードからサポートにアクセスするには、ここをクリックしてください。

eコマースサイトの更新は、従来のWebサイトよりも難しい場合がありますが、これらのヒントを使用すると、ダウンタイムや収益の損失のリスクを最小限に抑えてサイトを変更できるようになります。 いくつかの簡単なベストプラクティスに従うことで、何かが壊れる可能性を劇的に減らすと同時に、サービスがクライアントに提供する価値を劇的に高めることができます。

これは長いリストですが、決して網羅的なものではありません。 eコマースサイトを安全に更新するために他に何をしますか？ 以下のコメントで教えてください！

FlywheelでWordPressのeコマースサイトを簡単に更新

Flywheelは、無料のステージングサイト、無料の自動バックアップ、無料のコラボレーションツール、WordPressエキスパートによる24時間年中無休のサポートなどの機能のおかげで、クライアントのサイトを簡単に管理できます。 それはすべて、当社の印象的なクラウドホスティングインフラストラクチャに加えて、サイトに驚異的な高速性とロックダウンされたセキュリティを提供します。

今日（プロバイダーではなく）ホスティングパートナーの違いを発見してください！