サンクスページの例
サンクスページの例15選：コードと次のステップ付き | We.Inc
注文、登録、予約、ダウンロード、寄付向けのオリジナルのサンクスページ15例。それぞれ編集できるHTMLとCSS付きで、明確な次のステップを1つ示します。
サンクスページの例
良いサンクスページは、何が完了したかを確認し、次に何がいつ届くかを伝え、役に立つ次のステップをちょうど1つだけ提示します。以下は注文、登録、予約、ダウンロード、寄付などに向けたオリジナルのデザイン15例です。どれもシンプルなHTMLとCSSで書かれており、ここで編集して自分のサイトにコピーできます。
訪問者の直前の行動に合わせて次のステップを選ぶ
- 訪問者が直前に…
- 確認する内容
- 最適な次のステップ（1つ）
- 商品を購入した
- 注文番号、商品、お届け予定
- 注文を追跡する、またはアカウントを作成する
- ニュースレターに登録した
- 登録したアドレス、配信頻度
- 受信トレイで確認する、または入門記事を読む
- 日時を予約した
- 日付、時刻、場所またはビデオ通話のリンク
- カレンダーに追加する
- ファイルをダウンロードした
- ファイル名、予備のダウンロードリンク
- 関連ガイドやツール
- お問い合わせフォームを送信した
- 返信までの目安、送信内容の控え
- よくある質問の回答を見る
- 寄付した
- 金額、メールでの領収書
- シェアする、または毎月の寄付を設定する
多くの訪問者は、あなたを最も信頼している瞬間にサンクスページへたどり着きます。そして、ページが何も伝えないために去っていきます。ここにある例はその瞬間のために作られています。どれも架空のビジネス向けの完全で編集可能なスニペットで、ページにそのまま組み込めるサイズです。そして、次に重要なステップへ訪問者を導くそれぞれ異なる方法を示しています。
- 状況別に例をスクロールします：購入、登録、予約、ダウンロードとメッセージ、そして寄付とイベント。
- どの例でも横のコードを編集すると、入力に合わせて結果フレームが更新されます。フレーム内ではスクリプトは無効です。
- スニペットをコピーし、文言と色を自分のものに差し替え、フォームや決済の完了後に表示されるページに配置します。
- 公開する前に例の上にあるチェックリストを確認し、訪問者が気にすることにページが答えているか確かめましょう。
- 重要な情報を繰り返し表示しましょう：メールアドレス、予約時刻、注文番号など。安心感を与え、入力ミスにも早く気づけます。
- 次のことがいつ起きるかを伝えましょう。5分後に届く確認メールも、そう知らされていなければ不具合に感じられます。
- メインのアクションは1つにしましょう。SNSボタン、アップセル、リンクを並べすぎると注意が分散し、どれもクリックされにくくなります。
- 閲覧を続けられるようサイトのヘッダーは残しつつ、登録したばかりの人にはポップアップやニュースレター登録欄を表示しないようにしましょう。
- サンクスページにはnoindexのrobotsメタタグを追加し、コンバージョンしていない人の検索結果に表示されないようにしましょう。
よくある質問
サンクスページには何を書くべきですか？
3つです：何が完了したかの正確な確認、次に何がいつ起きるか、そして今すぐ取れる明確なアクション1つ。それ以外はオプションです。
サンクスページは検索エンジンにインデックスさせるべきですか？
通常は不要です。headに<meta name="robots" content="noindex">を追加します。Googleによると、robots.txtでページをブロックするとクローラーがnoindexのルールを読めなくなるため、同じページをrobots.txtでもブロックしないでください。
インラインの完了メッセージよりサンクスページのほうが良いですか？
独立したページには固有のアドレスがあるため、コンバージョン計測が簡単になり、次のステップを置く余地も生まれます。インラインメッセージは訪問者をその場にとどめるので、コメント欄のような小さなフォームに向いています。どちらの場合も、何が完了したかを言葉で確認しましょう。
良い注文確認ページの条件は何ですか？
大きな文字の注文番号、商品と合計金額の短い概要、配送または受け取りの予定、領収書の送信先メールアドレス、そして注文を追跡または管理するリンク1つです。
サンクスページでアップセルしてもよいですか？
はい。ただし、直前の行動と明らかに関連するオファーで、確認情報を下に押しやらない場合に限ります。汎用的なセールバナーより、関連するアクセサリーや紹介特典のほうがずっと歓迎されます。
フォーム送信後のページが重要な理由
- フォーム送信や決済は、相手が何を望んでいたかを正確に知ることができる唯一のタイミングです。その次のページは、不安を和らげ、サポートへの問い合わせを防ぎ、関係の次のステップを始めることができます。あるいは、お礼を言うだけの行き止まりにもなり得ます。
- ページは、訪問者が次に抱く疑問への答えとして書きましょう。支払い後なら、荷物がいつ届くか。予約後なら、どこへ行けばよいかと日程の変更方法。ダウンロード後なら、ファイルが本当に保存されたかどうかです。
アクセシブルな完了表示
- アイコンだけでなく「注文が確定しました」のような明確な見出しをページに付け、成功を色だけで表現しないようにしましょう。新しいページではなくインラインで完了を表示する場合は、role="status"を持つ要素内に配置すると、スクリーンリーダーがフォーカスを移動せずに控えめに読み上げます。
購入後
1. 大きな注文番号付きの注文確認
サポートが最初に尋ねるのは注文番号なので、見出しの次に大きな文字で表示します。
2. 配送タイムライン
3つのステップで注文の現在地を示し、問い合わせが来る前にお届け予定を伝えます。
3. ゲスト購入からアカウント作成へ
ゲスト購入者はすでにメールアドレスを入力しているので、注文履歴を残すためのパスワード欄を表示します。
4. 確認情報の下に関連オプション
オファーは確認情報の下に置かれ、購入品に関連しているため、押し売りではなく手助けとして読まれます。
登録後
5. 受信トレイを確認してください
ダブルオプトインのリストにはこのステップが必要です。送信者名と件名を明記すると、メールをすぐに見つけてもらえます。
6. 入門記事付きのウェルカム
登録が済んだら、次号を待たせるのではなく、すでに公開している最良のコンテンツへ案内しましょう。
7. 無料トライアル開始
3ステップの短いセットアップリストで空のアカウントに進捗を生み、最初のステップを出発点として示します。
予約またはメッセージ送信後
8. カレンダー追加付きの予約確認
日付、時刻、場所をコンパクトなブロックにまとめ、そのすぐ横にカレンダー追加と日程変更のリンクを置きます。
9. 事前質問付きの初回相談予約
短い準備リストが通話をより有意義にし、双方の期待値をさりげなくそろえます。
10. 返信目安付きのメッセージ受付
送信内容を繰り返し表示すると届いたことが証明され、実際の返信目安があれば二重送信を防げます。
11. 受付番号付きの見積もり依頼
受付番号と担当者名があると、見積もり依頼が順番待ちで埋もれず、きちんと対応されていると感じられます。
ダウンロード、寄付、イベント登録の後
12. 予備リンク付きのダウンロード
ブラウザーは自動ダウンロードをブロックすることがあるため、見えるリンクとファイルサイズを示して、何も起きなかった場合に備えます。
13. 成果と領収書を示す寄付完了
寄付が何に役立つかを伝え、領収書を確認するほうが、ありきたりのお礼より効果的です。毎月の寄付は一度だけ、控えめに提案します。
14. チケット付きのイベント登録
チケット型のブロックに、当日確認したい情報をまとめます：日付、開場時刻、参加者名。
15. 紹介を促すウェイトリスト
ウェイトリストはシェアの呼びかけが自然に合う唯一の場所です。友人を招待すると、訪問者自身が望むものを得られるからです。
- 何が完了したかを見出しで言葉にしている
- 重要な情報を繰り返し表示している（注文番号、メール、時刻）
- 次に何が、おおよそいつ届くかを伝えている
- メインの次のステップが1つあり、メインボタンとしてスタイルされている
- 間違いを直す手段がある（メールアドレスの誤り、日程変更、キャンセル）
- 閲覧を続けられるようサイトのナビゲーションが残っている
- 登録したばかりの人にポップアップや登録欄を表示していない
- ページにnoindexのrobotsメタタグがある
サンクスページのチェックリスト
{total}項目中{n}項目完了
すべて完了です。訪問者が気にすることにサンクスページがしっかり答えています。
チェックをクリア
無料で始める · クレジットカード不要
関連: ガイド｜Webマーケティングと集客を学ぶ
製品
ご利用いただける方
機能
リソース
会社情報
サイトマップを見る