Skip to main content
評価してください: 

ASP.NET 2.0 マスタ ページの活用

サンプル コードのダウンロードサンプル コードのダウンロード (ASPNET_Webcast_MasterPage.msi, 274 KB)

ASP.NET 2.0では、マスタ ページを利用することで、サイト内で共通のテンプレートを使うことができ、ページの構成やデザインを簡単に統一させることができます。


マスタ ページの概要
企業の公式サイトやオンラインショップなど、サイト全体に対して「統一感」を必要とするような Web サイトでは、サイト ヘッダーや左右のサイドバー、サイト フッターなどのインターフェイス要素について、共通のレイアウトを作成するのが普通です。
従来の ASP.NET 1.0 や 1.1 では、このような共通インターフェイス要素をユーザーコントロールで実装できました。しかし、大抵の場合複数のユーザーコントロール必要とし、さらにそれ を配置する各ページ内で細かい調整が必要でした。そのため、たとえば細かい修正に対して柔軟に対応しづらいなどの難点があり、また開発途中でページの全体 像を確認することが難しいなど、さまざまな課題が残っていたことも事実です。

そのような問題点を踏まえ、 ASP.NET 2.0 では共通テンプレートとしての機能を持つ「マスタ ページ」がサポートされました。これまでコントロールを開発する必要があった部分についても、通常の Web フォームと同じ方法で作成できるようになったため、修正にも柔軟に対応可能です。またデザイナーに依頼したレイアウトをページに反映しやすくなり、サイト の開発がより効率的になりました。

マスタ ページと各 Web フォームとの関連付けについては、マスタ ページ内の ContentPlaceHolder コントロール(図1)と各 Web フォーム内の Content コントロール(図2)との間で対応付けがなされています。すなわち、各 Web フォームは、マスタ ページに配置した ContentPlaceHolder コントロール部分に各 Web フォームの Content コントロール内に作成したページ固有のコンテンツを挿入した形でブラウザに表示されます(図3)。

マスタ ページ内の ContentPlaceHolder コントロール

図1. マスタ ページ内の ContentPlaceHolder コントロール

Web フォーム内の Content コントロール

図2. Web フォーム内の Content コントロール

マスタ ページを適用した Web フォームをブラウザで表示

図3. マスタ ページを適用した Web フォームをブラウザで表示

デモ(ストリーミング配信)
デモでは、マスタ ページを作成し、新たに作成する 2 つの Web フォームに対し適用します。

Visual Studio .NET 2005 β2 を使った開発デモVisual Studio .NET 2005 β2 を使った開発デモ03 分 48 秒
ブラウザを使った動作確認デモブラウザを使った動作確認デモ01 分 10 秒

 

ページのトップへページのトップへ