ASP.NET SEO and the Canonical Tag

by agrace 21. February 2009 08:03

Canonical Tag Recently, Google, Microsoft and Yahoo announced support for a new canonical tag in an effort to combat duplicate urls (read duplicate content) on websites. Quite simply, you can add an HTML <link> tag to the <head> section of your page to indicate the preferred, or canonical, version of the page url.

If you have something like this:

http://www.mysite.com/products.aspx?productid=123

 

or

http://mysite.com/products.aspx?productid=123

 

You can have the search spider interpret it as this:

http://mysite.com/products.aspx

 

It works like a 301 redirect and is just a hint to the search spider. In other words, the other search engines are free to recognize it or not. It's mind-boggling the amount of work developers have had to do to get around this problem up to now, and it was this simple to fix at the end of the day?

To implement this for your ASP.NET products page, with its GridView of pageable, sortable widgets, you could do the following:

using System;
using System.Web.UI;
using System.Web.UI.HtmlControls;

public partial class Products : Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        HtmlLink canonicalTag = new HtmlLink();
        canonicalTag.Href = "http://mysite.com/Products.aspx";
        canonicalTag.Attributes["rel"] = "canonical";
        Page.Header.Controls.Add(canonicalTag);
    }
}

 

ASP.NET renders the following: 

<head>
    <title>Products Page</title>
    <link href="http://mysite.com/Products.aspx" rel="canonical" />
</head>

 

There is only one problem with this if you are using a XHTML doctype declaration; per the W3C recommendation, a closing slash in the <link> tag is illegal. The correct format is:

    <link href="http://mysite.com/Products.aspx" rel="canonical">

 

So where does this leave us? For me, relaxing the doctype to anything less than XHTML transitional is not an option. Does this mean we have to use an HtmlTextWriter to customize the output for this particular tag or is there some easier way? Has anyone got a suggestion or will we have to wait for a fix?

kick it on DotNetKicks.com

Tags: ,

ASP.NET | SEO




Recently, I have been experiencing some difficulty applying CSS correctly to some of the OOTB (out-of-the-box) ASP.NET controls. Earlier today, I was trying to apply a CSS image border using the ASP.NET image control, but couldn't get it to render correctly. In the end, I had to use a regular HTML img tag.

CSS for Image Border

*
{
   margin: 0;
   padding: 0;
}

body
{
   background-color:#827575;
   color: #c6d3d5;
   font: 75%/1.5em Verdana, Helvetica, Geneva, &quot;Helvetica Neue&quot;, sans-serif;
}

.test
{
   margin-left: 300px;
   padding-top:50px;
   width: 156px;
}

.imageStyle
{
   padding: 3px;
   background-color: #525252;
   border: 1px solid #c3cfd3;
}

 

ASP.NET Image Control

<div class="test">
  ASP.NET Image Control:
  <asp:Image ID="Image1" ImageUrl="~/Images/fender.jpg"    
     CssClass="imageStyle" runat="server" />
  <div style="clear:both;">Incorrectly Rendered</div>
</div>

 

ASP.NET Image Control Anomaly

 

HTML Image Tag

<div class="test">
  HTML img tag:
  <img src="~/Images/fender.jpg" id="Image2" alt="Correctly Rendered"
     class="imageStyle" runat="server" />
  <div style="clear:both;">Correctly Rendered</div>
</div>

 

Feedback from anyone experiencing similar issues would be welcome. One of the projects on my to-do list this year is to create a custom CSS framework for use with ASP.NET sites, and this is something I'd like to get a handle on in advance. If I come across any other issues like this one, I will post them here.

kick it on DotNetKicks.com

Tags: ,

ASP.NET | CSS




I have great difficulty in broaching the subject of testing. We all know the benefits of Test Driven Development (TDD). I believe also that a lot of us pay lip service to it in that we usually implement "our own version" of testing. It's kinda like "a la carte" religion these days whereby "I have a spiritual side" becomes a euphemism for being a "lapsed catholic". Most of us are guilty, the rest are liars.

I have a very caveman-like approach to testing: When I'm writing code for even the simplest Web application, I don't trust a single line of code I write. I will never move from one block of code to the next without checking my presumptions about values held in the previous block. When you work in a RAD environment, you have to constantly make intelligent decisions about such issues as you bring the code forward. As for creating a test plan in advance, get real! Software is written by developers working in real-world environments, under real-world pressures. If you are going to come up with a realistic software quality/testing methodology, then you have to develop a methodology which relates to the way people have to work. If you think I'm being insane then just check out the reaction to the recent comment by no less than Joel Spolsky that "Quality just doesn’t matter that much.”

Lightweight Test Automation Framework

This new testing framework for ASP.NET from Microsoft is a welcome step in the right direction. By "welcome", I mean that we need this, and more. There are tools like NUnit out there already but it behooves the creators of the framework to come up with the best testing tool for that framework - although not written by the same people! Did you ever wonder why they didn't create the test plans and tools in advance? If they had tested first before bringing the recent versions of ASP.NET to market, we'd all be back to writing Java by now. This tool was developed by the ASP.NET QA team to implement regression testing. Maybe now we might be able to apply CSS to all the OOTB controls?

The sample download is based on a Website template - so much for offering continuing support for the Web Application project template. I downloaded the samples and attempted to test an existing ASP.NET application targetted at .NET 3.5 by following the instructions provided. I added the reference to the Microsoft.Web.Testing.Light.dll. If you try to copy the two test pages into a folder using VS Solution Explorer, you will get the following error:

"The source files for this operation cannot be found in this solution"

Instead, copy them into a folder in the project you are testing using Windows Explorer, and then use "Add Existing Item" in the VS Solution Explorer window to include them in the project to be tested.

I decorated my class with [WebTestClass] and my method with [WebTestTag("test")] but had difficulty running the test when following the instructions provided. Eventually, I got it to "run" by using the following URL:

http://localhost/myproject/test/Default.aspx?run=true

When I say I got it to "run", I got the following results:

Lightweight Test Automation Framework

I also got a JavaScript "Sys.WebForms.PageRequestManagerServerExceptionError" warning when attempting to include a write to the log.

I didn't have any more time to fire at this and I would be very interested in getting feedback from others using this tool to test Web Application Projects; definitely fodder for another blog post.

Like most projects on the CodePlex site, proper documentation is non-existent. When the project in question comes from Microsoft, I expect better. At the very least, specify the requirements on the home page such as framework version and if it is aimed at Website or Web Application projects, or both. Please don't make me dig for some passing hint to this information in the little documentation that was provided. And if you run into problems don't even think of using the CodePlex search engine, unless you're planning a vacation while waiting for the results to come back.

kick it on DotNetKicks.com

Tags:

ASP.NET | Testing