Loading blog entries.. loading

Blogs which referenced tag: [UX]


URL Rewrite Rules used by WayneYe.com

Written by Wayne Ye  Sunday, October 16, 2011

I've successfully transferred my website to winhost, now the architecture is IIS 7.5 + ASP.NET 4.0 + SQL Server 2008 R2 + HTML5, this blog post is a summary about URL Rewrite Rules used by WayneYe.com.

RESTful URL for blogs

Blog posts are absolutely the soul of a blog website, comparing with blog URL format: "/yyyy/MM/{Blog_Title}", I actually prefer "/Blog/{Blog_Title}", more simpler/shorter, in additional and more important, generally speacking,valuable content is valuable no matter when it was posted, for example, a developer is searching C# covariance & contravariance articles, two articles separately posted on 3/28/2010 and 1/25/2011 won't make ANY difference for this developer.

Now that all my blogs take URI format like: "http://WayneYe.com/Blog/{Blog_Title}", it is so called "Permalink", I must ensure there is no duplicate blog titles (not case sensetive even if I can enable URL case sensitive through IIS manager, it would be quite confuse to the end user), so actually in my backend blog post page I did a DB check for existing blog titiles:)

Here is the Blog URL rewrite config XML stored in my Web.config:

 <rule name="BlogPermalinkRewrite">
    <match url="^Blog/([A-Za-z0-9-_()^%]{1,})$" />
    <action type="Rewrite" url="ViewBlog.aspx?Permalink={R:1}" />

Navigate Links

That's so simply, rewrite to an ASPX page under a matched directory:

 <rule name="NaviAlbum" patternSyntax="ExactMatch">
    <match url="Album" />
    <action type="Rewrite" url="Album/Index.aspx" />
<rule name="NaviVideo" patternSyntax="ExactMatch">
    <match url="Video" />
    <action type="Rewrite" url="Video/Index.aspx" />
<rule name="NaviTags" patternSyntax="ExactMatch">
    <match url="Tags" />
    <action type="Rewrite" url="Tags/Index.aspx" />
<rule name="NaviVisitRecord" patternSyntax="ExactMatch">
    <match url="VisitRecord" />
    <action type="Rewrite" url="VisitRecord/Index.aspx" />
<rule name="NaviAboutMe" patternSyntax="ExactMatch">
    <match url="AboutMe" />
    <action type="Rewrite" url="AboutMe/Index.aspx" />


These three type of URLs are similar, but makes a log of sense to a website comforming REST.

 <rule name="CategoryRewrite">
    <match url="^Category/([A-Za-z0-9-_/]{1,})$" />
    <action type="Rewrite" url="ShowBlogs.aspx?Condition=Category&amp;Cat={R:1}" />
<rule name="BlogTagRewrite">
    <match url="^Tag/(.*)$" />
    <action type="Rewrite" url="SearchTag.aspx?t={R:1}" />
<rule name="ArchiveYearRewrite">
    <match url="^Archive/(\d{4})$" />
    <action type="Rewrite" url="ShowBlogs.aspx?Condition=Time&amp;Year={R:1}" />
<rule name="ArchiveYearMonthRewrite">
    <match url="^Archive/(\d{4})/(\d{2})$" />
    <action type="Rewrite" url="ShowBlogs.aspx?Condition=Time&amp;Year={R:1}&amp;Month={R:2}" />
<rule name="ArchiveYearMonthDayRewrite">
    <match url="^Archive/(\d{4})/(\d{2})/(\d{1,2})$" />
    <action type="Rewrite" url="ShowBlogs.aspx?Condition=Time&amp;Year={R:1}&amp;Month={R:2}&amp;Day={R:3}" />

Define Atom/RSS feeds MIME type

WayneYe.com programmatically generates Atom/RSS feeds in plain XML format, the two XML file exists phisically under Feeds/Atom/Atom.xml and Feeds/RSS/RSS.xml, other then rewrite URL for both, one more important thing to do is override the "text/xml" MIME type to follow the standard:

  1. Atom feeds MIME type should be "application/atom+xml"
  2. RSS feeds MIME type should be "application/rss+xml".

To achieve this needs a little bit more work: intercepting response stream and overriding server variable, this requires adding an "Allowed Server Variables": this is done by the following steps:

View Post»


"Unique URL Pattern" in Ajax Web Application

Written by Wayne Ye  Wednesday, January 12, 2011

Testing: Can I really edit this?


Few days ago one of my friend asked me how does Gmail change its URL while user operates inside it without page refreshing, I've no idea about that at that time, he then shared a link Ajax Pattern - Unique URLs which deep dives into this topic, as the article mentioned: Unique URL make your website's link "Bookmarkable, Linkable, Type-In-Able", plus Sharable IMHO, easy to be shared to Social network which is extremely important nowadays.


The key technology to achieve the ""Unique URL" goal could be summarized into two points:
  1. If the content in the page has been updated by Ajax significantly enough, update the URL (location.hash) as well.
  2. // Ajax rendering all blog entries in page number 5
    location.hash = 'Blogs&Page5';
  3. Every time the Ajax page loads, JS should understand the

View Post»



Written by Wayne Ye  Sunday, May 4, 2008




读了官网的说明后发现很简单,下载corner.js(本地下载 ),然后页面include后直接使用class="自己挑一个喜欢的class"就ok了。

那么这里有个问题,如果你的Blog上线已有时日(比如鄙博),难道要手动更新你之前所有Blog里的图片代码给它们加上 class??

呵呵,这点事根本不能称之为问题:)当然是加段JS脚本给动态注册className喽,鄙播采用了Div+Css架构以及 MasterPage,所有的Blog都包含于一个名为“ContentPlaceHolder”对Div中

View Post»