ECサイトを構築する際に押さえておきたい費用や手順について

2020.03.262020.03.26Web制作

ECサイトとは、ネットショッピングを行なうことができるWebサイトのことです。さまざまな商品販売を展開する店舗の中には、「自社もECサイトをスタートしたい！」と思われている担当者も多いのではないでしょうか。

ECサイトを始めるには、サイト構築が必要です。ECサイト構築と一言でいっても、フルスクラッチで行なうのか、パッケージやオープンソースサービスを利用するのか、ASP（アプリケーションサービスプロバイダ）を使うのかで構築の流れは異なります。今回はECサイト構築の際に、どのようなポイントを押さえておくべきかをご紹介します。

1 ECサイトを構築する際の手順
2 ECサイト構築方法の種類
3 ECサイトを構築する際のポイント
4 構築後はアクセス解析とマーケティング施策で売上UPを！
5 おわりに

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サイト構築方法の種類

ここまで、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

ASPとは「アプリケーション・サービス・プロバイダ」の略で、月額課金制で利用できるクラウド型のECサイト構築サービスです。ASPのメリットは、すでにECサイトとして構築されているサービスを月額課金で利用するため、ECサイト構築にかかる手間がない点です。面倒なインフラ環境の手配や、セキュリティ対応などが必要ないので、スピーディーにECサイト運営をスタートすることができます。

一方、ASPのデメリットは、機能やデザインの拡張性がほとんどないケースが多いこと。ECサイトの売り上げが拡大し、サイト内の機能を追加しようと思っても、柔軟に開発することが難しい場合がよくありますので注意が必要です。

ASP利用にかかる費用ですが、月額課金制で月〜100万円の費用感となる見込みです。

ECサイトを構築する際のポイント

ECサイトを構築する方法は、どんな予算感・スケジュール感かによって適切な手段が異なります。では、どんな構築手段をとるかを別として、構築の際のポイントとはどういった点があるでしょうか。それでは、ご説明をいたします。

ECサイトの目的やKPIを明確にしておく

まず一つ目は、ECサイトに限らず重要なことですが、ECサイトを構築し運用していく目的やKPIを事前に明確にしてから設計をはじめるということ。文字にすると当然のように思えますが、意外にもECサイト構築に取り掛かる現場では、後回しにされたり、曖昧なまま実装されがちです。

「ECサイトで解決したい課題」が明確になっているからこそ、各Webページの機能やデザインの設計がCV（コンバージョン）へスムーズに結びつきます。特に社内プロジェクトだとすぐに構築に進むよう急かされる場面もあると思いますが、ECサイトの目的やKPIの精査は、じっくり考えるようにしましょう。

機能やデザインを修正しやすいサイトにしておく

二つ目のポイントは、構築後の運用フェーズで機能やデザインを修正することを考慮しながら構築を行うことです。ECサイトの構築方法には、おもにフルスクラッチ・パッケージ・オープンソース・ASPがありますが、ECサイトは構築したらあとはいっさい修正せず運用を行うだけ……ではありません。

ECサイトのPV数や離脱の多いページ・商品ごとの売上数などデータを収集しながら、ほとんどの場合、改善（PDCA）をし続ける必要があります。そのため、なるべくECサイトのリリース後にも、各Webページの機能やデザインの可変性が高い構築をしたほうがいいです。フルスクラッチ以外の構築方法だと、ECベンダーやツールの実装に左右されますが、リリース後のPDCAを意識して構築を進めていきましょう。