Better presentation of RSS in web browsers

A page with garbled text and RSS markup is not all that user‐friendly. Lets look at how we can improve on an RSS file’s presentation of itself to new users to help grow subscription numbers.

RSS can be difficult to wrap one’s head around. All you see is some garbled text and code after clicking an interesting orange button that encourages you to subscribe to a site you like. A potential subscriber is likely to think “Well, that didn’t work” and move on to something else. The only thing the site will have achieved is to have trained that user to never click on any orange buttons called “RSS” ever again.

Is there something better? You may think the standard is broken or that the web browsers — except Firefox, Internet Explorer, and Safari — are not doing enough to help with the presentation of RSS files opened by unsuspecting users. As RSS files are, although by chance, XML‐like they can be transformed using a stylesheet. To put it briefly, a XML transformation takes one XML document and repurposes the data into another XML document using an XML stylesheet (XSL). Thus achieving a format conversion on the fly right in the user’s browser. A XML format browsers quite happily accept and present is of course XHTML, the unloved and under‐appreciated half‐brother of HTML.

Take a look at this blog’s RSS feed. You will notice that there is a nice explanatory text describing what you are looking at, how to use the RSS feed, and how to get started with subscribing to RSS feeds. For users who do know what RSS is who may be confused by the lack of garbage RSS‐like output, the RSS file’s address is also displayed on the page. You can also see the actual content of the feed, so that the page is useful even if you did not want to subscribe to it. This page is an RSS file even though it is presented as a formatted webpage.

The only difference from a regular RSS file is this one line after the XML declaration:

<?xml version="1.0" ?>
<?xml-stylesheet type="text/xsl"
href="stylesheets/rss.xsl" media="all" ?>
<rss> … </rss>

This line references a XML stylesheet. In RSS readers this line is simply ignored. In a XSL capable browser (including Opera, Firefox, Chrome, and Internet Explorer), however, this file is downloaded and the current document is transformed right in the user’s browser. The stylesheet is a static resource so it does not need to be updated when the feed is updated. It is important to note that the XSL file must be loaded from the same protocol and domain name as the RSS file. Browsers apply strict same‐origin security policies on these files because of their ability to change the presentation and content in documents.

You are free to download and use my RSS stylesheet. It can be used as‐is with most RSS feeds. The names, content, and addresses presented will be populated from the data in your own RSS feeds. Note that if your RSS does not have an <atom:link rel="self" … /> element, you should replace <xsl:value-of select="rss/channel/atom:link[@rel='self']/@href" /> with an actual address to your RSS file instead. Modern publishing tools will produce this output by default, though it is the line I expect could cause anyone problems.

You RSS feed must be valid XML before any of this will work. Ensuring your RSS feeds pass XML validation will also ensure it will work flawlessly in any RSS reader. It is generally a recommend practice to ensure that your software produce valid XML for RSS. The described method will also work for podcast feeds.

The RSS file must also be served by the server as “text/xml” and the XSL file must be served as either “text/xml” or “text/xsl”. Other content types, such as “application/rss+xml” may be technically more correct but will not work in as many browsers. Legacy reasons, sorry.

Nikola — the static site generator that powers this site — will include my XSL stylesheet for all generated RSS files in the next release.

Leave a Reply

Your email address will not be published. Be courteous and on-topic. Comments are moderated prior to publication.