I was writting an article on web technologies and needed an image of the ASP.NET page structure. So I went online and searched for "ASP.NET page structure", but all I got was results on page life-cycle, relationship between aspx and aspx.cs files and so on.
Know since the image I needed would be very simple to do, I didn't spent a long time searching for it, instead I decided to just do it myself and share it with you here:
Now in case you don't understand this drawing, I'll give a brief description here:
The outer element is called a master page. In ASP.NET we can combine our pages (called WebForms) with a master page. This gives us the possibility of setting up our general layout in a master page - illustrated in the drawing above by the "Header", "Menu" and "Footer" parts.
These parts will probably stay the same on all content pages, so we define them in one "global" file. However you can have multiple master pages on your web site if you need.
Now the WebForm is where we put our content, but since we might like to use the same content on multiple pages, we can insert usercontrols.
So leaving WebForms for a while, let's look at UserControls. A UserControl is a content part of a page. For example if we like to have a newsletter sign up on several pages, we can make a newsletter signup control and include it on the pages where we'd like it to be.
Once we've create our UserControl we can place it on our page like any other tag (ignoring some configuration facts here).
So our page might look something like this:
<h2>Welcome to my page</h2>
<div>Please sign up for my newsletter:<br />
<my:usercontrol id="newslettersignup" runat="server" />
This is an example on how we combine normal XHTML content with our usercontrol.
Now this was a VERY brief introduction on the structure of an ASP.NET webpage, but hopefully you can make some sence of it even if you didn't know ASP.NET before - if You knew ASP.NET before reading this - well you probably just wasted a few minutes ;-)