Search Engine Optimization Enhancements in ASP.NET 4
By Scott Mitchell
Introduction
Search engine optimization, or SEO, is the practice of improving a website's position in search engines' results using unpaid techniques. A better (higher) position in the search results will, in theory, lead to more click throughs, increasing the website's visibility and audience. There are a number of simple steps you can take on your website to improve your search engine ranking. A good first step is to download and run Microsoft's free Search Engine Optimization Toolkit. Point it at a remote website and the SEO Toolkit will crawl the links on the site and identify potential problems and offer suggestions on how to fix them.
ASP.NET 4 includes a handful of new methods, properties, and libraries to assist with search engine optimization, including
ASP.NET Routing, permanent redirects,
and the ability to programmatically specify values for certain <meta> tags. This article examines these enhancements and shows how
they can be used for SEO purposes. Read on to learn more!
Use ASP.NET Routing to Generate SEO-Friendly URLs
There are countless articles online about creating "SEO-friendly URLs." (A search on Google returns over 335,000 results!) In general, these articles recommend creating short, readable URLs that include keywords about the page in the URL itself. For example, rather than having a URL like
www.example.com/scripts/ShowProductsInCategory.aspx?CategoryID=342 a better choice would be
www.example.com/categories/Beverages/products. Note how the latter URL is terser, can be understood by reading it, and contains keywords pertinent to the
page, including the name of the category of interest, "Beverages."
In the past, supporting such clean, SEO-friendly URLs in ASP.NET was anything but easy, as ASP.NET has traditionally required a tight correspondence between the URL and the name of the ASP.NET page servicing the request. There were ways to get around this limitation, through third-party products or through creating your own HTTP Module or HTTP Handler to implement URL rewriting, but the good news is that starting with ASP.NET 3.5 SP1, URL rewriting became a lot easier thanks to the ASP.NET Routing system.
ASP.NET Routing cleanly decouples URLs from web page file names and can be used to create clean, terse, SEO-friendly URLs. Specifically, ASP.NET Routing allows a
developer to define routes, which map a URL pattern - such as "categories/CategoryName/products" - to a class (or web page) that handles the request.
Consequently, using ASP.NET Routing you can define a route that sends all requests to www.example.com/categories/<i>CategoryName</i>/products to
an existing web page, such as /scripts/ShowProductsInCategory.aspx, which would then read in the CategoryName value and display the appropriate
products.
ASP.NET Routing has been covered in previous articles here on 4Guys. For a detailed look at ASP.NET Routing in ASP.NET 4, read URL Routing in ASP.NET 4. For a discussion on the benefits of creating clean, readable, terse, SEO-friendly URLs, refer to "The Case for ASP.NET Routing" section in Using ASP.NET Routing Without ASP.NET MVC.
Use Permanent Redirects When Appropriate
Every HTTP response sent from the server back to the client includes a status code that provides information to the client about the result of the request. For example, if the server receives a request for a non-existent page, such as
www.example.com/NoSuchPage.aspx, it returns an HTTP status code of 404.
Every ASP.NET developer is familiar with Response.Redirect(url), which redirects the visitor from the current page they requested to the specified
url. The way Response.Redirect works behind the scenes is by sending a 302 HTTP status code along with a Location HTTP header that specifies the
URL to which the requested resource has moved.
If that doesn't quite make sense, let's look at an example and examine the HTTP traffic sent between the client and server. Imagine an ASP.NET page named RedirectDemo.aspx
that has just one line of code in its Page_Load event handler:
Response.Redirect("GoHere.aspx")
|
When a visitor fires up her browser and enters www.example.com/RedirectDemo.aspx into her browser's Address bar, the browser makes a request to this URL
and the above code executes. The Response.Redirect method call above causes ASP.NET to immediately send back the following response:
HTTP/1.1 302 Found
|
Note the two highlighted lines in the response. The first line includes the status code, 302. The second line shows the Location HTTP
header, which tells the browser where the resource (RedirectDemo.aspx) now resides. The net effect is that the browser, upon receiving this response, will
automatically make a request for www.example.com/GoHere.aspx. From the end user's perspective this happened automatically. She initially typed
www.example.com/RedirectDemo.aspx into her browser's Address bar and then the next thing she knows she's visiting www.example.com/GoHere.aspx.
It's important to understand that the 302 status code indicates that the resource being requested has temporarily moved to a new URL. A client - such as a search
engine spider - that receives a 302 status will continue to try the original URL for future requests. There is an alternative status code, 301, that should be used if
the resource has been moved permanently. ASP.NET 4 offers a new method, Response.RedirectPermanent,
which does a redirect using the 301 status code instead of the 302 status code. For example, if we updated the RedirectDemo.aspx page's code to use the
following instead:
Response.RedirectPermanent("GoHere.aspx")
|
Then when a user visited this page the HTTP traffic would look slightly different. Namely, the first line in the response has changed from a status of "302 Found" to "301 Moved Permanently", as the following output shows:
HTTP/1.1 301 Moved Permanently
|
From the perspective of a visitor arriving from a browser, there are no obvious differences between the 301 and 302 redirect examples. But consider what happens when a
search engine spider comes to crawl your site and bumps into a URL like RedirectDemo.aspx. If RedirectDemo.aspx does a 302 redirect
(a/k/a, a temporary redirect) to a different URL, such as GoHere.aspx, the spider, when it crawls next week or next month or whenever, will again check
RedirectDemo.aspx. However, if RedirectDemo.aspx does a 301 redirect (a/k/a, a permanent redirect), the spider will update its index,
replacing its knowledge and information about RedirectDemo.aspx with the new URL, GoHere.aspx.
So what does this all mean for SEO? If you have an old URL that you no longer want search engines to index or users to visit, but rather want them to use a new URL,
use a 301 permanent redirect rather than the 302 temporary redirect. Earlier in this article we talked about ASP.NET Routing and how it could be used to allow for
URLs like www.example.com/categories/Beverages/products in place of URLs like www.example.com/scripts/ShowProductsInCategory.aspx?CategoryID=342.
If you implement ASP.NET Routing on an existing site it would be wise to put 301 permanent redirects on the old URLs that point to the new, SEO-friendly ones. (That is,
to have a request for www.example.com/scripts/ShowProductsInCategory.aspx?CategoryID=342 do a Response.RedirectPermanent to the new URL,
www.example.com/categories/Beverages/products.) Doing so will update your site's old URLs in the search engine's index with the new ones.
Programmatically Setting <meta> Keywords and Description Tags
The
<head> element in an HTML document provides metadata about the web page, including the page's title (via the <title> element),
and links to external CSS and JavaScript files, among other information. ASP.NET offers ways to have this metadata assigned automatically or programmatically. For example,
you can programmatically set the page's title using the Page class's
Title property. (See Dynamically
Setting the Page's Title for more information.) Likewise, when using ASP.NET Themes any stylesheets
defined in the theme are automatically included in the page's <head> section.
When crawling through the pages in a website, a search engine spider will examine the <head> section to determine more information about the page.
A page's keywords and a human-friendly description of the page may be included in the <head> section through the use of <meta> elements.
For example, the following <head> element includes a hard-coded title and hard-coded keyword and description <meta> tags:
<head runat="server">
|
ASP.NET 4 adds two new properties to the Page class that allow for these two <meta> tags to be specified programmatically:
Page.Title property. For example, to generate the above <meta> tags
programmatically we'd simply need to add the following lines of code to the ASP.NET page's code-behind class:
Page.MetaKeywords = "your,keywords,each one delimited by a,comma"
|
Conclusion
ASP.NET 4 adds a number of facilities targeted at SEO. In this article we discussed three: the ASP.NET Routing system; using the new
Response.RedirectPermanent
method to generate 301 moved permanently redirects; and using the new Page class properties MetaKeywords and MetaDescription to
programmatically add <meta> tags to the page's <head> section.
Happy Programming!