One of the things that I’ve been dying to get up and running on this site is a live feed to my bookmarked songs on Pandora. I’ve always wanted something that displays a little album art, because I think that adds extra flair to what is otherwise just additional bits of boring data. However, little did I know what a colossal hassle it was going to be to make my simple wish come true. And little did I know how far some companies *cough* *wheeze* Pandora *cough* have still to go in generating compliant markup for their services.
You can find anything on the Internet, right?
Yes…unless it happens to be a highly customizable way of spitting out your Pandora info. I pride myself on my ninja-like search engine skills; in another life I may have been a private investigator, or maybe just a very good stalker. I searched for the better part of a day to find this holy grail, yet my attempts bore no fruit.
I found this page: rgb255 » Blog Archive » Pandora Widget now also as Plugin. I was a bit leery of trying it out, given that the post was made about 9 months ago and WordPress has undergone quite a few changes in that time. And I was right: installation of this plugin totally borked my theme. Now, I’m not going to assume that it’s the plugin that is bad; more likely it is some sort of conflict with the customizations I have made to WordPress to serve my own devious ends. Still, I’m back to where I started.
Eureka!
I finally had a flash of insight: surely Pandora, being an online music service with profiles and bookmarking would offer it’s own feeds or widgets? After a brief search with terms refined to that scope, I hit: Music Feed Tool for RSS. Ah hah! A whole set, or slew if you will, of ready-made Pandora feed widgets.
I quickly selected the option for the bookmarked songs feed with nifty album art, hit the “generate HTML” button, and sat back and waited with bated breath for the answer to my troubles. Easy peezy lemon squeazy.
Oh, Pandora, how you sadden me
I knew something was amiss as soon as the page with the HTML rendered. I get a little box (I had to scroll down to even notice it had appeared) that says:
“Copy and paste the following HTML into your blog template:”
<link rel="stylesheet" type="text/css" href="http://feeds.pandora.com/styles/feeds/songs-art-gray.css" /><script src="http://feeds.pandora.com/feeds/people/r.c.burrell/favorites.js?max=5&noform"></script>
Now, I’m no n00b at this, so I know that it’s not valid to place a call to an external stylesheet anywhere other than in your <head> section. But this isn’t doing any favors to Joe Schmoe, who just wants to add a widget to his blog that shows everyone his favorite country and western songs and doesn’t know a thing about valid markup. Ok, whatever, I can let that slide.
So I paste the code in the correct locations, and fire it up to see what I get. It’s not pretty, but it works. The next step is to do my own custom styling on the feed output, to not make it look so boilerplate. Props to whoever worked on this at Pandora for making it based on a stylesheet.
…NEGATIVE props to whoever worked on this at Pandora that:
- Made the output use IDs for styling instead of classes. Every line item begins with a
<div id="pandoraAlbumArtSongs">…IDs are supposed to be unique identifiers. Once again, this doesn’t make or break the output, but makes it more difficult than it really needs to be. - Made the JS file a static piece of code that is updated on Pandora’s end. This precludes modification to the code to allow customization of the output data. Sure, I could apply some jQuery goodness to modify it (and I did, a little), but that seems counterproductive to me.
- Decided to use the neolithic
<i>tag in the output instead of the current<em>tag. Last I checked, this is 2008…not 1997.
Come toward the light
I guess my point in all this is that there are still a lot of companies out there that haven’t caught up on the standardized web. I’m not talking about the crazy lady selling her sequined pincushions online either; I’m talking about big companies that see hundreds of thousands of hits a day or provide services to the web at large. Pandora has done a phenomenal job in doing what Yahoo! Launch couldn’t: provide an adaptive radio service that works toward your ideal taste in music. How is it that they can still offer up a service for public consumption that ignores a lot of the basic rules of well-formed markup?
[...] « On Disappointment & Pandora (previous post) (next post) Nov 17 2008 [...]