あなたのサイトは、集客できていますか?各々の課題に沿ったSEOとユーザーに響くデザインを両立したサイト制作で、意識の高いターゲットをフロントへ呼び込みます。
ECサイトとは、ネットショッピングを行なうことができるWebサイトのことです。さまざまな商品販売を展開する店舗の中には、「自社もECサイトをスタートしたい!」と思われている担当者も多いのではないでしょうか。
ECサイトを始めるには、サイト構築が必要です。ECサイト構築と一言でいっても、フルスクラッチで行なうのか、パッケージやオープンソースサービスを利用するのか、ASP(アプリケーション サービス プロバイダ)を使うのかで構築の流れは異なります。今回はECサイト構築の際に、どのようなポイントを押さえておくべきかをご紹介します。
目次
それではまず、ECサイトを構築するまでのおおまかな手順を説明します。ECサイトの構築は、先ほど触れたようにどんな開発工程や開発ツールを選択するかで、工数が大きく異なります。ですので、以下の手順はあくまでおおまかな流れであることをご了承ください。
はじめに行うのは、全体のマーケティング戦略の策定です。そもそもECサイトを通じて、どんな事業課題を解決したいのか。課題解決に対して、どんな市場を狙いたくて、どんなポジションを獲得したいのか。そのうえで競合にはどんな存在がいるか……などなど。自社の課題分析およびリサーチを通じて、上流の戦略を固めていきます。ECサイトの市場調査を行う時は、ECサイト専業企業が競合になってくることも多く、実店舗売上と競合企業が異なるケースに注意が必要です。
そして、ECサイト全体のコンセプトも決めていきましょう。新規構築するECサイトでは、どんなターゲットにどんな利用体験を提供したいのか……など。コンセプトを明確にすることで、各ページの設計や機能・デザインの方向性が見えてきます。
全体のコンセプトが決定したら、次にECサイトの機能要件定義を定めていきます。ECサイトにどのような機能が必要であるか、マストな機能から書き出していきましょう。
要件定義で特に重要なのは、必要機能を漏れなく洗い出すことです。1度構築したECサイトの機能追加は、改修費用が高くて驚くクライアントも多いので、必要な機能や欲しい機能を構築が始まる前に把握しましょう。一方で「この機能は本当に必要であるか?」を何度も冷静に考え、必要でない機能は要件定義に盛り込まず、極力コンパクトにすることがポイントです。
デザイン要件定義も同じ考えで、デザインのレギュレーションを整理していきます。デザインについては、次にワイヤーフレームの作成工程とカブる部分もありますが、ここでも基本的な考えとしては、ユーザビリティを阻害しないシンプルなデザインが適しているでしょう。
つづいてワイヤーフレーム、すなわち画面設計を行います。ワイヤーフレームでは、TOPページにあたる親ディレクトリから、どのような階層構造で全体のWebページを設計するか。そのうえで、各Webページ内の各パーツの配置をどのようにしていくかを設計します。
ここでは、先ほど決めた機能の要件定義・デザインの要件定義をもとに、ユーザビリティを考慮した適切なワイヤーフレームを作成していきましょう。「あくまでラフな設計にすぎない」という考えではなく、完成されたECサイトの質を左右するカギとなる工程である意識を忘れないようにしてください。
ワイヤーフレームを作成し終えたら、画面設計に基づいて各ページのデザインを固めていきます。ここでいうデザインとは、各ページの”見た目”部分を整える作業になります。
例えば、ECサイト全体で統一感を出すためのメインカラーの決定や基本的なレイアウト、フォント指定、挿入する画像やイラスト、ロゴやキャラクター画像などを各ページに配置していきます。
デザインの工程は、あくまでページ内のデザイン素材の配置を決定する作業ですので、コーディング作業ではありません。次の工程で、html/cssやJavaScriptでコーディングする作業に進みます。デザインをもとにコーディングしていくので、ECサイトにおいてとても重要な作業です。
デザインの作業が終わったら、ようやくコーディングにすすみます。フルスクラッチ、つまりイチからECサイトを作っていく場合には、機能面はエンジニア、デザイン面はWebデザイナーに依頼をし、要件定義とワイヤーフレーム・デザインに沿ってコーディングを行います。
ただ、現在ではパッケージやオープンソース・ASPを利用して、基本的なフレームはツールの雛形を用いる場合もあります。ASP等のツールを利用すれば、イチからコーディングをする必要がない分、構築のフローを簡略化することができますが、一方で機能やデザインがフレームにより限定的であるケースが多く、柔軟に制作できない場合があるのでツールの選択には注意が必要です。
ECサイトのコーディングが完了したら、実際にECサイトで販売する商品を登録しましょう。フルスクラッチでECサイトを開発した場合は、商品登録の方法は開発法によって異なります。ASP等のツールを使用した場合は、ツールの設定画面に従って商品登録を行いましょう。
そして最後に、構築したECサイトが問題なく動作を行うかをテストします。ECサイトをWeb上にアップするといっても、PCやスマホ・タブレットといったデバイス別、Windows OSかMac OSなどOS別、GoogleかYahoo!・Bingなどのブラウザ別でECサイトの表示のされ方は異なります。
このような閲覧環境の違いで、ECサイトのレイアウト崩れ、バグの発生がないかを最後の公開前テストでは、あらゆるケースを試しチェックを行いましょう。まだ、セキュリティ面で脆弱性がないかも丁寧に確認しましょう。
ここまで、ECサイトの構築方法にはおもに「フルスクラッチ」「パッケージ」「オープンソース」「ASP」があることに触れてきました。Webの開発手法やECサイトにあまり詳しくない方からすると、これらの具体的な違いってわかりづらいですよね。そこで次は、ECサイトの構築方法別のメリット・デメリット・目安費用などを解説したいと思います。
フルスクラッチとは、完全にゼロから全ての開発・デザイン制作を行うことです。フルスクラッチのメリットは、特定のツールに頼らず、全設計および開発を自分たちで行うことができるため、技術力があれば、自分たちが理想とするECサイトを構築できる点です。
また、ECサイトのデータを蓄積するDB(データベース)や、サーバーの容量を拡大することで、膨大なデータを収集したり、多くのトラフィックに対しても挙動をスムーズに保つことができます。コーディング次第で、他のサービスとの連携も自由にできる点も魅力的なメリットでしょう。
一方、デメリットは全ての開発をイチから行うため、ECサイトの構築に多くの時間がかかり、内製の場合は人件費・外注の場合は外注費がかなり膨れあがってしまうところにあります。また、ECサイトをイチから構築するにあたって、優秀なPM(プロジェクトマネージャー)・エンジニア・デザイナー等が必要であることも難易度が高くなる要因です。
気になる費用ですが、社外の制作会社にアウトソースした場合、制作期間が2〜5ヶ月とすると、おおよそ100万円以上か掛かると考えておくべきでしょう。フルスクラッチ開発は、サイトの規模や機能要件で大きく制作費用が上下しますので要件次第で金額が変わることに注意しましょう。
パッケージとは、ECベンダーが独自の機能を持たせてフレームワークとして実装しているECサイトのことです。パッケージを利用すると、フルスクラッチと比べ、構築にかかるコストを抑えることができます。また、機能やデザイン面のカスタマイズには柔軟なパッケージが多く、独自性のあるECサイトを構築しやすいのがメリットです。業界に特化したパッケージも多く、自社ビジネスとマッチする場合、パッケージによるECサイト構築がおススメです。
一方でデメリットは、ECベンダーへと支払う年間の保守費用やメンテナンス費用など、ECサイトの売り上げが安定するまでは、ランニングコストが一定の負担となる点です。
パッケージ利用にかかる費用ですが、構築までの費用とその後の保守・メンテナンス費用をあわせると、およそ年100万円強となる見込みです。
オープンソースとは、Web上に無償で公開されているECサイトの構築システムのことです。メジャーなツールでいうと、EC-CUBEなどがオープンソースにあたります。オープンソースのメリットは、無償で利用できるツールであるため、ECサイト構築費用を抑えて運用することができる点。また、ツールでできることを深く理解していれば、機能やデザインを柔軟に構築することが可能なのもメリットでしょう。
一方、オープンソースのデメリットは、セキュリティ対策を自社で運用管理していく必要があることです。もちろん、使用するオープンソースによりますが、セキュリティ面でトラブルがあった場合も、サポート対応がないケースが多いので自社内でセキュリティ対策を行っていく注意が必要です。
オープンソース利用にかかる費用ですが、多くのツールでは、10〜100万円の費用感となる見込みです。
ASPとは「アプリケーション・サービス・プロバイダ」の略で、月額課金制で利用できるクラウド型のECサイト構築サービスです。ASPのメリットは、すでにECサイトとして構築されているサービスを月額課金で利用するため、ECサイト構築にかかる手間がない点です。面倒なインフラ環境の手配や、セキュリティ対応などが必要ないので、スピーディーにECサイト運営をスタートすることができます。
一方、ASPのデメリットは、機能やデザインの拡張性がほとんどないケースが多いこと。ECサイトの売り上げが拡大し、サイト内の機能を追加しようと思っても、柔軟に開発することが難しい場合がよくありますので注意が必要です。
ASP利用にかかる費用ですが、月額課金制で月〜100万円の費用感となる見込みです。
ECサイトを構築する方法は、どんな予算感・スケジュール感かによって適切な手段が異なります。では、どんな構築手段をとるかを別として、構築の際のポイントとはどういった点があるでしょうか。それでは、ご説明をいたします。
まず一つ目は、ECサイトに限らず重要なことですが、ECサイトを構築し運用していく目的やKPIを事前に明確にしてから設計をはじめるということ。文字にすると当然のように思えますが、意外にもECサイト構築に取り掛かる現場では、後回しにされたり、曖昧なまま実装されがちです。
「ECサイトで解決したい課題」が明確になっているからこそ、各Webページの機能やデザインの設計がCV(コンバージョン)へスムーズに結びつきます。特に社内プロジェクトだとすぐに構築に進むよう急かされる場面もあると思いますが、ECサイトの目的やKPIの精査は、じっくり考えるようにしましょう。
二つ目のポイントは、構築後の運用フェーズで機能やデザインを修正することを考慮しながら構築を行うことです。ECサイトの構築方法には、おもにフルスクラッチ・パッケージ・オープンソース・ASPがありますが、ECサイトは構築したらあとはいっさい修正せず運用を行うだけ……ではありません。
ECサイトのPV数や離脱の多いページ・商品ごとの売上数などデータを収集しながら、ほとんどの場合、改善(PDCA)をし続ける必要があります。そのため、なるべくECサイトのリリース後にも、各Webページの機能やデザインの可変性が高い構築をしたほうがいいです。フルスクラッチ以外の構築方法だと、ECベンダーやツールの実装に左右されますが、リリース後のPDCAを意識して構築を進めていきましょう。
三つ目のポイントは、ECサイトの決済方法を早い段階で決めておくことです。ECサイトの決済方法は、おもに「クレジットカード」「コンビニ決済(Web/紙)」「後払い」「電子マネー」「銀行引落(口座振替)」「海外送金サービスの利用」などがあります。
決済方法自体は、フルスクラッチの開発を除き、リリース後に追加・修正できるケースが多いですが、初期の戦略策定・機能の要件定義の段階でしっかりと考えておきましょう。
フルスクラッチの場合は特に開発時のコーディング次第では、「あとから電子マネー決済を組み込むのが大変!」という事態になる可能性もありますので、より初期の要件定義時に洗い出して固めておくことが大切です。
ECサイトを無事構築しリリースし終えたら、次は運用のフェーズに進みます。ここで大切なのが、ユーザーのECサイトに関するデータを収集し、適切にPDCAをまわし続けることです。
ECサイトの場合もWebサイトやメディアの解析で使用する、Googleが無償で提供しているGoogleアナリティクスを利用して、Web解析ができる環境を整えましょう。
ECサイトをGoogleアナリティクスを通じて分析する際に便利な「eコマーストラッキング機能」について詳しく知りたい方は、ぜひ以下の記事をチェックされてみてください。
いかがだったでしょうか? ECサイト構築の歴史はWeb業界の中では古いほうですが、フルスクラッチで構築するのかASPを利用するのかといったように、構築手段ごとにかかる費用も時間も大きく異なります。
ECサイトの目的に沿った構築が行えるように、まずは”ECサイトをなぜ構築するのか?”という課題部分の整理を丁寧に行い、適切な構築手段を選ぶようにしてください。
どのようなサイトにも必ずある「お問い合わせフォーム」。実は、このお問い合わせフォームの作り方次第で、CVRが劇的に変わるのをご存知でしょうか…
WordPress(ワードプレス)とは、サイトの作成やブログの作成などができるCMS(コンテンツ管理システム)の1つで、無料のソフトウェアで…
Webサイトの構成を考える上で、ユーザーの動きをどのくらい意識していますか。訪問してくれたユーザーをいかに目的のコンテンツに誘導し、成果を上…
Webサイトのトレンドは日々変わります。一度作ったきりのWebサイトは、時間の経過とともにどこか古臭くなってしまい、ユーザーにとっても使いに…
「サイト内検索」とは、多くのWebサイト・Webメディアの画面右側に表示されている、そのサイト内のワードが検索できる機能です。この「サイト内…
日本国内だけでも、ECサイト制作プラットフォームは多くありますが、当然海外まで視野を広げるとさらに選択肢を増やすことができます。また、海外の…