楽天ECサイトのページの作り方を解説|初心者でも簡単に出来る作成ツールも紹介【2024年最新版】

楽天ECサイトの作り方を解説!初心者でも簡単に出来るツールも紹介

「ついに、自社の楽天ECサイトを作るぞ」と思ったものの、まず何から準備を始めたらいいのかわからず困っていませんか。

この記事では、楽天に出店するまでに必要な準備を、ステップに沿って紹介しているのでどのように進めればいいかが初心者でも理解できます

さらにHTMLを使わずに簡単に作れるサイトの作り方から、オリジナリティの高い自由なページの作り方まで解説します。出店はできたが、どんなサイトを作ればいいのかが分からないと不安な方も、サイトを作って販売するまでの手順を理解してもらえます。

※現在、楽天ECサイトの立ち上げを検討している方はWeb幹事にご相談ください。サイトのイメージや予算、お困りの課題をヒアリングし、最適な提案をさせていただきます。

【無料】楽天のECサイトについてプロに相談する

目次
  1. 1. ECサイトのページ構築タイプ
    1. 1-1. 自社サイト型
    2. 1-2. ショッピングモール型
  2. 2. 楽天でECサイトを作るには?必ずやるべき準備と流れを紹介
    1. 2-1. 出店準備
    2. 2-2. プラン選択
    3. 2-3. 出店申し込み
    4. 2-4. 店舗構築
    5. 2-5. ショップ開店
  3. 3. 初心者でも出来る!難しいコードを使わない楽天サイトの作り方
    1. 3-1. 楽天のページ作成ツールを利用する
    2. 3-2. 楽天GOLDの無料テンプレートを利用する
  4. 4. 上級者向け!より完成度の高い楽天サイトの作り方
    1. 4-1. 制作会社に依頼する
    2. 4-2. RMSサービススクエアを利用する
  5. 5. 楽天ページを作る際のポイント
    1. 5-1. わかりやすいページにする
    2. 5-2. 信頼感を与える
    3. 5-3. スマホ・アプリにも配慮する
  6. 6. 参考にしたい楽天ECサイトのデザイン事例6選
    1. 6-1. 食品:タマチャンショップ
    2. 6-2. 美容:and Habit
    3. 6-3. ファッション:イーザッカマニアストアーズ
    4. 6-4. インテリア:kakko
    5. 6-5. 家電:roomy
    6. 6-6. 番外編:楽天GOLDを使っていないTOPページ
  7. 7. 【まとめ】楽天ECサイトを作るポイント

ECサイトのページ構築タイプ

 

メリット

デメリット

自社サイト型

・デザインや商品の見せ方など

 オリジナルのお店にできる

お店の存在を知ってもらうための

集客施策に苦労する

ショッピングモール型

・モールに集客力があるので

 商品を見てもらえやすい

お店の特徴・独自性を出しにくい

楽天のページの作り方を説明する前に、ECサイトの2つの構築タイプの違いを説明します。両者の違いを理解しておくことで、楽天ページを作るときのイメージがしやすくなります。楽天ページは「ショッピングモール型」になります。

自社サイト型

ヤクルト

画像引用:ヤクルト

自社サイト型は、ECサイト構築ツールなどを使って、自分のオリジナルのお店のWebサイトを作ることです。独自のお店なので、例えば動画を入れたり、ポイント制度を入れたりと、デザインや機能など自由に決められます。ただし、ECサイトを作ったあと、お店に来てもらうための広告、宣伝が必要になります。

ショッピングモール型

楽天市場

画像引用:楽天市場

ショッピングモール型は、すでにある母体(デパートや百貨店)などに自分のお店や商品を出店・出品する方法です。上の画像は楽天市場というショッピングモールに「ボタニスト」が出品した例。すでにお客様の多い場所に出店するので、自社サイト型より集客面で楽になります。ただし、ショッポングモールによってデザインや機能などが決められているので独自性はできにくいです。ショッピングモール型は「マーケットプレイス型」「テナント型」の2つに分かれます。

マーケットプレイス型

Amazon_サイドバー

画像引用:Amazon

Amazonやメルカリなど、お店ではなく商品を「出品」する形式です。お店の特色は出ず、商品の説明を書くことになります。

