【初心者向け】HTMLタグの種類や使い方の基本をわかりやすく解説
2024年7月25日
東証スタンダード上場企業のジオコードが運営!
Web制作がまるっと解るWebマガジン
更新日:2024年 09月 10日
【監修】株式会社ジオコード Web制作事業 責任者
高松 建太郎
オンライン販売を始める際は、ECサイトを構築することが最初の一歩です。しかし「専門的な技術や予算に限りがある」「どうすればよいのか分からない」と悩んでしまうこともあるでしょう。
本記事では、ECサイト構築に不安を抱える企業の担当者様に向けて、具体的な費用や手順を紹介します。ECモールと自社ECサイトの比較から、構築に必要な要素、費用の詳細、具体的な構築ステップまで分かりやすく解説しています。ECサイトの構築をお考えの方は、ぜひ最後までお読みください。
目次
ECとは「Electronic Commerce」の略で、日本語では「電子商取引」を意味します。ECサイト構築とは、オンライン上で商品やサービスを販売するためのWebサイトを作ることです。
ECサイトを構築する方法としては、以下の2つが挙げられます。
本項では、ECモールと自社ECサイトの特徴、それぞれのメリットとデメリット、どのような方に向いているのかを解説します。
ECモールとは楽天市場やAmazonに代表される、複数のショップが1つのサイトに集まったオンライン上のプラットフォームを指します。現実の世界でたとえると、ショッピングセンターのテナントを借りてお店を開くイメージです。
ECモールの主なメリットは、以下のとおりです。
ECモールには、以下のようなデメリットもあります。
ECモールに向いているのは、以下のような方です。
自社ECサイトは、サイト構築から運営、管理まで全てを自社で行うECサイトです。ECモールをショッピングセンターとするなら、自社ECサイトは独立した路面店を持つイメージです。
自社ECサイトには、以下のようなメリットがあります。
自社ECサイトには、以下のようなデメリットもあります。
自社ECサイトに向いている方の特徴は、以下のとおりです。
ECモールを利用する場合は、各ECモールのフォーマットに従ってデザインを作りますが、自社ECサイトは自ら構築する必要があります。だからこそ、ブランドイメージやユーザー層に合わせた、オリジナリティやユーザビリティの高いサイトを作ることができます。
インターネット上の自社ECサイトを現実の店舗に例えると、次のようなイメージです。
現実の店舗 | 自社ECサイト | |
---|---|---|
場所 | 店舗を立てる土地 | サーバーの中 |
所在地表示 | 住所 | ドメイン |
建物 | 店舗を建設 | ECサイト構築システムでデザインを作成 |
支払い場所 | レジ | カートシステム (ECサイト構築システムに組みこまれていることが多い) |
サーバーとは、情報やデータを提供するコンピューターのことを指します。ECサイト構築においてサーバーは「自社ECサイトを構築する場所」と認識して差支えないでしょう。自社ECサイトを構築するために使用されるサーバーの主な種類は、レンタルサーバー、クラウドサーバー、VPS、専用サーバーの4種類があります。
特徴 | コスト傾向 | メリット | デメリット | |
---|---|---|---|---|
レンタルサーバー | 1つのサーバーを他の利用者と区切りなく共用する | 低い | 専門知識がなくても手軽に使える | ・設定などが制限される ・表示が遅くなることがある |
クラウドサーバー | 1利用者当たりの利用範囲や方法を設定できる | 従量課金制が多い | 必要に応じてサーバーの利用範囲や方法を変更できる | 専門知識が必要 |
VPS | サーバーを仮想的に分割して利用者に割り当てる | 中間 | 専用サーバーの感覚で使える | 専門知識が必要 |
専用サーバー | 1つのサーバーを丸ごと占有する | 高い | 自由にカスタマイズできる | 専門知識が必要 |
ドメインとは、「インターネット上の住所」のことで、自社ECサイトがどこにあるのか識別する情報です。以下のURLアドレスやメールアドレスの「xxxxx.co.jp」部分がドメインに該当します。
co.jp部分は組織形態や国などにより異なる
また、ドメインには「独自ドメイン」「共有ドメイン」の2種類があります。
※ECサイト構築サービス、レンタルサーバーなどの提供会社
取得方法 | ・JPRS認定業者(※)へドメイン名を登録する ・すでに取得されているドメインは使用不可 |
ドメイン名 | xxxxx.co.jp(xxxxxを自由設定) |
費用 | 有料 |
メリット | ・自社ブランドや商品の名前をそのままドメイン名にできる ・ブランドイメージを高められる ・共有ドメインに比べSEOに有利 ・問い合わせ窓口や社員のメールアドレスに同じドメインを使用することで、ブランドイメージの向上が期待できる |
デメリット | ・更新などの管理が必要 ・取得費用や維持費用などのコストがかかる |
※株式会社日本レジストリサービスが認定したドメイン登録会社
取得方法 | サービス提供者が提供するドメインの一部を使用 |
費用 | 無料または低コスト |
ドメイン名 | xxxxx.aaa.co.jp(xxxxxを自由設定、aaaをサービス提供者が指定) |
メリット | ・基本的に無料 ・サービス提供者が管理を行うので手間がかからない |
デメリット | ・ドメインにサービス提供者が入るためブランドイメージが低い ・SEOが限定される ・サービスが終了するとドメインも使用できなくなる |
ECサイト構築システムとは「ECサイトをデザインするためのシステム」です。主にASP型とパッケージ型、オープンソース型、フルスクラッチの4種類があります。
特徴 | コスト傾向 | メリット | デメリット | |
---|---|---|---|---|
ASP型 | 個別に開発しない(既存のテンプレートで構築する) | 低~中 | ・専門知識がなくても手軽に使える | ・大幅なカスタマイズができない |
パッケージ型 | ECサイトに必要な機能がパッケージ化されている(サーバーにインストールして利用) | 中 | ・カスタマイズや機能の追加ができる | ・費用が高い ・ある程度の専門知識が必要 |
オープンソース型 | 公開されているソースコード(プログラムの設計図)を書き換えて構築する | 低 | ・カスタマイズやシステムの仕様変更ができる | ・専門知識が必要 ・セキュリティ対策が必要 |
フルスクラッチ型 | ゼロからECサイトを作り上げる(開発業者へ依頼するのが一般的) | 高 | ・完全にオリジナルのECサイトを作れる | ・専門知識が必要 ・ECサイトの全てをゼロから決めなくてはならない ・期間も費用も大きくなる |
自社ECサイト構築にかかる費用は、選ぶサーバーやECサイト構築システムにより異なります。それぞれにメリットとデメリットがあるため、費用対効果の比較検討が必要です。
サーバー費用の一例です。サーバー提供会社やプランにより初期費用や月額料金、条件などが異なるのでご注意ください。一括払いや年払いができるプランを提供する会社もあります。正確な金額は各サーバー提供会社へ問い合わせましょう。
初期費用(例) | 月額料金(例) | |
---|---|---|
レンタルサーバー(ビジネスプランの場合) | 無料~ | 約600~5,500円 |
クラウドサーバー | 無料~ | 従量制のため使用状況により異なる |
VPS(2GBの場合) | 無料~ | 約2,000円~ |
専用サーバー(8GBの場合) | 無料~約13万2,000円 | 約1万3,000~2万2,500円 |
ドメインは種類や取得先、取得するタイミングによっても費用が変わります。例えばムームードメインで「.com」を取得する場合、取得費用が400円、更新費用が1,728 円です。(※)
共有ドメインは無料または低コストで提供されますが、ECサイト構築においては、独自ドメインを選択するとSEO対策やブランディングの観点で有利です。取得したいドメインの正確な金額が知りたい場合は、各ドメイン提供会社へ問い合わせましょう。
※参考:ムームードメイン「ドメインの価格一覧 ( 取得・更新・移管など ) 」(2024-08-20)
ECサイト構築システムの費用は、サイトの規模や機能、提供会社やサービス内容などにより大きく増減します。費用を公開していないケースも多いため、正確な金額が知りたい場合は各システム提供会社への問い合わせが必要です。以下では、一例を紹介します。
ASP型はASPカートとも呼ばれ、レンタルサーバーが不要で、提供されたクラウド上でECサイトを構築できます。システム提供会社によっては初期費用と月額費用が無料で利用できるプランもあり、有料プランでも安価なので手軽にECサイトを始められます。しかし商品が売れるたびに決済手数料やサービス利用料が発生する点は考慮しておきましょう。正確な金額は各システム提供会社の公式サイトを確認してください。目安として以下に費用の一例をご紹介します。
例1:初期費用0円、月額費用1万9,980円/月 +別途決済手数料
例2:初期費用3,300円、月額費用3,300/月 +別途決済手数料
パッケージ型はECサイトの構築に必要となる、商品検索機能、カート機能、会員機能、在庫管理機能などの基本機能が備えられています。必要な機能を選択して利用することができるため柔軟性があり、サーバーにパッケージをインストールすればすぐに利用できる点がメリットです。ただし同じサービスで構築したECサイトは、デザインや機能が似通ることを認識しておきましょう。
費用はほとんどのシステム提供会社が「要問い合わせ」としており、Webサイトだけで比較するのは困難です。正確な金額が知りたい場合は、依頼を検討しているシステム提供会社への問い合わせが必要です。目安として以下に費用の一例をご紹介します。
例1:初期費用2万2,000円、月額料金2万4,000円/月
例2:初期費用19万円、月額費用5万9,000円/月
「オープンソース」とは、ソフトウェアの設計図にあたるソースコードを無償で一般公開することです。誰でも自由にそのソースコードを閲覧、改変、再配布できます。
オープンソース型はソースコードを基にサイト構築を行います。ECサイトに必要なカート機能や決済機能などの基本機能が備えられている他、必要に応じて機能拡張も可能です。初期費用を抑えやすく、カスタマイズ性に優れる一方、ソースコードを理解できるスキルや強固なセキュリティ対策が求められます。
オープンソース型のソースコード(プログラム)自体は公開されているため、基本的に無料でダウンロードできます。しかし、必要に応じて拡張機能やカスタマイズ、構築・保守の外注費用など、ソースコード以外の費用がかかるため、注意しましょう。
そのため費用はケースバイケースとなり、価格帯の幅が生じます。依頼を検討しているシステム提供会社に問い合わせましょう。
フルスクラッチ型は既存のパッケージやソースなどを使用せず、一からシステムを作り上げていく構築方法です。自由度が高いオーダーメイドの構築方法であり、自社に合ったオリジナルのECサイトを作ることができます。しかし、フルスクラッチ型には高度なスキルと大きな投資が求められ、インフラやサーバーの運用管理も自社で行わなければなりません。そのため、主に大企業や独自の販売形態を取る企業で採用されています。
自社に対応可能なエンジニアがいない場合は、制作会社に開発を依頼することになるでしょう。費用はECサイトの規模や制作期間によりケースバイケースですが、総じて高額です。依頼を検討している制作会社に問い合わせましょう。
自社ECサイト構築は次の手順で行っていきます。
コンセプトとは「ECサイトの目指す姿や方向性」のことです。ECサイトを構築する際は、さまざまな選択や判断の軸となるコンセプトが欠かせません。例を挙げると、次のような項目があります。
コンセプトを明確にする目的と理由は次のとおりです。
ECサイトはユーザーにとって、ブランドや商品の世界への入り口です。現実の店舗でもインテリアに統一感がないと、お客さんがすぐに店を出てしまうことがあります。一貫性のないECサイトも同じで、訪れたユーザーが「よく分からない」「あまり好きなショップではない」と感じ、離脱しかねません。
コンセプトをはっきりさせることで、雰囲気や機能を統一したECサイトができ、ユーザビリティが高くなります。色や雰囲気など視覚的な部分や、ECサイト全体の操作性を統一して、ユーザーの滞在時間と回遊性の向上につなげていきましょう。
ECサイトのコンセプトを定めると、自社ブランドの強みやターゲットを浮き彫りにできるので、競合他社との差別化が可能になります。
同じファッションのECサイトでも「流行の最先端を追いたい人」と「質の良いものを長く着たい人」では、求める商品が異なります。従って、どのようなユーザーをターゲットとするかによって、デザインの雰囲気や取り扱う商品の範囲が決まり、競合他社との差別化を図ることが可能です。逆にコンセプトが曖昧で、誰に対しても中途半端なECサイトでは、ユーザーの購入意欲に対する働きかけが難しくなります。
ターゲットとなるユーザー層を明確にして、限定的かつ効果的なメッセージの発信、マーケティング施策などができるようになります。
大手ECサイトは多くのユーザーを抱えている分、1つのジャンルやブランドに特化するのは難しいです。自社ECサイトの強みを生かし、特定のユーザー層へ効果的な働きかけができれば、特化したジャンルで大手以上の競争力を持てるかもしれません。
要件定義は「どのようなECサイトを作るのか」を具体的に決め、社内外の関係者間で共有する重要な工程です。最初に掲げたコンセプトに基づいて、サイト要件や実行計画などを具体的に練りあげていきます。実際には、ECサイト構築システム提供会社の担当者などが決まった段階ですり合わせましょう。
要件定義をしっかりと行うことで、次の効果が得られます。
具体的には次のようなことを決めていきます。
要件定義は目先のことだけでなく、長期的なスタンスでの判断が必要です。初期費用だけでなくランニングコストも含めて考える、運用開始後に必要になる機能やシステムを把握するなど、要件の抜け漏れがないように進めていきましょう。実際の業務フローを具体的にイメージしながら進めることが重要です。
要件定義を行ったら、次にECサイト構築システムを選定します。サーバーの使用契約やドメインの取得もしておきましょう。
ECサイト構築システムは、ASP型とパッケージ型、オープンソース型、フルスクラッチ型の中から、どのシステムを使って構築するのか考えていきます。専門知識の程度やコストだけでなく、メリットとデメリット、必要な機能が揃っているかを含めた総合的な判断が重要です。
利用するECサイト構築システムの種類が決まったら、提供会社の選定です。提供会社ごとに初期費用が違ったり、使える機能や受けられるサポートが変わったりするので、比較検討するのが大切です。「機能やサポートが充実しているか」「想定外のコストがかからないか」など、必要事項をしっかり調査しましょう。自社に合わない提供会社を選んでしまうと、後になってトラブルが起きたり、システムを乗り換えたりする羽目になりかねません。
提供会社を選定する際の基準として、次のポイントが挙げられます。コンセプトに基づき、選定基準をしっかり定めた判断が大切です。
実際に提供会社を選定する際は、希望に合う数社をピックアップし、各社から相見積りを取ることをおすすめします。
次にECサイトに取り入れる決済手段を選びます。決済手段は、商品を購入したユーザーに提供する支払い方法のことです。
SBペイメントサービスの調査によると「使いたい決済方法がない」と判断したユーザーの60%以上が「他のECサイトで同じ商品を購入する」と回答しています(※)。数多くある決済方法の中から適切な手段を選び、自社ECサイトに用意しておくことで、顧客満足度の向上や売上の拡大が期待できます。
※参考:SBペイメントサービス
「決済手段に関する調査 2019年8月21日版」.“調査結果 まとめ”.https://www.sbpayment.jp/2019/08/survey_on_payment_methods.pdf ,(2019-08-21).
ECサイトで使用できる主な決済手段は次のとおりです。
それぞれのメリットとデメリットを踏まえて紹介し、あわせて選定のポイントも解説します。
クレジットカードはもっとも多く利用されている決済手段です。SBペイメントサービス株式会社の調査結果では、全体の約79%がクレジットカード決済を選ぶというデータが出ています(※)。
※参考:SBペイメントサービス「決済手段に関する調査 2019年8月21日版」.“最も利用する決済手段”.https://www.sbpayment.jp/2019/08/survey_on_payment_methods.pdf ,(2019-08-21)
コンビニ決済はクレジットカードに次いで多く利用されており、全体の6.6%のユーザーが利用しているというデータが出ています(※)。10代のユーザーはクレジットカードを持っていないことがあるため、コンビニ決済の利用率が高いことも特徴の一つです。
※参考:SBペイメントサービス「決済手段に関する調査 2019年8月21日版」.“最も利用する決済手段”.https://www.sbpayment.jp/2019/08/survey_on_payment_methods.pdf ,(2019-08-21)
キャリア決済は、携帯電話の料金と合わせて商品代金を支払う決済手段です。スマートフォンで簡単に決済でき、クレジットカードにおける番号入力のような手間がありません。継続課金機能を設定すれば、定期購入にも利用できます。
代金引換は商品の配達時に代金を支払う決済手段です。商品を手にするのと支払いが同じタイミングになるので、ユーザーが気軽に購入しやすいと考えられます。
後払いは商品の配達時に代金を支払う決済手段です。商品を確認してから支払うため、ユーザーの安心感が代金引換以上に高くなります。しかし、商品を送ってからの支払いには、未払いリスクや回収遅延といった特有のリスクがあることも否めません。不安に感じる場合は、未回収リスクを避けられる「入金保証型の請求代行サービス」の利用を検討してはいかがでしょうか。
決済手段は前述した方法以外にも、銀行振込や口座振替、電子マネー決済など多岐にわたります。ターゲットユーザーが特定の決済方法を好む傾向にある場合は、取り入れることを検討しましょう。利用者が少ない決済手段が将来的に人気を集めたり、新しい決済手段が出たりする可能性もあります。
決済手段を選定する際は、ターゲットのユーザー層が使いやすいものをピックアップして、複数の手段を組み合わせるのが効果的です。一般的に若年層はクレジットカードの所有率が低く、高齢層では現金払いを好む人が多いなど、年齢層による傾向があります。また、商品価格帯が高額なら、クレジットカード決済の他に銀行振込を選択肢に入れるのも一案です。
決済手段によって初期費用や手数料が異なるので、総合的なコストに注意を払う必要があります。新しい決済手段の登場や利用傾向の変更に備えた定期的な見直しも大切です。
決済手段を選定したら、サイトデザインを決めましょう。ECサイト構築において、ショップの顔となるデザインは非常に重要です。見た目の印象だけでなく、使い勝手や機能の過不足にも注意しなければなりません。ユーザーは分かりにくさや使いにくさを感じると、すぐに離脱してしまいます。
売上を伸ばしたいなら、ECサイトに来たユーザーの滞在時間や回遊率を上げる必要があります。そのためには、ECサイトに掲載する情報を整理した上で、効率的で使いやすいシンプルなデザインに仕上げることが理想的です。自身が買い物をするつもりで、ユーザビリティを上げるための要素を探してみてください。例えば、下記のようなポイントがあります。
実際に人気があるECサイトを見て、配置の仕方や写真の撮り方を参考にするのもおすすめです。
商品ページを作るのは、現実の店舗で商品を棚に並べるのと同じです。ユーザーが商品をピンポイントで検索した場合は、ECサイトのトップページではなく、商品ページを最初に見ることになります。スムーズに購入できるよう、必要な商品情報を過不足なく揃え、分かりやすく表示しましょう。
必要な要素は下記のとおりです。
商品画像や説明文には、ターゲットユーザーにとって有益な情報を盛り込みます。「この商品を買った方におすすめ」と関連商品を表示して「ついで買い」を促すのも効果的です。商品ページの登録ミスはクレームやトラブルの原因になるため、慎重に登録しましょう。
ECサイトの準備が整ったら、オープンの前にテスト注文することをおすすめします。ユーザー目線で商品を選ぶことで、使いにくさや分かりにくさが明確になるでしょう。
これらのポイントをテストすることで、ユーザー視点での確認が可能になります。
テスト注文を無事にクリアできたら、ECサイトをオープンさせます。手塩にかけて構築した自社ECサイトだからこそ、多くのユーザーに見てほしいものです。事前にメールやSNS、プレスリリースなどの手段を駆使して告知しておきましょう。
実際にECサイトが動き出し、さまざまなユーザーが訪れるようになると、トラブルや想定していなかった事態が発生する可能性があります。提供会社に過去のトラブル例を提供してもらうと、問題が起きたときに役立つかもしれません。
ECサイトを構築する方法や費用、手順について解説しました。
ECサイトの構築方法は、ECモールか自社ECサイトかの選択から始まります。販売力が高いECサイトを構築するためには、軸となるコンセプトをしっかりと決めることが大切です。
時間も労力もかかるECサイトの構築ですが、オンラインに販路を広げる最初の過程にすぎません。ECサイトはオープン後に多くのユーザーを集め、興味を引くことで、売上を拡大させるための基盤となります。そのためにはSEO対策やSNSでの発信、継続的な見直しと改善などを続けることが大切です。
自社の目標や予算に合わせた最適な選択をしながら、より効果的なECサイトの構築を目指しましょう。