タイトル周り

タイトル周りに分類されるWeb表現技法12件。2分割ヒーロー（見出しせり上がり）、中央集約ヒーロー＋スクロール誘導、スポットライト見出しヒーロー、背景画像リビール・ヒーローなど。ライブデモとコピーできるコード付き。

左に見出し・サブ・CTA、右にビジュアルを置く2分割のファーストビュー。見出しは行マスクから順にせり上がり、ビジュアルはふわりと浮遊します。SaaSやサービスサイトの王道構成です。

小ラベル・特大見出し・サブ・2つのボタンを中央に積み、下部に弾むスクロール誘導を添えた構成。見出しは語ごとに浮かび上がります。ブランドやキャンペーンの強い第一印象づくりに。

暗い画面の上を光のスポットが移動し、通過した部分だけ見出しが色づくドラマチックなヒーロー。マウスにも追従します。プロダクトのローンチやポートフォリオの表紙に映えます。

背景写真がゆっくりズーム（Ken Burns）し、その上で見出しがクリップで切り開かれるように現れる没入型ヒーロー。暗幕オーバーレイで可読性を確保。旅行・飲食・イベント系に好相性です。

連番・小ラベル・大見出し・装飾下線・リード文が、画面に入ると順に組み上がる「セクションの顔」のひな形。ページ内の区切りに一貫したリズムを与えます。見出し設計のテンプレとして使えます。

パンくず・ページタイトル・要約・メタ情報をまとめた下層ページの見出し帯。背景のグラデーションがゆっくり流れます。記事・一覧・サービス詳細など第2階層以下の冒頭に使える定型です。

見出しの大カードを中心に、画像・数値・CTAの小カードを敷き詰めたBento（弁当箱）型ヒーロー。情報を区画で見せられるため、機能の多いSaaSやプロダクトの第一画面で人気の構成です。

大見出しの下に、導入社数・稼働率・満足度などの数字がカウントアップして信頼を訴えるヒーロー。BtoBやサービスの実績アピールに効きます。数値が0から目標値まで増えていきます。

やわらかく溶け合うメッシュ状グラデーションを背景に敷いた、写真不要で高級感のあるヒーロー。色面がゆっくり動き、抽象的で洗練された第一印象を作ります。SaaSやブランドのトップに。

見出しのすぐ下にメール登録フォームを置き、第一画面で行動まで完結させるヒーロー。リード獲得を最優先するSaaSやニュースレターのトップに最適な、CV直結型の構成です。

ページの途中に挟む、横長のCTAバナー帯。見出し＋一言＋ボタンで「次の行動」へ橋渡しします。長いLPの中だるみを防ぎ、要所で申込やお問い合わせへ誘導できる定番パーツです。

見出しの一部が次々に打ち変わる（タイプライター＋ワード差し替え）ヒーロー。「○○のための△△」の△△が切り替わり、複数の価値提案をテンポよく見せられます。サービスの幅を伝えたいトップに。