テナント型

タマチャンショップ

画像引用:タマチャンショップ

ショッピングモールに自分のお店を「出店」する形式です。デザインや機能は決められていますが、他の商品も見てもらえ、お店の存在を少し知ってもらえます。楽天市場も出店するので「テナント型」になります。より詳しい違いを知りたい方は下記の記事をご覧ください。

関連記事ECプラットフォームとは?選び方、4つのサービスを徹底比較!

【無料】楽天のECサイトについてプロに相談する

楽天でECサイトを作るには?必ずやるべき準備と流れを紹介

出店準備

楽天でサイトを作るには、まずは出店準備をする必要があります。商品を用意しサイトを作るだけでは楽天で販売は開始できないので、以下の流れをしっかりと理解しましょう。

出店準備

・プラン選択

・出店申し込み

開店準備

・店舗構築

開店

・ショップ開店

楽天への出店から開店までは、それぞれのステップでやるべき作業や準備があります。

プラン選択

楽天市場には3つの出店プランがあり、規模や商品数などによって選べます。

 

がんばれ!プラン

スタンダードプラン

メガショッププラン

月額出店料

19,500円/月

(税別)

50,000円/月

(税別)

100,000円/月

(税別)

システム利用料

3.5~7.0%

2.0~4.5%

2.0~4.5%

登録可能商品数

5,000商品

20,000商品

無制限

システム利用料は月間売上高に対してかかるので、売上げの規模によって月額の費用が変わります

システム利用料が一見高く見えますが、ECの出店が初めて、経験が少ない場合は割安な料金でスタートできる「がんばれ!プラン」を選んでおきましょう。規模や商品数が多くなってきたら、プランをアップグレード申請できます。

出店申し込み

楽天市場の出店申し込みフォームに、出店者の情報と出店する店舗の情報を入力します。

出店申し込み

画像引用:楽天市場

会社情報には出店する事業形態が会社であれば法人を、個人の場合は個人事業主を選択し、所在地住所や電話番号などの基本情報を入力していきます。

出店申し込み②

画像引用:楽天市場

これから出店する店舗の責任者情報と、取扱いジャンルを記入していきます。登録する電話番号に携帯番号は不可、メールアドレスにフリーアドレスは不可となるのでご注意ください。
すべての入力が完了したら出店申し込み完了となり次の申し込み手続きに進みます。

楽天市場

画像引用:楽天市場

出店申し込みページでは、取扱予定商材の詳細についてや出店プラン、希望のURLなどの情報入力や、必要書類の手続きを進めていきます。
出店申込から利用開始までの期間はおおよそ2週間~1ヵ月ほどが目安です。

店舗構築

出店申し込みが完了するとRMS(​Rakuten Merchant Server​)と呼ばれる楽天独自の店舗運営システムが利用できるようになります。Google Chromeなどのインターネットを使って様々な情報を管理できます。RMSではショップをオープンする際に必ず必要な店構えのすべてを設定します。

店舗構築

※画像引用:楽天市場への出店・開業案内

楽天で出店する場合、店舗の基本的な構造は「トップページ」「カテゴリページ」「商品ページ」の3階層で出来ています。
この他に「会社概要」などの基本情報ページも作成しないといけません。

カテゴリ作成

カテゴリ作成

カテゴリは取り扱う商品をどのような切り口で見せるのかを決め、商品の分類を作成します。
ブランドや靴・バッグなどの商品分類、サイズやジャンルなど、ショップに訪れるユーザーがどのように商品にたどり着くかを想定して決めていきましょう。

商品登録・商品ページ作成

商品登録・商品ページ作成

店舗で販売する商品を登録していきます。
商品ごとに画像・説明文・価格などの情報を入力していきます。商品ページはユーザーの目に直接触れ、購入の判断をされるページなので、機能や性能など十分な情報を記載しておきましょう。

基本情報ページ作成

基本情報ページ作成

ユーザーが安心して買い物ができるために、会社概要や決済・配送情報を作成します。クレジット決済・銀行振り込みなど支払いに利用できる決済方法や、利用する配送業者や送料など詳細を記載します。

店舗デザイン

店舗デザイン

