Reliably displaying favicons in HTML (and a little javascript) is really easy! Most websites simply store the their icon at the root of the website. So for example http://www.bbc.co.uk/favicon.ico looks like this "". However for IPlayer the BBC store the favicon in the page directory. So that's http://www.bbc.co.uk/iplayer/favicon.ico and looks like this "".

So for sites like IPlayer we need to fall-back to the site root icon but only after trying the page directory first. Unfortunately the HTML <img> tag doesn't have any way of doing this without a little help from javascript. Here's how..


Easy, right?!