Every website that updates routinely should have an RSS or Atom news feed that people (and search engines) can use to watch for changes.
By default, these files look horrible when a human looks at them in a browser. But there is a simple way to make them look better: RSS Style!
If you are not a webmaster, checkout out What is a new feed? and Picking a news reader for how to get started!
In your feed file (often feed.xml
but see below) add a line to the top (after the <?xml...?>
but before any real xml) of with one of the styles here on RSS Style:
The xml-stylesheet
processing instruction tells the browser to use the XSLT stylesheet to transform the raw XML into HTML. This has been supported by all major browsers for a long time.
The entire XSLT stylesheet needs to be included because of a bug in Chrome that prevents cross-domain loading.
You can host the XSLT file yourself and point to it directly:
/localcopy.xslt
in the example below).Yes! You can also use a CSS stylesheet. I plan on having some examples here, but in the meantime check out Pete Freitag's overview for making your own.
Website | News Feed | Notes | |
---|---|---|---|
Hacker News (front page) | before → after |
missing self link, HTML page discovery link is relative
analyze
|
|
Hacker News (Show HN) | before → after |
title doesn’t have ‘Show HN’, missing self link, HTML page discovery link is relative
analyze
|
|
Fly.io | before → after |
bad self link, HTML page is missing the discovery link
analyze
|
|
Jacques Mattheij | before → after |
bad self link
analyze
|
|
Dave Winer | before → after |
missing the self link
analyze
|
|
Dan Nguyen | before → after |
insecure self link
analyze
|
|
Thomas Schranz | before → after |
self link is different, though it works
analyze
|
|
Colin Wright | before → after | already has styling! CSS analyze | |
Hillel Wayne | before → after | Opens ‘Save as’ dialog analyze | |
Patrick McKenzie | before → after | analyze | |
Allen Downey | before → after | Opens ‘Save as’ dialog analyze | |
Julia Evans | before → after | analyze | |
Thomas Park | before → after | Opens ‘Save as’ dialog analyze | |
Kyle Kingsbury | before → after | Opens ‘Save as’ dialog analyze | |
Mark Nottingham | before → after | Opens ‘Save as’ dialog analyze | |
Tim Bray | before → after | Opens ‘Save as’ dialog analyze | |
John Graham-Cumming | before → after |
Opens ‘Save as’ dialog, self link mismatch but working
analyze
|
|
Dan Luu | before → after |
bad self link
analyze
|
|
Steve Klabnik | before → after |
missing the self link
analyze
|
|
Stavros Korokithakis | before → after |
discovery vs self link mismatch but working
analyze
|
|
Terence Eden | before → after | Has styling, but not exactly pretty. analyze | |
Logo of the day | before → after | Perfect, since it is my sample for testing. analyze | |
Try it on your own feed! | Problems?Feed Analyzer |