Pretty Paged Routing in MVC - asp.net-mvc

Question

I've already seen Paging and routing in ASP.Net MVC but I cannot get that working for me.
On my homepage I want to generate the following pretty urls for my paging:
http://mysite
http://mysite/2
http://mysite/3
Without routing the default urls generated by the pager would be:
http://mysite/?page=1
http://mysite/?page=2
http://mysite/?page=3
My RouteCollection thus far is:
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
"HomePaging",
"{page}",
new { controller = "Home", action = "Index" },
new { page = #"\d+" },
new[] { "MySite.Controllers" });
routes.MapRoute(
"HomePagingFirst",
"{controller}",
new { controller = "Home", action = "Index", page = 1 },
new[] { "MySite.Controllers" });
routes.MapRoute(
"Default",
"{controller}/{action}/{id}",
new { controller = "Home", action = "Index", id = UrlParameter.Optional },
new[] { "MySite.Controllers" });
}
This is generating the following routes:
http://mysite/1
http://mysite/2
http://mysite/3
Not only is this generating a non-canonical route for the first page but it is also causing all links generated like the following #Html.ActionLink("my site", "Index", "Home") to be appended with the page number of the current page.
Any idea how to do this? If you could, a brief explanation as well as an answer would be most welcome.

Answer 1

I eventually got it working like this. But in all honesty that was through trial and error. If someone could explain why it works I'm sure that would be very helpful to visitors.
routes.MapRouteLowercase(
"HomePaging",
"{controller}",
new { controller = "Home", action = "Index", page = UrlParameter.Optional },
new { page = #"\d+" },
new[] { "MySite.Controllers" });
routes.MapRouteLowercase(
"HomeFirstPage", // Route name
"{page}", // URL with parameters
new { controller = "Home", action = "Index", page = 1 },
new { page = #"\d+" },
new[] { "MySite.Controllers" });