ニュースレター CTA 入りフッター

このパーツの使いどころと実装ポイント

このパーツは、フッターの上部にニュースレターの登録フォームを大きく配置し、その下に会社情報とナビゲーション、コピーライトをまとめた「コンバージョン重視型」のフッターです。最後までスクロールした読者を離脱させず、メールアドレスという一歩を踏んでもらうことを狙った構造になっています。CTA ブロックと通常のフッターナビを flex や余白で明確に分けているため、視線が自然に登録フォームへ向かいます。

向いている場面

定期的に情報発信するメディアやブログ、SaaS のリリース告知、オンラインスクールの講座案内など、リピート接触を増やしたいサイトに向きます。月◯回配信といった具体的な頻度や「解除はいつでも 1 クリック」のような安心材料を添えると、登録のハードルが下がります。

カスタマイズと注意点

• 入力欄には必ず type="email" を使い、対応する label を紐づけてスクリーンリーダーでも役割が分かるようにする
• 送信ボタンの文言は「無料で購読」など得られる価値を言葉にする
• 狭い画面ではフォームの入力欄とボタンが縦積みになるよう flex-wrap や幅指定を調整する

登録後に確認画面や完了メッセージを返す動線も合わせて用意すると、ユーザーが操作の成否を判断しやすくなります。