店舗の枠組みとなるデザインを作成します。大きく「看板」「メニュー一覧」「店舗情報」の3つから構成されていて、この枠組みは店舗内のすべてに反映されるデザインとなります。
複数のデザインを作成し、カテゴリや商品にあわせてデザインを使用することもできるのでショップのイメージに合わせて用意しましょう。

トップページ作成

トップページ作成

ショップの顔となるトップページをデザインします。
ショップ全体のイメージを印象付ける重要な役割となるので、代表的な商品やブランドを表現する画像を配置しましょう。
また新商品やランキング、サイトのカテゴリなどを置くことでサイト全体の回遊性を高めましょう。

ショップ開店

ショップの準備が整い、オープン審査を通過したらついにショップの開店です!
開店後は実際に楽天市場内でユーザーが検索し、商品を購入できるようになります。

【無料】楽天のECサイトについて相談する

初心者でも出来る!難しいコードを使わない楽天サイトの作り方

HTMLやCSSなどのサイト制作に必要な知識に自信がなくても、ツールやサービスを利用すれば簡単に楽天のECサイトを作れます。

メリット

・専門知識がなくても簡単にサイトが作れる

・時間や人手が足りなくても簡単に完成できる

デメリット

・決められたデザインなのでオリジナリティに欠ける

・カスタマイズがしにくい

簡単にサイトを作るメリットは、難しい作業がないので時間や費用をかけずに制作できることがあげられます。一方で、簡単に作れる範囲内でサイトを作ることになるので、自由度は少なくなる点は理解しておきましょう。
初心者が自分でサイトを作る方法は、HTMLの知識が多少あるか、または全くないかでも変わるので、それぞれ紹介していきます。

楽天のページ作成ツールを利用する

  compass SUMAOU! EasyPage Biiino

料金

2,980円 3,980円 5,000円 4,500円
商品登録機能 × ×
画像作成機能 × ×
HTML機能
電話サポート

RMSサービススクエアの表をもとにWeb幹事で作成
※料金はすべて税抜きの月額料金

まったくの初心者でHTMLの知識が全くない場合はページ制作ツールを使いましょう。難しいコードは一切使わず、初心者でもキレイなサイトが簡単に作成できます。
楽天市場が公式で出店店舗に向けたページ制作ツールを紹介しているので、中でもおすすめのツールを解説していきます。

compass(コンパス) for 楽天市場

compass(コンパス) for 楽天市場

※画像引用:compas

特徴

・初心者でも使いやすい

・画像作成・ページ作成・商品登録も可能

料金

月額2,980円(税別)

商品登録機能
画像作成機能
HTML機能
電話サポート

compassはこれから出店準備を進める初心者でも、簡単にシンプルなサイトが作れるツールです。
PC・スマホページを最短1日で自動作成が可能です。HTMLなどの専門的な知識がなくても、トップページから商品ページ、商品登録までをツール内で完了できます。

SUMAOU!(スマオウ!) for 楽天市場

SUMAOU!(スマオウ!) for 楽天市場

※画像引用:SUMAOU!

特徴

・最短10分でスマホサイトを作成可能

・無料テンプレートをつかってサイトページを自由にデザイン

・1日1回の自動更新パーツ

料金

月額3,980円(税別)

商品登録機能 ×
画像作成機能 ×
HTML機能
電話サポート

SUMAOU!は、HTMLの知識がなくてもスマホサイトをクリック作業で簡単に作成できます。
無料のテンプレートが豊富で、毎月新しいデザインが提供されます。季節やショップの商品に合わせてオリジナルのトップページや特集ページの作成が可能です。
さらに「新着・更新アイテム」「レビュー高評価アイテム」などのパーツは1日1回の自動更新でラインナップや並び替えがされ更新も簡単です。

EasyPage for 楽天市場

EasyPage for 楽天市場

※画像引用:EasyPage

特徴

・PC・スマホを同時に更新できるサイト作成

・多店舗運営にも利用可能

・多様な自動更新パーツ

料金

月額5,000円(税別)

商品登録機能 ×
画像作成機能 ×
HTML機能
電話サポート

