ホームページ作成
サロンのHPを自分で作る方法｜写真・メニュー・予約まで失敗しない手順【2026年版】
最終更新: 2026年6月29日
「外注は高そう、でも自分で作れる気もしない」——そう感じて手が止まっていませんか。結論からお伝えすると、いまはノーコードのツールを使えば、写真・メニュー・予約までその日のうちに公開できます。この記事は、実際の作る手順と、つまずきやすいポイント、そして競合記事があまり触れない「予約まわりの費用の見方」までを順番に解説します。写真は良い例・悪い例の作例つき、ツールの弱みも正直に書きます。読み終えるころには、自分で作る道筋とツールの選び方がはっきりするはずです。
「ホットペッパー／SNSがあればHPは不要」は本当か
予約媒体やSNSは集客の入り口として有効です。ただ、それだけだと「数あるサロンの中の一つ」として比較されやすく、世界観や指名動機を十分に伝えきれない面があります。自店のHPは、媒体の掲載枠とは違い、載せる情報も見せ方も自分でコントロールできる「自店の資産」です。直接予約やリピートにつなげやすくなる点で、媒体と併用する価値があります。
「そもそも美容室にHPは必要なのか」という論点そのものは、別記事で深掘りしています。美容室にホームページは必要か
自作・無料ツール・外注の比較（費用・公開速度・予約連携・更新の手間）
選択肢は大きく3つあります。費用や公開速度、予約との連携、更新のしやすさで整理すると次のようになります。各社の費用・機能は変わるため、最新は公式の料金ページをご確認ください。
| 項目 | 外注（制作会社） | 無料ホームページ作成ツール | ノーコードSaaS（サロン特化型を含む） |
|---|---|---|---|
| 初期費用 | 一般に数十万円規模になると言われる（公式見積もりで要確認） | 0円 | 0円〜（VANNAは初期費用0） |
| 月額／運用費 | 保守費・更新都度の費用 | 0円（有料プランで機能拡張） | 月額制 |
| 公開までの速さ | 数週間〜 | 自分次第・即日も可 | テンプレ利用で当日も可 |
| 予約機能 | 要件次第（別途費用） | 外部予約への誘導が中心のことが多い | HPと一体型の予約を備える製品がある |
| 更新の手間 | 依頼が必要なことが多い | 自分で更新可 | 自分で更新可 |
| 独自ドメイン・広告非表示 | 可 | プランにより制限あり | プランにより可 |
無料ツール（例: Wix、Jimdo、ペライチ、グーペなど）は0円で始められる反面、独自ドメインや広告非表示、予約・決済まわりが上位プランや外部連携前提になることがあります。事実として費用・機能で比較し、自店の必要機能と照らして選ぶのがおすすめです。各社の正確な仕様は公式情報をご確認ください。
自分で作るのに向いているサロン／外注した方がよいサロン（自己診断）
次の5問に「YES」が多いほど、自作が向いています。
- 1人〜小規模で、更新を自分（スタッフ）でやりたい
- 予約や顧客管理もできれば一つにまとめたい
- 凝ったデザインより、情報の分かりやすさと更新の速さを優先したい
- 初期費用はできるだけ抑えたい
- まず公開して、運用しながら直していくスタイルでよい
逆に、独自性の高いデザインや大規模なコンテンツが必須で、制作に時間をかけられる場合は外注が向きます。なお、ノーコードでまず自作して始め、軌道に乗ってからデザインを外注に切り替える、という段階的な進め方も可能です。
作り始める前に準備するもの（写真・原稿・メニュー表）
HPに最低限必要なページ・要素チェックリスト
最初から完璧を目指す必要はありません。最小構成は5ページあれば公開できます。
- トップ（コンセプトが伝わるメイン写真＋キャッチ）
- メニュー・料金
- スタッフ紹介
- アクセス（地図・営業時間）
- 予約
余裕が出たら、コンセプト紹介・お知らせ／ブログ・FAQを足していきましょう。この節は「何を用意するか」の準備リストです。「どう作るか」は後半の手順、つまずき対策は失敗の章で扱います。
準備にかかる時間の目安と進め方
あくまで目安ですが、写真撮影は半日、原稿は1〜2時間、メニュー整理は1時間ほどで、骨組みは用意できます。
ポイントは「完璧を目指さず、まず公開してから直す」こと。ノーコードのツールなら、公開後も写真や文章を何度でも編集できるので、走りながら整えていけます。
【写真】サロンらしさが伝わる写真の撮り方・選び方
スマホで“それっぽく”撮る5つのコツ
特別な機材がなくても、次の5点を意識すると印象が伝わりやすくなります。それぞれ「悪い例→良い例」で覚えるのが近道です。
- 光: 照明だけ・逆光だと顔や店内が暗くなりがち。窓際の自然光を斜めから当てると、やわらかい印象になります。
- 構図: 真正面のベタ撮りは平板に見えがち。少し斜めの角度から撮ると奥行きが出ます。
- 水平: 床や棚のラインが傾くと不安定な印象に。グリッド表示を使って水平・垂直を合わせます。
- 余白: 要素を詰め込みすぎず、上下左右に余白をとると洗練して見えます。
- 色味: 加工は明るさ・コントラストを軽く整える程度に。実物と大きく違う色にしないのがおすすめです。
載せるべき写真の種類
- 外観（道からの目印になる一枚）
- 内観（席まわり・雰囲気が分かるカット）
- 施術風景（手元など。お客様が写る場合は許可を）
- スタッフ（人柄が伝わると指名につながりやすい）
- メニューを象徴するカット（仕上がりやアイテムのイメージ）
ビフォーアフター写真を載せる場合は、誇大・断定にならないよう注意し、「効果や仕上がりには個人差があります」といった注記を添える運用にしましょう。施術効果を断定する表現は避けます〔出典: 消費者庁 景品表示法 https://www.caa.go.jp/policies/policy/representation/fair_labeling （参照2026-06-29）〕。
写真がない・撮るのが苦手なときの代替策
すぐに良い写真が用意できなくても、まず公開して後から差し替える前提で進めれば大丈夫です。商用利用可のフリー素材を使う場合は、利用範囲やクレジット表記の要否を必ず確認します。ただし「いかにも素材」な写真ばかりだと自店らしさが薄れるので、店内全体が難しければ、手元カットやメニューを象徴する小物のアップなど、撮りやすい一部分から実写を足していくのがおすすめです。
【メニュー】伝わる＆予約されるメニューの作り方
価格・所要時間・対象の3点を必ず書く
お客様が迷わないために、各メニューには最低限この3点を記載します。
- 価格: 税込で明示。「〜から」と書く場合は、どの条件で価格が変わるかも添える
- 所要時間: 目安の分数（例: 約90分）
- 対象: 初回／通常の区別、対応できる髪質や悩みなど
価格を分かりにくく見せると、景品表示法上の問題につながることがあります。初回限定価格と通常価格は明確に区別し、総額が伝わる表記を心がけましょう〔出典: 消費者庁 景品表示法 https://www.caa.go.jp/policies/policy/representation/fair_labeling （参照2026-06-29）〕。
「選ばれる」メニュー名と説明文の書き方
説明文は「悩み→提案→所要時間（＋個人差注記）」の順で、お客様が使う言葉で書くと伝わります。効能・効果を断定する表現（薬機法に抵触しうる表現）は避けます。
NG文例（断定・効能表現）:
このトリートメントで髪のダメージが治り、くせ毛が改善します。
OK文例（悩み→提案→所要・個人差）:
広がり・パサつきが気になる方へ。質感を整えるトリートメントで、まとまりやすい状態を目指します（約30分／仕上がりには個人差があります）。
NG文例（最上級・成果断定）:
当店なら絶対に小顔になれる、地域No.1の技術。
OK文例:
フェイスラインの印象が気になる方に向けた施術です。お悩みを伺いながら進めます（仕上がりには個人差があります）。
〔出典: 消費者庁 景品表示法 https://www.caa.go.jp/policies/policy/representation/fair_labeling （参照2026-06-29）〕
メニューを予約とつなげる見せ方
メニューを読んで「やってみたい」と思った瞬間に、そのまま予約に進めるのが理想です。各メニューから予約画面へ直接飛べるようにし、「気になる→離脱」を防ぎましょう。メニューと予約枠が分かれていると、お客様が改めて探す手間が生まれ、離脱の原因になります。HPと予約が一体になっている仕組みだと、この導線を自然に作れます。
【予約まで】HPに予約機能を組み込む方法と手数料の見方
予約の3つのやり方
予約の受け方は大きく3通りあります。一般論として整理します（各サービスの仕様は変わるため、導入時に最新情報の確認を）。
- 問い合わせフォーム: 設置は簡単ですが、空き確認や返信が手作業になり、件数が増えると煩雑になりがちです。
- 外部予約サイト: 集客の入り口になる一方、手数料体系や、顧客情報・予約データがどこに蓄積されるかはサービスごとに異なります。契約条件を確認しましょう。
- HP一体型予約: 自店のHPの中で予約まで完結する方式。世界観を保ったまま、予約・顧客データを自店側に貯めやすいのが特徴です。
見落としがちな“予約まわりの費用”の見方
予約システムを比較するとき、「決済手数料の率が高いか低いか」だけを見ると判断を誤りがちです。本当に見るべきは「何に対して、いくつ課金が重なるか」という構造です。一般に、次のような費用が積み上がることがあります。
- 月額・基本利用料
- 予約1件ごとの従量課金（送客手数料など）
- SMS送信などの通信費（従量）
- オンライン決済の手数料
オンライン決済を使う場合、決済代行サービスの手数料は必ずかかります。たとえばVANNAが利用するStripeの場合、日本国内のカード決済手数料は1件あたり基本3.6%が店舗負担で、店舗のStripe口座から差し引かれます（料率は変動しうるため最新はStripe公式でご確認ください）〔出典: Stripe公式 https://stripe.com/jp/pricing （参照2026-06-29）〕。
ここで大切なのは、決済手数料は「率」を比べるより、「中間マージンが上乗せされていないか」「予約件数やSMSで二重・三重に課金されないか」という構造で見ることです。VANNAは予約・販売そのものに対する手数料（仲介手数料）を取らず、売上は店舗名義のStripe口座へ直接入金されます。つまり、店舗が負担するのはStripeの決済実費（基本3.6%・最新はStripe公式で要確認）のみで、VANNAが間に入ってマージンを取る構造ではありません（決済代行＝Stripeの手数料は別途・店舗負担）。
総額で比べるイメージは次の通りです。「月額＋予約従量＋SMS従量＋決済手数料」の合計で、自店の月間予約数・客単価を当てはめて試算するのが、失敗しない比較の仕方です。
予約から再来店までの導線（リマインド・台帳・キャンセル対策）
予約を受けたら、その後の運用も設計しておくと、無断キャンセルを減らし再来店につなげやすくなります。
- 来店前のメールリマインド: 予約日が近づいたら自動でリマインドメールを送ると、来店忘れの防止に役立ちます（VANNAは全プランでメールリマインドに対応）。
- 顧客台帳: 来店履歴を残しておくと、次回の提案やフォローに使えます。
- キャンセル料の設定: キャンセルポリシーを決める場合、消費者契約法に配慮が必要です。施術料金の全額を一律で請求する設定は、「平均的な損害の額を超える部分は無効」とされる可能性があります。前日・当日・無断など段階を分け、各店の平均的損害の範囲内で設定しましょう〔出典: e-Gov 消費者契約法第9条 https://laws.e-gov.go.jp/law/412AC0000000061 （参照2026-06-29）〕。
なお、予約確認やリマインドのような「取引に関するメール」と、クーポンやキャンペーンの「販促メール」は性質が異なります。販促目的のメールを送る場合は、原則として事前の同意取得（オプトイン）、送信者の氏名・名称の表示、配信停止（オプトアウト）の連絡先表示が必要です〔出典: 総務省 特定電子メールの送信の適正化等に関する法律 https://www.soumu.go.jp/main_sosiki/joho_tsusin/d_syohi/m_mail.html （参照2026-06-29）〕。
開業前から作るべき？開業準備とHPの進め方
これから開業する場合、HPは開業日が決まってから、ではなく準備段階から着手するのがおすすめです。理由は、開業前に「プレオープン告知」や「予約の事前受付」を始められると、オープン初日からの動き出しがスムーズになるからです。
具体的には、コンセプト・メニュー・場所が固まった段階で最小構成のHPを公開し、お知らせ機能でオープン日を告知、予約受付を先行して開ける、という流れです。ノーコードなら情報が固まった部分から順に公開・更新できるので、準備と並行して進められます。
費用面でも、開業準備期にツールの無料トライアルを使えば、初期の固定費を抑えながら立ち上げられます（VANNAは申込時期によって無料期間が異なります。詳細は末尾のCTAに記載）。
自宅・個人サロン特有の注意（住所表示・プライバシー・特商法）
自宅サロンや個人サロンでは、HP作りで特有の不安が出てきます。中立的に整理します。
- 住所を出すか: 完全な住所を常時公開することに抵抗がある場合、「最寄り駅・エリアまで表示し、詳細住所は予約確定後にお伝えする」という運用も一般的です。プライバシーと来店しやすさのバランスで決めましょう。
- 地図の扱い: ピンを建物単位ではなくエリア単位にとどめる方法もあります。
- 特定商取引法の表記: ネット予約で「事前決済（オンライン決済）」を行う場合、取引はEC的な性質を帯びます。事業者名・所在地・連絡先・キャンセル／返金条件などの表記義務が生じる場合があるため、必要性を確認しましょう。事前決済を使わず来店時支払いのみなら扱いは変わります。
判断に迷う点は、各業種・各自治体の窓口や専門家にも確認すると安心です。
ノーコードで「写真・メニュー・予約」を当日公開する手順（VANNA例）
ここまでの要素を、ツールを切り替えずに一つで完結させる例として、VANNAでの流れを紹介します。なお、機能によって対応プランが異なるため、各ステップで対応プランを明記します。
ステップ1: テンプレートを選んでトップページを作る
用意されたテンプレートから近いものを選び、文字や写真を差し替えていきます。コードを書く必要はなく、画面上で編集できます。
ステップ2: 写真・メニューを登録する（後から何度でも編集可）
撮った写真をアップロードし、メニュー（価格・所要時間・説明）を登録します。公開後も繰り返し編集できるので、まず登録してから整えれば大丈夫です。
ステップ3: ネット予約を設定して当日公開する
予約設定を済ませれば、その日のうちに公開できます。予約まわりは対応プランが分かれます。
| 予約機能 | 対応プラン |
|---|---|
| 候補日予約（お客様が希望日を送る形式） | 全プラン（Proから） |
| カレンダー予約（時間枠を指定して受付） | Max以上 |
| 指名予約 | Max以上 |
| 事前決済（Stripe） | Max以上 |
| 独自ドメイン | Max以上 |
VANNAは初期費用0・予約／販売手数料0で、売上は店舗名義のStripe口座へ直接入金されます（決済代行＝Stripeの手数料は店舗負担で別途。日本国内カード決済は基本3.6%・最新はStripe公式で要確認）〔出典: Stripe公式 https://stripe.com/jp/pricing （参照2026-06-29）〕。
なお、事前決済を使う場合、Stripeアカウントは店舗名義で開設し、本人確認（KYC）は店舗側で行います。VANNAが売上を預かったり収納代行をしたりするのではなく、入金主体はあくまで店舗です。
ステップ4: 公開後にやること（SEO・お知らせ・解析）
公開してからが本番です。最低限、次を整えましょう。
- 基本のSEO設定: 各ページのタイトル・ディスクリプションを、店名＋エリア＋メニューが分かる内容にする。見出し（H1・H2）に何のページか分かる言葉を入れる。
- Googleビジネスプロフィール: 地図・口コミに出てくる情報を整え、HPへのリンクを設定。ローカル検索（MEO）で見つけてもらいやすくする。
- お知らせ更新: 定期的に投稿し、活動が続いている店だと伝える。
- アクセス解析: どのページがよく見られ、予約まで進んでいるかを確認し、改善に使う。
HPを作っただけでは集客は伸びない——現実的な期待値と併用の考え方
正直にお伝えすると、HPを公開しただけで検索上位に出たり予約が急増したりするわけではありません。HPは「来てくれた人に伝え、予約してもらう受け皿」です。集客の入り口は別途、複数を組み合わせて育てるのが現実的です。
- 検索: HPのSEOを整え、エリア＋メニューで見つけてもらう
- Googleビジネスプロフィール（MEO）: 「地域名＋美容室」で地図に表示されやすくする
- SNS: 日々の発信で世界観や雰囲気を伝え、HP・予約へ送る
これらを併用し、HPを情報のハブにすると効果を発揮しやすくなります。過度な期待で「作ったのに増えない」と止めてしまうより、入り口を増やしながら運用を続けることが大切です。
自分で作るときによくある失敗と対処法
スマホ表示が崩れる／予約導線が分かりにくい／更新が止まる
- スマホ表示の崩れ: 閲覧の多くはスマホです。公開前に実機で確認しましょう。テンプレート型ならスマホ表示に自動対応する製品が多く、崩れを抑えやすいです。
- 予約導線が分かりにくい: トップやメニューから予約ボタンへ、迷わず進める配置に。ボタンの文言は「ご予約はこちら」など分かりやすく。
- 更新が止まる: 凝りすぎると続きません。お知らせは月1回など無理のない頻度を決め、ノーコードで手早く直せる状態を保つのがコツです。
つまずいたときの相談先
正直にお伝えすると、VANNAのサポートはメール中心で、電話サポートはありません。電話で即時に相談したい方には向かない点はあらかじめご了承ください。一方で、操作ガイドやヘルプを参照しながら、よくある詰まりは自己解決しやすいよう情報を用意しています。困ったときはメールで問い合わせられます。
よくある質問（FAQ）
Q. 公開までどれくらいかかりますか？ A. テンプレートを使い、写真とメニューが手元にあれば、その日のうちに公開することも可能です。準備状況によって前後します。
Q. スマホだけで作れますか？（PCは必要ですか） A. ノーコードなのでスマホからの編集も可能ですが、写真の差し替えや細かな文章調整は、画面の広いPCやタブレットがあると作業しやすいです。
Q. 無料で作れますか？ A. VANNAに無料プランはありません。無料で試せるトライアルがあります（プレオープン期間は2か月無料・2026/7/31までの申込、それ以降は1か月）。申込時にカード登録が必要です。
Q. 開業前でも申し込めますか？トライアル中に公開できますか？ A. 開業準備中でもお申し込みいただけ、トライアル期間中にHPを公開・予約受付を開始することも可能です。プレオープン告知や事前予約に活用できます。
Q. 既存の顧客データは移行できますか？ A. 自動移行の仕組みはありません。CSVでのインポート、または手入力での登録となります。
Q. 予約の手数料はかかりますか？ A. VANNAは予約手数料を取りません（販売手数料も0）。ただしオンライン決済を使う場合、決済代行（Stripe）の手数料が別途・店舗負担でかかります（日本国内カード決済は基本3.6%・最新はStripe公式で要確認）〔出典: Stripe公式 https://stripe.com/jp/pricing （参照2026-06-29）〕。
Q. SMSのリマインドはできますか？ A. SMSには対応していません。メールでのリマインドに対応しています（全プラン）。
Q. キャンセル料は設定できますか？いくらまで？ A. キャンセルポリシーは各店で設定できますが、消費者契約法により「平均的な損害の額を超える部分」は無効とされる可能性があります。施術料金の全額を一律請求する設定は避け、前日・当日・無断など段階を分け、各店の平均的損害の範囲内で設定してください〔出典: e-Gov 消費者契約法第9条 https://laws.e-gov.go.jp/law/412AC0000000061 （参照2026-06-29）〕。
Q. 無料トライアルは自動で課金されますか？解約は？ A. 申込時にカード登録が必要で、無料期間が終了すると有料プランへ移行し課金が始まります。継続しない場合は無料期間内に解約手続きを行ってください。料金はPro¥3,300／Max¥5,500／Max+¥11,000（月額税込）です。
まとめ：写真・メニュー・予約まで“その日のうちに”
サロンのHPは、ノーコードのツールを使えば、写真・メニュー・予約までその日のうちに公開できます。流れをおさらいします。
- 最小構成（トップ・メニュー・スタッフ・アクセス・予約の5ページ）を決める
- 写真は良い例・悪い例を意識して用意（後から差し替え可）
- メニューは価格・所要時間・対象を明記し、効能断定は避ける
- 予約はHPと一体化させ、費用は「率」より「課金の構造」で総額比較
- まず公開し、SEO・Googleビジネスプロフィール・SNSと併用して育てる
完璧を待つより、最小構成で公開して運用で育てるのが近道です。VANNAは初期費用0・予約／販売手数料0で、売上は店舗名義のStripe口座へ直接入金されます（決済代行＝Stripeの手数料は店舗負担で別途）。
いまなら無料で試せます。プレオープン期間として2か月無料（2026/7/31までの申込。それ以降の申込は1か月無料）。申込時にカード登録が必要で、無料期間終了後は有料プラン（Pro¥3,300／Max¥5,500／Max+¥11,000・月額税込）に移行します。継続しない場合は無料期間内に解約できます。成果を保証するものではありませんが、まずは触って、自店の写真・メニュー・予約を形にしてみてください。
関連記事
※本記事の費用・相場・各社仕様・法令の扱いは2026年6月時点の情報です。Stripeの決済手数料や各サービスの料金・機能は変更される場合があるため、導入時に公式の最新情報をご確認ください。価格表記・効果表現・キャンセル料・販促メール・特定商取引法の表記などは、各店の状況に応じて専門家にご確認ください。