「ホテルのホームページを作り直したいが、OTAからの予約が多いのに、公式サイトに何を載せればよいのかわからない」という相談をいただきます。
楽天トラベルやじゃらん、Booking.comなどのOTAで予約が入っている宿ほど、公式サイトの役割があいまいなまま古くなっていることが多いです。
結論から言うと、ホテルのホームページは「OTAではなく公式サイトで予約する理由」を伝え、そのまま予約まで迷わず進んでもらうための場所です。
この記事では、神奈川県藤沢市のリゾートホテルの公式サイトをリニューアルした経験をもとに、ホテル・旅館のホームページ制作で押さえるポイントを解説します。
目次
- ホテルのホームページは「公式サイトで予約する理由」を伝える場所
- OTAと公式サイトは役割が違う
- ホテル・旅館のホームページ制作で押さえる7つのポイント
- ポイント1:公式サイトで予約する理由を、目に入る場所に書く
- ポイント2:予約エンジンとの連携と、予約までの流れを先に決める
- ポイント3:客室は同じ項目で並べ、比べられるようにする
- ポイント4:写真は、滞在の場面が浮かぶ順に見せる
- ポイント5:食事・アクセス・宿のルールで、予約前の不安を先に消す
- ポイント6:多言語は、予約に必要な情報から訳す
- ポイント7:スマホで予約ボタンを常に見せ、宿の側で更新できる形にする
- Googleマップ・Googleのホテル検索での見え方を整える
- ホテルのホームページ制作でよくある失敗
- 制作会社に依頼するときに確認したいこと
- まとめ
\ホテルの制作実績あり/
【無料】ホテルのサイトを相談するホテルのホームページは「公式サイトで予約する理由」を伝える場所
OTAで宿を見比べたあと、気になった宿の名前で検索して公式サイトを確かめる方は少なくありません。
そこで公式サイトを開いても、OTAと同じ写真と同じ料金しか見つからなければ、使い慣れたOTAに戻って予約します。
せっかく公式サイトまで来てくれた方を、手数料のかかる予約経路に戻してしまう形です。
ホテルの公式サイトに求められるのは、きれいな写真を並べることだけではありません。
公式サイトで予約する理由がひと目で分かり、客室を選んで予約ボタンを押すまでが短いことが、直接予約を増やします。
OTAと公式サイトは役割が違う
「予約はOTAで十分に入っているから、公式サイトは名刺代わりでよい」と考える運営者もいます。
ただ、OTAと公式サイトは、宿にとっての役割が違います。
| 項目 | OTA(楽天トラベル・じゃらん・Booking.comなど) | 公式サイト |
|---|---|---|
| 見る人 | エリアや日付で宿を探している人 | 宿の名前を知って確かめに来た人、リピーター |
| 得意なこと | まだ宿を知らない人に見つけてもらう | 宿の雰囲気やこだわりを、他の宿と並べずに伝える |
| 載せられる内容 | 決められた項目と枠の範囲 | 客室の違い、過ごし方の提案、周辺の楽しみ方、宿のルール |
| 予約の扱い | OTAの手数料がかかる | 自社の予約として受けられ、顧客の情報も残る |
OTAは、まだ宿を知らない人に見つけてもらうための場所です。
一方で公式サイトは、見つけてもらった後に「ここに泊まろう」と決めてもらい、予約を自社で受けるための場所です。
OTAをやめる必要はありません。
新しいお客さんはOTAで集め、2回目以降や宿名で検索した方は公式サイトで受ける、という役割分担を前提にサイトを設計します。
ホテル・旅館のホームページ制作で押さえる7つのポイント
ホテルの公式サイトで、直接予約につながるかどうかを分けるポイントは次の7つです。
- ポイント1:公式サイトで予約する理由を、目に入る場所に書く
- ポイント2:予約エンジンとの連携と、予約までの流れを先に決める
- ポイント3:客室は同じ項目で並べ、比べられるようにする
- ポイント4:写真は、滞在の場面が浮かぶ順に見せる
- ポイント5:食事・アクセス・宿のルールで、予約前の不安を先に消す
- ポイント6:多言語は、予約に必要な情報から訳す
- ポイント7:スマホで予約ボタンを常に見せ、宿の側で更新できる形にする
以下、順に解説します。
ポイント1:公式サイトで予約する理由を、目に入る場所に書く
宿の名前で検索して公式サイトに来た方は、OTAとどちらで予約するかを比べています。
公式サイトで予約する利点がトップページで見えなければ、比べた結果としてOTAが選ばれます。
公式サイトだけの特典を用意する
よく使われるのは、公式サイトから予約した方だけの特典です。
ウェルカムドリンク、レイトチェックアウト、客室のアップグレード、館内で使えるサービスなどが一般的な例です。
特典は、トップページの上の方と、予約ボタンの近くの両方に書きます。
予約の直前に「公式サイトからの予約ならこれが付く」と目に入ることで、OTAに戻られにくくなります。
最低価格の保証は、OTAとの契約を確かめてから書く
「公式サイトが最もお得です」という最低価格の保証を掲げる宿もあります。
料金で差をつける場合は、各OTAとの契約内容と、実際に表示されている料金を先に確かめておきます。
保証を書いたのにOTAの方が安い日があると、かえって信頼を失うからです。
料金で差をつけにくい場合は、特典や公式サイト限定のプランで違いを出す方法もあります。
直販の比率を、月ごとに見る
リニューアルの効果は、公式サイトからの予約が全体の予約のどれくらいを占めるか、という直販の比率で見ると分かりやすくなります。
予約エンジンやサイトコントローラーの管理画面で、予約経路ごとの件数を月ごとに記録しておきます。
リニューアルの前から数字を残しておくと、公開後に何が変わったのかを比べられます。
ポイント2:予約エンジンとの連携と、予約までの流れを先に決める
ホテルの公式サイトの予約は、多くの場合、予約エンジンと呼ばれる別のシステムが受け付けます。
ホームページは、その予約エンジンへの入口です。
今の予約エンジンをそのまま使うかを先に確かめる
リニューアルでは、デザインより先に、今使っている予約エンジンを続けるのかを確かめます。
予約エンジンによって、サイトの中に空室検索の枠を埋め込めるか、予約画面へのリンクで渡すかが変わるからです。
予約画面の見た目をどこまで公式サイトに合わせられるかも、予約エンジンによって違います。
サイトのデザインと予約画面の雰囲気が大きく違うと、別のサイトに飛ばされたように感じて離れる方もいます。
プランは、詳細を読んでから予約へ進む流れにする
プランが多い宿では、一覧からいきなり予約画面へ飛ばすより、プランの詳細ページを挟む方が迷いが減ります。
GAMADASが制作したBREATH HOTEL様の公式サイトでも、宿泊プランは詳細ページで内容を確認してから予約へ進む流れにしました。
エステやサーフィン体験レッスンのように、宿泊とは別に申し込めるものは、オプションとして独立したページにしています。
宿泊後のオプション申込みは、専用の窓口にまとめる
記念日のケーキや花束、ディナーなどの追加の申込みは、予約エンジンの中で受けきれないことがあります。
BREATH HOTEL様では、ケーキ・花束・ディナー・サーフィンの申込みを、宿泊予約の後に使う専用フォームにまとめました。
フォームの冒頭には、受付の期限と、ホテルから連絡するまでの目安を書いています。
ポイント3:客室は同じ項目で並べ、比べられるようにする
客室タイプが多い宿では、宿泊を検討する方が「どの部屋にするか」で迷います。
客室ごとに説明の書き方や写真の数がばらばらだと、違いが分からず、比べるのをやめてしまいます。
客室の一覧は、どの客室も同じレイアウトにし、定員・広さ・ベッドなど同じ項目を同じ順番で載せます。
BREATH HOTEL様は全21室・10タイプの客室があり、各客室の写真・人数・広さ・ベッドの情報を揃えて掲載しました。
上位の客室は大きな写真と説明文で特徴を伝え、スタンダードな客室はコンパクトにまとめています。
予算や過ごし方に合わせて、客室同士を比べながら選べる構成です。
OTAの客室ページは決められた枠の中で書くため、客室同士の違いまでは伝えにくいことがあります。
公式サイトでは、景色、広さ、設備の違いを並べて見せることが、予約する理由の一つになります。
ポイント4:写真は、滞在の場面が浮かぶ順に見せる
ホテルのサイトでは、写真が予約するかどうかを大きく左右します。
ただ、客室・館内・外観の写真を同じ大きさで並べるだけでは、どんな滞在になるのかまでは伝わりません。
ファーストビューで、立地と雰囲気を伝える
サイトを開いた直後の写真は、その宿にしかない景色や空気感を選びます。
BREATH HOTEL様のサイトでは、ファーストビューをホテル外観と江ノ島の風景が切り替わるスライドショーにしました。
開いた瞬間に、海の近くの立地と滞在の雰囲気が伝わるようにするためです。
館内と周辺は、過ごし方の順に並べる
客室、食事、お風呂、周辺の景色を、到着から翌朝までの過ごし方の順に並べると、読む方が滞在を思い浮かべやすくなります。
周辺の観光地や海、街並みの写真は、OTAではあまり載せられない、公式サイトならではの情報です。
写真が足りないときは、撮影や手配も計画に入れる
古い写真や、季節が合っていない写真が混ざっていると、それだけで宿の印象が下がります。
リニューアルでは、今ある写真で足りるかを先に確かめ、足りない分の撮影や手配も計画に入れます。
BREATH HOTEL様でも、既存サイトの写真素材を活かしつつ、不足分はGAMADASで手配しました。
ポイント5:食事・アクセス・宿のルールで、予約前の不安を先に消す
宿泊を検討する方は、予約の前に細かい点を確かめたくなります。
食事はどこで取れるのか、駐車場や送迎はあるのか、子ども連れでも泊まれるのか、キャンセルはいつまで無料か、といった点です。
これらが見つからないと、電話で確かめる手間を嫌って、情報がまとまっているOTAで予約してしまいます。
「ないこと」も書いておく
館内にレストランがない、年齢の制限があるなど、宿によっては先に伝えておくべきことがあります。
BREATH HOTEL様のお食事ページでは、朝食・夕食・提携レストランを分けて案内し、ホテル内にレストランがないことも明記しました。
16歳以上の方を対象とするホテルなので、年齢の制限やキャンセルの規定は「お客様へのお願い」のページにまとめ、FAQから移動できるようにしています。
よくある質問は、開閉式で数多く答える
宿への質問は、チェックインの時間、駐車場、アメニティ、支払い方法など多岐にわたります。
BREATH HOTEL様では、よくある質問を20項目の開閉式で整理し、問い合わせの前に疑問を解消できる構成にしました。
答えが見つかれば、電話をかけずにそのまま予約に進んでもらえます。
ポイント6:多言語は、予約に必要な情報から訳す
海外からのお客さんを受け入れている宿や、これから増やしたい宿では、英語などの多言語対応が必要になります。
全ページを一度に訳そうとすると、費用も手間も大きくなり、更新のたびに訳し直す負担も残ります。
まずは、客室、料金とプラン、アクセス、チェックインの時間、キャンセルの規定、宿のルールなど、予約の判断に必要な情報から訳します。
予約エンジンの画面が英語に対応しているかも、あわせて確かめておきます。
サイトは英語でも、予約画面が日本語だけだと、最後の一歩で離れてしまうからです。
BREATH HOTEL様のサイトでは、日本語と英語を切り替えられるようにしました。
Studioでの多言語サイトの作り方は、StudioとWeglotで多言語サイトを作る手順で紹介しています。
ポイント7:スマホで予約ボタンを常に見せ、宿の側で更新できる形にする
旅行の予定は、移動中や夜にスマホで調べて決める方が多いです。
パソコンで見たときの見栄えを優先して作ると、スマホでは予約ボタンが画面の下に埋もれ、予約までの手順が長くなります。
予約ボタンを、どのページでも画面上に出しておく
スマホでは、予約ボタンを画面の下や上に固定して、どこまで読み進めても押せるようにします。
BREATH HOTEL様のサイトでは、スマホで予約ボタンを常に表示し、どのページを見ていても予約できるようにしました。
各ページの最後にも、海の写真に宿泊予約のボタンを重ね、読み終えたところからそのまま予約へ進めるようにしています。
予約以外の連絡手段も、選べるようにしておく
予約の前に電話で話したい方や、LINEで気軽に聞きたい方もいます。
BREATH HOTEL様では、ヘッダーに電話番号とLINEを常に表示し、お問い合わせページには電話・LINE・フォームの3つの窓口を並べました。
フォームには、宿泊日が決まっていない方も送れるよう「未定」の選択肢を用意しています。
問い合わせの導線全般の改善方法は、ホームページで問い合わせを増やす方法でも解説しています。
変わる情報は、宿の側ですぐ更新できるようにする
送迎の時間、休館日、季節のプラン、周辺のイベントなどは、宿の側ですぐに直したい情報です。
更新のたびに制作会社へ依頼する形だと、古い情報が残りやすくなります。
BREATH HOTEL様のサイトはStudioで制作し、送迎サービスなどの情報をホテル側で更新できるお知らせ機能を設けました。
Studioで更新できる範囲は、StudioのCMSで作れるものと設計の勘所で詳しく紹介しています。
\予約導線と多言語まで設計/
【無料】ホテルのサイトを相談するGoogleマップ・Googleのホテル検索での見え方を整える
宿の名前やエリア名で検索すると、Googleの検索結果や地図に、宿の写真や口コミ、料金の比較が表示されることがあります。
ここでの見え方が、公式サイトに来てもらえるかどうかを左右します。
Googleビジネスプロフィールの情報を、公式サイトとそろえる
Googleビジネスプロフィールには、宿の名前、住所、電話番号、写真、公式サイトのURLを正しく登録します。
公式サイトと違う電話番号や古い写真が載っていると、訪れた方が迷います。
リニューアルでURLが変わる場合は、Googleビジネスプロフィールに登録したURLも忘れずに直します。
ホテル検索の料金の欄に、公式サイトを出せるか確かめる
Googleのホテル検索では、OTAの料金と並んで、公式サイトの料金と予約リンクを出せる場合があります。
これには予約エンジン側の連携が必要なので、使っている予約エンジンが対応しているかを予約エンジンの会社に確かめます。
公式サイトの料金が並んでいれば、OTAを経由せずに公式サイトへ進んでもらえる入口が一つ増えます。
宿の名前で検索した方を、公式サイトで受け止める
宿の名前で検索した方は、すでにその宿に泊まることをほぼ決めている方です。
その方が公式サイトを開いたときに、特典と予約ボタンがすぐ目に入ることが、直接予約につながります。
ホテルのホームページ制作でよくある失敗
ホテル・旅館のサイト制作でよく見かける失敗は、次の4つです。
OTAのページと同じ写真と文章を並べている
OTAに載せている写真と説明文を、そのまま公式サイトにも並べているサイトです。
内容が同じなら、宿泊を検討する方にとって公式サイトで予約する理由がありません。
予約ボタンを押すと、急に別のサイトのように見える
サイトのデザインと予約画面の雰囲気が大きく違うと、予約の途中で不安になって離れる方がいます。
予約エンジンの画面で変えられる色やロゴは、公式サイトに合わせておきます。
雰囲気を優先して、料金やアクセスが見つからない
写真と余白を大切にした落ち着いたデザインは、ホテルの魅力を伝えるうえで大切です。
ただし、雰囲気を優先しすぎて、料金、アクセス、予約ボタンが見つけにくくなると、予約にはつながりません。
BREATH HOTEL様でも、明朝体と余白で静けさを表現しながら、予約や問い合わせまで迷わず進める構成を両立させました。
公開したあと、予約の経路を見ていない
サイトは公開してからが本番です。
公式サイトからの予約の件数や、どのページから予約に進んでいるかを見ながら、特典の見せ方や導線を少しずつ直していきます。
制作会社に依頼するときに確認したいこと
ホテル・旅館のホームページ制作を依頼するときは、次の点を確認しておくと進めやすくなります。
- 今使っている予約エンジンと連携した形で作れるか
- 客室やプランの情報を、構成から一緒に整理してもらえるか
- 写真の撮影や手配に対応できるか
- 英語など多言語のページに対応できるか
- スマホでの予約の流れを前提に設計してくれるか
- 公開後に、お知らせや送迎の情報を宿の側で更新できるか
BREATH HOTEL様も、複数の制作会社を比較したうえでGAMADASにご依頼いただき、約4か月で公開しました。
費用は、ページ数、客室やプランの数、写真撮影の有無、多言語対応、予約エンジンとの連携の仕方で変わります。
費用の決まり方はホームページリニューアルの費用相場の記事で、GAMADASの進め方はホームページリニューアルのサービスページで紹介しています。
まとめ
ホテルのホームページは、OTAで見つけてくれた方や宿の名前で検索した方に、公式サイトで予約する理由を伝え、そのまま予約してもらうための場所です。
OTAと同じ情報を並べるのではなく、公式サイトだけの特典、比べやすい客室の一覧、滞在の場面が浮かぶ写真で、公式サイトならではの価値を伝えます。
そのうえで、予約エンジンとの連携、スマホで常に見える予約ボタン、多言語とGoogleでの見え方を整えることが、直接予約を増やします。
GAMADASでは、ホテル・旅館のサイトの構成提案、デザイン、Studioでの実装、公開後の更新の仕組みづくりまでを一貫して担当しています。
制作の進め方は、BREATH HOTEL様の実績ページで詳しく紹介しています。




