ScioSoft's Community Blogs Optimized IT musings for the technically inclined

Meta Keyword & Description in ASP.NET MVC via Master Pages

by James Fielding 30. November 2010 21:00

As of late, we've been trying to do some optimization on our ASP.NET MVC base projects that are the starting point for client builds. It is obvious that having META tags, particularly "Description" and "Keywords", on the .aspx pages of our sites is important.  Moreover, the content of the tags has to be easily added to and/or updated on any given view's .aspx page.

As you're undoubtedly aware after Googling this topic, most online help will have you instantiate an BaseViewData class on your Master page or write tags by implementing some variance of a base Page/Interface/Abstract class.

After experimenting with a number of these methods, I concluded that the KISS (Keep it Simple Stupid) principle should apply.

The bottom line is this: Save your sanity, and be thanked by the next guy that has to work on your project. Add a MetaContent <asp:ContentPlaceHolder> to your Site.Master page and be done with it.

When you start a new MVC site, the Site.Master head section should look like this:

<head runat="server">
    <title>
        <asp:ContentPlaceHolder ID="TitleContent" runat="server" />
    </title>
</head>

We're going to add another <asp:ContentPlaceHolder> that contains some default values, but will allow us to overwrite these values as needed. We do this by adding the following snippet below the title element:


<asp:ContentPlaceHolder ID="MetaContent" runat="server" >
     <meta name="description" content="Web solutions for everyone" />
     <meta name="keywords" content="muskoka web design" />
</asp:ContentPlaceHolder>
 

Not only does this placeholder write some default values on pages that we don't specifically overwrite, but the placeholder will be automatically added to any new views that we create in our project. Also, any views that have already been created won't be broken by messing around with the TitleContent placeholder.

BONUS TIP: To complete the title element, I want to add a static string to the end of every page's title. To do this, I need to add a literal:


<title>
    <asp:ContentPlaceHolder ID="TitleContent" runat="server" />
    <asp:Literal runat="server" Text=" | Sciosoft Systems" />
</title>
 

You may think that you could have just added a string instead of the <asp:Literal>, and you'd be wrong...been there, done that. ASP is looking for controls, so any strings you put in are overwritten. Fortunately, a control implementing a string is not.

So our modified Master Page head section looks like this:


<head runat="server">
 
    <title>
        <asp:ContentPlaceHolder ID="TitleContent" runat="server" />
        <asp:Literal runat="server" Text=" | Sciosoft Systems" />
    </title>
 
    <asp:ContentPlaceHolder ID="MetaContent" runat="server" >
        <meta name="description" content="Web solutions for everyone" />
        <meta name="keywords" content="muskoka web design" />
    </asp:ContentPlaceHolder>
 
</head>
 

Now, when you want to override a particular view page, you just need to add the desired metatags:


<asp:Content ID="Content2" ContentPlaceHolderID="MetaContent" runat="server">
   <meta name="description" content="Different Description" />
   <meta name="keywords" content="different, keywords" />
</asp:Content>
 

The major benefit of using this, over other techniques, is that you can drop in the above code into an existing site, and it won't break anything. Moreover, it is easy for the next guy to see what you are doing, it keeps the meta tags in the view were they are easily to find and edit, and the technique is easily portable between projects.

Happy Metatagging,
James Fielding

kick it on DotNetKicks.com

Sciosoft Systems is a Canadian web design & development company based in Muskoka, which is in central Ontario. We provide ASP.NET website & Windows Server application development services to small and medium-sized business, as well as local government and not-for-profit groups. If you have a website project you’d like to discuss, please visit us at www.sciosoft.com.

Share |

Tags: , , , , , , , ,

MVC | Web Development | ASP.NET | SEO

Pingbacks and trackbacks (1)+

Comments are closed

RecentComments

Comment RSS

The opinions expressed herein are the personal opinions of the contributors and do not necessarily represent the views of Sciosoft Systems Inc.