--- title: "ECサイト制作:カスタム開発とShopify対応 — Dardo" description: "Shopify、ヘッドレス、カスタムチェックアウトでのECサイト制作。最適なプラットフォーム選び、離脱の少ない購入導線、Googleが読み取れる商品データを実現します。" url: "https://dardo.studio/ja/services/ecommerce-development/" language: "ja" translations: {"en":"https://dardo.studio/en/services/ecommerce-development/","es":"https://dardo.studio/es/servicios/diseno-de-tiendas-online/","fr":"https://dardo.studio/fr/services/developpement-site-e-commerce/","de":"https://dardo.studio/de/leistungen/e-commerce-entwicklung/","it":"https://dardo.studio/it/servizi/sviluppo-ecommerce/","pt":"https://dardo.studio/pt/servicos/desenvolvimento-de-ecommerce/","nl":"https://dardo.studio/nl/diensten/webshop-laten-bouwen/","sv":"https://dardo.studio/sv/tjanster/e-handelsutveckling/","pl":"https://dardo.studio/pl/uslugi/tworzenie-sklepow-internetowych/","uk":"https://dardo.studio/uk/services/ecommerce-development/","ru":"https://dardo.studio/ru/services/ecommerce-development/","ar":"https://dardo.studio/ar/services/ecommerce-development/","hi":"https://dardo.studio/hi/services/ecommerce-development/","th":"https://dardo.studio/th/services/ecommerce-development/","ko":"https://dardo.studio/ko/services/ecommerce-development/","zh-Hans":"https://dardo.studio/zh-Hans/services/ecommerce-development/","zh-Hant":"https://dardo.studio/zh-Hant/services/ecommerce-development/"} updated: "2026-10-08" --- # ECサイト制作・開発 Dardoは、オンラインで販売するブランドのために、ECサイトの設計・開発を行います。オリジナルやヘッドレス構成のストアフロント、決済サービスを利用したチェックアウトフロー、そしてチェックアウトやアプリの充実度から最適な場合にはShopifyストアまで対応します。まず商品カタログに合ったプラットフォームを選びます。既存のテーマで十分な場合は、その旨を正直にお伝えします。 執筆: Dardo編集チーム · 更新日: 2026年10月8日 · 2 分で読めます [WhatsAppでメッセージを送る](https://wa.me/573163373216?text=Dardo%20%E3%81%95%E3%82%93%E3%80%81%E3%81%93%E3%82%93%E3%81%AB%E3%81%A1%E3%81%AF%E3%80%82%E6%AC%A1%E3%81%AE%E4%BB%B6%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6%E6%8F%90%E6%A1%88%E3%82%92%E3%81%8A%E9%A1%98%E3%81%84%E3%81%97%E3%81%9F%E3%81%84%E3%81%A7%E3%81%99%3A%20EC%E3%82%B5%E3%82%A4%E3%83%88%E5%88%B6%E4%BD%9C%E3%83%BB%E9%96%8B%E7%99%BA) ## ECサイト開発に含まれるもの ご依頼内容に合わせて進め方を組み立てます。提案書には、どの成果物が含まれるか、必要な素材を誰が用意するか、各成果物をどのように検収するかを明記します。 - プラットフォームのご提案:Shopify、ヘッドレス、オリジナルのチェックアウト - カタログ設計:商品、バリエーション、コレクション、絞り込み - 商品ページ、コレクションページ、カート、チェックアウトのデザイン - 決済ゲートウェイの連携とサーバー側での注文確認 - Google向けの商品構造化データと配送・返品ポリシーの設定 - データ利用の同意取得と、チェックアウト各ステップの分析設定 - 商品、顧客、URL、リダイレクトの移行 ## オリジナルストアが適しているケース ストアが主要な販売チャネルで、カタログやチェックアウト、コンテンツにテーマ以上の機能が必要な場合に向いています。商品数が少なく標準的な配送で足りるなら、ご自身で設定したShopifyの適切なテーマで十分なこともあります。商品ではなく、アクセス権、サブスクリプション、アカウントを販売する場合は、Web App, SaaS and MVP Developmentのほうが適しています。 ## プラットフォーム選びから最初の注文まで まず、商品カタログ、決済方法、配送ルール、在庫や請求書を管理しているシステムを確認します。この確認をもとにプラットフォームを決め、カタログ設計、ページマップ、チェックアウトのデザインを作成します。すでにストアをお持ちの場合は、移行で何も失われないよう、最初に商品、顧客、URLをエクスポートします。 開発は商品ページとチェックアウトから始め、拒否、保留、返金済みの注文を含むサンドボックス決済でテストします。その後、コレクション、検索、コンテンツページ、外部連携を仕上げ、チェックアウト各ステップの分析を設定し、リダイレクトを整えて公開します。公開後は最初の注文を見守ります。 ## Shopify、ヘッドレス、オリジナルのチェックアウト:どれが合う? プラットフォームは、カタログとチェックアウトに合わせて選ぶものです。その逆ではありません。Shopifyのようなホスト型プラットフォームなら、保守されたチェックアウト、在庫管理ツール、スタッフアカウント、豊富なアプリが使えます。事業に必要な場合は、Dardoもその上で設計・構築します。ヘッドレスのストアフロントは、コマースのバックエンドを維持しながら、デザイン、コンテンツ、表示速度を自由に制御できます。決済サービスを使ったオリジナルのチェックアウトは、商品数が少ない場合、デposit(前払金)、受注生産品、予約やアカウントと結びついた購入に向いています。 規模については正直にお伝えします。商品数が少なく標準的な配送なら、標準テーマでも十分に売れることが多く、オリジナル開発の効果は小さいです。 __Shopify、ヘッドレス、オリジナルのチェックアウト:どれが合う?__ | 選択肢 | 向いているケース | 注意点 | | ----------------------- | ------------------------------------------------------- | ------------------------------------------- | | ホスト型プラットフォーム(Shopify) | 商品やバリエーションが多く、スタッフが毎日在庫を更新し、レビュー、配送、マーケットプレイス用のアプリを使いたい | 月額プランやアプリの費用、テーマによるデザインの制約、お住まいの国で使える決済方法 | | ヘッドレスストアフロント | ブランドやコンテンツが購買を後押しする、または複数のサイトや言語で1つのカタログを共有する | 2つのシステムを運用する必要があり、プレビューや編集に設定が必要で、開発の工数も増える | | 決済サービスを使ったオリジナルのチェックアウト | 商品数が少ない、前払金、受注生産品、予約やアカウントに紐づく購入 | 在庫、税、請求書、返金の処理を、自社のコードで保守することになる | | ご自身で設定する標準テーマ | 商品数が少なく、配送がシンプルで、予算が限られている | 他のストアと似た見た目になる。商品が増えれば手狭になる前提で考える | ## チェックアウトのどこで購入者は離脱するのか? ほとんどのカートは、決済まで至りません。Baymardが50件の調査をもとにまとめた平均カート放棄率は70.22%です。閲覧しているだけの買い物客を除くと、主な理由は、追加費用が高すぎる(40%)、配送が遅い(20%)、カード情報を預けるのに不安がある(19%)、アカウント作成を求められる(18%)、チェックアウトが長い・複雑(17%)です。 これらはいずれも、公開前に確認する設計上の判断です。チェックアウト前に配送料や手数料を表示し、商品ページに配送予定を載せ、よく知られた決済サービスを使い、ゲスト購入を標準にして、注文に本当に必要な入力項目だけに絞ります。チェックアウトの各ステップを計測するので、その後の改善は意見ではなくデータで判断できます。 ## コロンビアにおける決済と顧客データ コロンビアでは、Wompi、Mercado Pago、ePaycoがよく使われる決済ゲートウェイです。たとえばWompiは、カード、PSE、Nequi、Daviplata、Bancolombiaの振込、Bancolombiaの代理店での現金払いに対応しており、ドキュメントには、どの決済方法も即時に結果が返ることはないと記載されています。最終的なステータスは、あとから署名付きイベントで届きます。そのため、注文を支払い済みにするのは、検証済みのそのイベントが届いたときだけで、購入者がストアに戻ってきたことを理由にはしません。 Dardoの公開実績であるSuperameでも、別のプロバイダーで同じルールを採用しています。ホスト型チェックアウト、サーバー側で検証する署名付きコールバック、返金や紛争の冪等な処理です。これが示すのは決済確認のロジックであり、ストア運営ではありません。 顧客データには、証明できる同意が必要です。コロンビアのLey 1581 de 2012の第9条は、本人による事前の説明に基づく承諾を、後から確認できる方法で取得することを求めています。チェックアウトやニュースレターのフォームは、この承諾が明確な選択となり、日時と文言とともに保存されるように設計します。プライバシーポリシーと法的な確認は、お客様と弁護士の方で行っていただきます。 ## カタログ、検索、商品データ、移行 ストアの質はカタログ設計で決まります。デザインの前に、商品、バリエーション、属性、コレクション、購入者が実際に使う絞り込み条件、そして各項目を誰が編集するかを定めます。検索と絞り込みはこれらの属性をもとに構築し、検索結果がゼロだったキーワードを記録するので、購入者が求めていて見つからなかったものを確認できます。 Googleのマーチャントリスティングでは、name、image、価格を含むOfferを備えたProduct構造化データが必要です。また、標準の配送ポリシーと返品ポリシーは、Organizationマークアップで一度だけ宣言することがGoogleから推奨されています。Dardoではこの両方をカタログから生成するため、マークアップ上の価格とページ上の価格がずれることはありません。 既存ストアの移行では、プラットフォームが対応している範囲で商品、画像、顧客、注文履歴をエクスポートし、旧商品URLと旧コレクションURLのすべてを新しいアドレスへ301リダイレクト(恒久的なリダイレクト)で対応付けます。そしてドメインを切り替える前に、件数とサンプルデータを照合します。 ## ご依頼前のご質問 **ECサイトの制作費用はどのくらいですか?** 内容によって異なります。プラットフォーム、商品タイプやバリエーションの数、チェックアウトの独自ロジック、決済・配送の連携、コンテンツ、移行の規模などが影響します。カタログと注文フローを確認したうえでお見積りします。テーマで十分な場合は、テーマの利用をおすすめします。 **Shopifyとカスタムストア、どちらを選ぶべきですか?** 保守されたチェックアウト、在庫管理ツール、アプリを使いたく、デザインがテーマまたはカスタムテーマの範囲に収まるならShopifyが向いています。コンテンツやブランドが売上を左右する場合、購入が予約、アカウント、デposit(内金)と結びついている場合、またはカタログが小さく、フル機能のプラットフォームではコストに見合う利点がない場合は、ヘッドレスまたはカスタムを選びましょう。Dardoはどちらも設計・構築します。 **コロンビアのストアではどの決済ゲートウェイを使えますか?** コロンビアでは、Wompi、Mercado Pago、ePaycoがよく使われています。最適な選択は、購入者が使う決済方法、入金までの期間、手数料、保留中の支払いの通知方法によって変わります。ご利用の注文フローに照らして比較し、お選びいただいたものをサーバー側での確認付きで連携します。 **現在のストアを移行できますか?** はい。商品、画像、顧客、そして移行元のプラットフォームが対応していれば注文履歴をエクスポートし、旧URLのすべてを新しいページへ301リダイレクト(恒久的なリダイレクト)で対応付け、ドメインを切り替える前に件数とサンプルデータを照合します。旧プラットフォームが顧客のパスワードをエクスポートできない場合は、アカウント有効化のご案内メッセージについて一緒に計画します。 **日々の商品管理は誰が行いますか?** お客様のチームです。スタッフが開発者なしで商品の追加、価格や在庫の変更、コレクションの公開ができるようにカタログを設定し、納品時にトレーニングも行います。Shopifyの場合はShopify管理画面で、ヘッドレスやカスタムストアの場合は私たちが構築するCMSまたは管理画面で行います。 **どのようなものを用意すればよいですか?** スプレッドシートまたはエクスポート形式の商品データ、商品写真、配送・返品のルール、貴社名義の決済ゲートウェイアカウント、プライバシーポリシーと利用規約をご用意ください。商品撮影やコピーライティングがまだない場合は、スコープに追加できます。 **公開後もストアの改善を続けてもらえますか?** はい、ご希望であれば対応します。公開後は、チェックアウト各ステップのデータ、検索結果がゼロだった検索、商品ページでの行動を確認し、改善案を提案します。計測できるだけのアクセスがある施策はテストします。進め方はConversion Rate Optimizationで説明しています。特定のコンバージョン率をお約束することはありません。 ## 出典・参考資料 このページの出典です。詳細は各発行元の原典をご覧ください。 - [Baymard Institute:カート放棄率の統計](https://baymard.com/lists/cart-abandonment-rate) · baymard.com - [Google Search Central:マーチャントリスティングの構造化データ](https://developers.google.com/search/docs/appearance/structured-data/merchant-listing) · developers.google.com - [Wompi:決済方法(コロンビア)](https://docs.wompi.co/docs/colombia/metodos-de-pago/) · docs.wompi.co - [Wompi:イベントと署名検証](https://docs.wompi.co/docs/colombia/eventos/) · docs.wompi.co - [2012年法律第1581号(コロンビア)第9条](https://cancilleria.gov.co/normograma/compilacion/docs/ley%5F1581%5F2012.htm) · cancilleria.gov.co [Dardo](https://dardo.studio/ja/) · [サービス](https://dardo.studio/ja/services/) · ECサイト開発 ## 関連する実績・事例 [![superame.lol のウェブサイト(Dardoのプロジェクト)](https://dardo.studio/work/superame-1.webp?v=34a51b35f537) · 実践例 / 制作実績 · **superame.lol** · プロジェクトを見る](https://dardo.studio/ja/work/superame/) ## ストアに合ったプラットフォームを選ぶ カタログの規模、購入者が利用する決済方法、現在お使いのプラットフォームをお知らせください。お見積りの前に、Shopify、ヘッドレス、カスタムチェックアウトのうち最適なものを、理由とともにご提案します。 [01 · **関連する実績を見る** · superame.lol](https://dardo.studio/ja/work/superame/) · [02 · **近いサービスと比較する** · Web開発](https://dardo.studio/ja/services/web-development/) · [03 · **ご要望を相談する** · お使いの言語で、スコープを明確にした提案をご依頼いただけます](https://dardo.studio/ja/contact/?service=ecommerce-development) ## もっと見る - [![superame.lol — サイトのプレビュー](https://dardo.studio/_astro/01M4H711Q11QCMQDA10WE4A1K7_ZrTSRU.webp) · 事例紹介 · **superame.lol — Webデザイン事例**](https://dardo.studio/ja/work/superame/) - [サービス · **コロンビア・ボゴタのWeb開発会社**](https://dardo.studio/ja/services/web-development/) - [サービス · **コンバージョン率最適化(CRO)サービス**](https://dardo.studio/ja/services/conversion-rate-optimization/) - [サービス · **Webアプリ・SaaS・MVP開発**](https://dardo.studio/ja/services/web-app-development/)