EasyPageは、ドラッグ&ドロップの直感的な操作で簡単にサイトを作成できます。
楽天はPCとスマホページを同時に更新できるレスポンシブデザインや、キャンペーンバナー・レビュー・新着など自動更新パーツもあり運営の手間が省ける機能が整っています。
また追加費用なしでショップを追加できるので、楽天だけではなく多店舗展開したいと思っている場合でも十分活用可能です。

Biiino(ビーノ)for 楽天市場

Biiino(ビーノ)for 楽天市場

※画像引用:Biiino

特徴

・高品質な特集ページを作成

・SEO対策に対応した構築

・画像加工機能で商品購入率をアップ

料金

月額4,500円(税別)

商品登録機能
画像作成機能
HTML機能
電話サポート

Biiinoは、簡単に高品質でオリジナリティの高いページを作成できます。カスタマイズ性が高いので、テンプレートを使うだけのデザインにはなりません。
作成した特集ページやトップページは、Google検索エンジンの最適化も考慮されSEOの対策までカバーしています。
専用の画像加工ソフトを使わなくても、画像の色調補正や文字入れ、アイコンの挿入など簡単に画像を加工できるので、より購入されやすい画像作成ができます。

楽天GOLDの無料テンプレートを利用する

楽天GOLDの無料テンプレートを利用する

※画像引用:楽天ショップ用テンプレート販売

楽天GOLDは無料でつかえる楽天市場内のサーバーです。既存のパーツだけではなく、自由にトップページをデザインするためには楽天GOLDの利用が必須です。楽天GOLDはHTMLを使って自由にトップページを作成できるため、テンプレートの中を自分のショップに合わせて変えればオリジナルのサイトができるのです。

​​大きな画像やキレイなサイトにするだけでなく、バナーをスライドさせたり、メニューバーを固定させたりといった動作も自由に設定できます。

さらにサイト全体のデザインだけではなく、商品ページの注文ボタン近くに当日配送までの時間やカウントダウンを表示させることも可能です。既存のパーツでは表現しきれないデザインにすることで、購入しやすいサイトを作れます。

テンプレートは無料から有料まであり、基本的には一度購入すればその後のランニングコストはかかりません。初心者で何を選んでいいかわからないのであれば、無料のものか、安価なテンプレートでまずは試してみるといいでしょう。

楽天GOLDでデザインする方法

HTMLを使ってページをデザインするためには、CSSなどのサイトを構築するファイルをアップロードするサーバーが必要になります。
出店プランに関係なく利用申請が出来るので、オリジナルのトップページをデザインしたい場合は必ず申請しましょう。

楽天GOLDでデザインする方法

ただし、楽天GOLDはサーバーにファイルを転送する「FTPソフト」が必要だということは覚えておいてください。もし何を使ったらいいのかわからないのであれば、楽天が無料で提供している「Ribrary」などの無料ツールを使ってみることをおすすめします。

【無料】楽天サイトの作り方について相談する

上級者向け!より完成度の高い楽天サイトの作り方

他のサイトと差別化したい、ブランドやショップの世界観を最大限表現したい場合は、HTMLを使ってサイトを作ることをおすすめします。

メリット

・オリジナリティのあるサイトを自由にデザインできる

・売れやすいサイトにカスタマイズ可能

デメリット

・HTMLなどのデザインの専門知識が必要

・時間や費用がかかる

HTMLを使うと、画像のサイズや位置、見せたいパーツなど自由にデザインできるので思い通りのサイトが作れます。
ただし当然専門のデザイン知識やコードを使う必要があるため、初心者が独学で作ることは難しいです。また作りこみによっては制作時間や、自社内で制作しないのであれば費用もみておく必要があります。

制作会社に依頼する

楽天市場のサイトやページを専門に作っている制作会社に依頼すれば、デザインの専門知識がなくても思い通りのサイトを作ることが可能です。
制作会社に依頼するのはサイトすべてである必要はありません。力を入れたい商品ページや、サイトのトップページなどパーツごとに依頼することも出来ます。
制作費用・時間を事前に見積もっておくと安心です。

商品ページ制作の相場

費用

20,000~250.000円

納期

5日~20日

