masterpages

Using Asp.Net Master Pages

The human mind always tries to see patterns in everything that we do. Patterns help the mind concentrate because there is a semblance of control and at the very least, order. It makes comprehension a lot easier and the chances of good information absorption shoots up.

Consistency is very important when designing user interfaces as it makes the users do less thinking for simple tasks. And as they say with the advent of faster internet connection and highly visual games nowadays, the attention span of users have decreased dramatically. (I’m actually surprised that you are still reading this post :D)

Anyway, when I develop Asp.Net web applications, I use master pages for a consistent look and feel throughout the whole web app. A master page allows me to create a unified layout across all other pages that uses the master page (called Content Pages) and simplifies the development of these pages as it strips out redundant and unnecessary lines of codes.

I can place common script files and site-wide control elements such as menus, status bars, footers, and login/logout controls in the master page. I would only define them once and those elements will be inherited or applied to the content pages. These content pages, during development, will then be isolated from those control elements mentioned. I can focus more on the functionalities/features of a page rather than waste my time ensuring that the other pages in my web app and the page that I am currently working on still has the same look and feel. 😉

MasterPage.Master

<%@  Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    

        
    

    </form>
</body>
</html>

As you can see above, it is almost a regular HTML file except for a few new lines.

Line 1 is the master page directive. It tells us what language is used (C#), the page class that it is inheriting (MasterPage) and the name of the code-behind file that it is using (MasterPage.master.cs). Compared to a regular asp.net file, the master page will have a .master file extension instead of a .aspx file extension and the @Master directive instead of an @Page directive.

NOTE: The CodeFile attribute is specific to Visual Studio .Net.

Lines 6 and 12 on the other hand, defines the part of the master page where the content pages will be shown.

In my upcoming posts, I’ll be discussing Content Pages and a few examples when they are displayed together with Master Pages. 😀