Now that we're in our codefile, let's start by building our page layout. Within the Page_Load method, let's create a new string variable called content. We're then going to put our HTML in it for our page layout. Let's start by creating the entire page layout within the string. We'll get a bit more creative in a moment.


Creating the Basic Layout
This is pure html and should be pretty easy to read. I'm using a strict dtd at the top just because I've decided to. Feel free to use transitional or whatever else you feel like. Or none at all, whatever makes you happy. If you don't understand what a dtd is, you can check out w3schools.com for more info. I then set a title but left the actual body of the page empty.

Now let's make it a little more intelligent.


A better layout
Now I've inserted a form in the middle. Why didn't I just type the form out in the center of the content block I already had? Why did I break it up into several content += sections? Well, what we're going to do now is to put all these things in their own methods.


Broken Out Into Methods
You may be asking yourself, what the heck does that mean? Allow me to explain.

Page_Load is a method. Everything from the line protected void Page_Load(object sender, EventArgs e) through the } (lines 15 - 22) is a method. Basically a method is a block of code. Rather than just have a single method (block of code) that contains all our code, we're making some of our own, custom methods.

The first method we're making is header(). This is from line 23 through line 33. We declare (create) the method with the line private string header(). Private means it's a private method. This protects it from outside use (don't worry about that yet). String means that the method returns a string. If you notice, on line 25 we create a new string and on line 32 we return it.

On line 18, we're taking our content string and we're appending (+=) the method header(). Because we have () at the end of the word header, the code knows it's executing a method. When C# reaches line 18, it runs the header() method, takes the result and appends(+=) it to the content string. In this case, all that the header() method does is create a string (line 25), fill it with some html(lines 25-31), then returns it (on line 32). So, to go over it again, we declared a new method private string header(), we create a string, we fill it with info, then we return the string. When we return the string, we append it to the end of content on line 18.

We then do the same thing with methods form() and footer(). In each case we execute the method, get the string that those methods execute, and stick them on the end of the content string.

I realize this part may be confusing at first. Stick with it... what we're doing here is a part of object oriented programming. It basically allows you to break your code up into little, bitty, bite-sized bits. It makes it easier to code, easier to maintain, and you can reuse the same chunk of code over and over again if you want. Then if you ever have to fix a bug, you can fix it in one place rather than everywhere that same code was used. Now let's continue with the tutorial. Next up, let's make the form do something.