ウェイトリストページを作ろう

beginner~12 分0/4 ステップ

ウェイトリストでプロダクトをローンチしよう

フルプロダクトを作る前に、アイデアを検証して期待感を高める必要があります。ウェイトリストページは、興味を持った初期ユーザーを集め、市場の需要を証明する最速の方法です。

このレッスンでは、魅力的なヘッドライン・価値提案・メール収集フォーム・社会的証明を備えた、完全なウェイトリストランディングページを作ります。このたった1枚のページが、あなたのプロダクト全体の発射台になります。使うのはHTMLとTailwind CSSだけです。

h1でプロダクトのヘッドラインを追加し、pタグで価値提案（ユーザーへのメリット）を説明しましょう

ヒント：こう書きます: `<h1 class="text-5xl md:text-6xl font-bold mb-4">プロダクト名</h1>` と `<p class="text-xl text-blue-300 mb-8">ユーザーにとって何ができる？</p>`

formタグの中に、プレースホルダーテキスト付きのメール入力フィールドを作りましょう

フォームの中に「Join {数字}+ Founders」や「Join Waitlist」のような文言の送信ボタンを追加しましょう

フォームの下に、すでに何人が待っているかを示す社会的証明のテキストを追加しましょう（例：「500+ founders」）

html

14 行