商品ページはユーザーが購入を決意する重要なページです。
商品画像から商品の詳細を説明するページ構成まで、しっかりと作り込むことでより魅力的なページとなります。
画像の枚数やボリュームによりますが、簡単なページであればおおよそ10万以下で7日ほどの納期で制作が可能なところが多いです。

トップページ制作の相場

費用

30,000~500.000円

納期

5日~20日

ショップのトップページは店の顔となるページです。サイト全体を印象づけるだけではなく、いろいろなカテゴリやおすすめ商品など、ショップ内を買いまわってもらうためにもしっかりと構築する必要があります。

さらに更新しやすい作りにして今後の運用をしやすい作りにしましょう。
ページの構成や更新パーツの作りなど要素も多いため、商品ページに比べてやや費用・納期共に相場は高くなります。

※どの制作会社が自社に合うかを見つけるのは大変です。Web幹事は無料で自社に合う制作会社を選定、紹介します。相談料、紹介料ともにかからない完全無料のサービスなので、ぜひご相談ください。

【無料】楽天のECサイト制作におすすめの会社を紹介してもらう

RMSサービススクエアを利用する

RMSサービススクエア

画像引用:RMSサービススクエア

楽天ページを作成する方法として「RMSサービススクエア」を利用するのもひとつです。は、「楽天市場」公式の店舗運営支援の有料サービス。ページ制作、画像撮影、画像加工、受注管理、顧客対応、ページ分析など店舗運営に関わるあらゆる作業を代行してくれます。

RMSサービススクエア

画像引用:RMSサービススクエア

出店プランは主に上の3つに分かれます。詳しくはお問い合わせページより確認ください。

【無料】楽天サイトの作り方について相談する

楽天ページを作る際のポイント

楽天ページを作る際のポイント

わかりやすいページにする

ECサイトにおいては、訪問者にわかりやすいページにすることが肝心です。自分がお客様になったつもりで、文字数は適切か。過不足していないか。文字ばかりになっていないか。画像は多めに使われているかなど、その商品を全く知らなくても良さが理解できるか、買い物がしやすいかなど考えてページを作成しましょう。他のお店のページを訪問して参考にしてください。

服の写真であれば、それを着たひとの写真も載せる。雑貨であれば正面写真だけではなく横や斜め、後ろから見た写真も入れるなど工夫が必要です。

信頼感を与える

ECサイトはお客様が実店舗を訪問できず、販売者の顔が見えません。そのため、怪しいお店ではないと信頼感を与えることが重要です。どんなお店なのか、どんな商品を取り扱っていのかなど、きちんと説明を入れましょう。写真も安っぽければお客様が不安に感じてしまいます。

また、ECサイトは商品を手に取れないので、実際に商品が届いてからイメージと違うことがないようにすることが重要です。先ほど「わかりやすいページにする」と説明したのは、商品を売れるようにするためだけでなく、購入したお客様に不満を与えないようにする意味もあります。もし、商品が届いてからイメージと違えばクレームやSNSでのネガティブな書き込みにもつながります。

信頼感を与えるには「お客様の声を載せる」や「著名人やインフルエンサーを起用する」なども効果的です。

スマホ・アプリにも配慮する

楽天ページにおいては、購入者の半分以上がスマートフォン経由で買い物をします。特に楽天アプリが登場してからは、ポイントが貯まりやすいのでスマホ利用者が増えています。商品ページを作るときはパソコンで作ったとしてもスマートフォンで見にくくないか、買い物がしやすいかを必ず確認しましょう。

【無料】楽天のECサイトについて相談する

参考にしたい楽天ECサイトのデザイン事例6選

食品:タマチャンショップ

食品:タマチャンショップ

※画像引用:タマチャンショップ

自然食材をうりにした「しあわせ食」をコンセプトにした食品の店舗です。
あたたかいイラストをベースにしたデザインや、多岐にわたる商品をまんべんなく見せられるようバナーがスライダーになっているなど工夫されています。

食品:タマチャンショップ②

ショップ内にはランキングや、リアルタイムの注文状況が見られるコンテンツもあり、にぎわいのあるショップをアピールできます。

美容:and Habit

美容:and Habit

※画像引用:and Habit

サイトのトップには大きな画像でメインとなる商材が印象的に配置されています。
全体的にシンプルですっきりとしたデザインになっていて、ブランドの世界観が伝わるサイトです。

美容:and Habit②

多数あるブランドはロゴとイメージ写真で表現されているため、サイトを訪問したユーザーは目的のブランドを見つけやすい構成になっています。

ファッション:イーザッカマニアストアーズ

ファッション:イーザッカマニアストアーズ

※画像引用:イーザッカマニアストアーズ

サイトのトップには特大の画像でイベント中のPRがされ、画像を効果的に活用しています。
商品画像がふんだんに並べられており、カタログのように楽しめる作りになっています。

ファッション:イーザッカマニアストアーズ②

画像やアイコンでキャンペーン中の商品が装飾されているなど、サイトのサイドやフロートのバナーで特典を訴求しています。

インテリア:kakko

インテリア:kakko

※画像引用:kakko

ナチュラルな北欧インテリアをカタログのようにおしゃれな画像を使ってシンプルに見せているサイトです。
動画をつかってサイトのコンセプトを紹介したり、固定メニューを設置したりとユーザーが買いやすく伝わりやすいサイトづくりの工夫がみられます。

インテリア:kakko②

また商品を並べるだけではなく、特集中で生活の提案をしながら商品を紹介するなど、企画ページも充実しています。

家電:roomy

家電:roomy

※画像引用:roomy

サイトトップは一面に動画を表示して、商品の特徴や使用イメージを大胆に見せています。
ブランドや季節の特集も充実させ、それぞれの特集ページではブランドの世界観を表現しながら商品を紹介しています。

家電:roomy②

画像を印象的に使っていることが特徴で、おしゃれな画像がきれいに並べられていて、商品名や価格は商品画像の上にマウスを載せると表示されます。

番外編:楽天GOLDを使っていないTOPページ

番外編:楽天GOLDを使っていないTOPページ

※画像引用:cocoa

こちらのサイトはTOPページの作成に楽天GOLDを使わずに作成されています。
画像のサイズやパーツなど、既存のパーツを組み合わせているため自由度は低いですが、フォントの使い方やカラー、画像を工夫して十分にキレイなサイトが作れます。

番外編:楽天GOLDを使っていないTOPページ②

新商品やお知らせなど、それぞれ必要なパーツの位置を決め、情報を登録していくだけで作れます。

【無料】楽天のECサイトについて相談する

【まとめ】楽天ECサイトを作るポイント

楽天でECサイトを始めるために知っておくべき手順、準備やサイトの作り方を解説してきました。

出店の申請から開店まで、それぞれの準備がありますが、最も考えなければいけないのは「どういうサイトにしたいのか」「お客様にどのように見せたいのか」を意識したショップづくりです。
サイトのデザインだけではなく、カテゴリや商品画像の見せ方、バナーの設置などひとつひとつを考えていく必要があります。

手間や費用をかけなくても、基本のつくりをしっかりと踏まえていれば初心者でも売れるサイトを作れます。

※どうやってECサイトを始めたらいいのかわからない、売れるサイトの作り方を知りたい、そんな場合はプロの意見を聞く方が間違いや手間を省けます。まずはWeb幹事にご相談ください。
予算や目的などをヒアリングした上で、楽天でのECサイト制作を得意とする会社を紹介します。

コンサルタントのご紹介 Web幹事 コンサルタント 岩田真 岩田 Web制作会社を設立し、
3年間で上場企業を含む50社以上制作に携わらせていただきました。

様々なお客様のWeb制作を実際に行ってきましたので、
初心者の方でも安心してご相談ください!

相談料や紹介料は一切かかりません。自社の場合、どれくらい費用がかかるのだろう?といった相談だけでも大丈夫です。

【無料】楽天のECサイトについてプロに相談する


Q. ホームページ制作の費用相場は?

ホームページ制作の費用相場は、小規模サイトであれば10万円~150万円、中規模なら~500万円、大規模になると数百万円~数千万円になることもあります。

Q. 楽天ECサイトを立ち上げるには何から始めればいいですか?

まずは出店前にプラン選択と出店申し込みが必要です。その後に店舗構築・ショップ開店の準備を進めていきます。詳細は記事内をご覧ください。