rel="apple-touch-icon" No Longer Validates
Using the new doctype, <!DOCTYPE HTML>, the large-icon format and former best-practice rel="apple-touch-icon" no longer validates.
I searched the HTML5 spec for a recommendation and it appears you can call, rel="icon" and declare the sizes property. Fine, then.
My limited testing so far indicates that the last icon link called is the one that's used. Not good.
<link rel="shortcut icon" href="favicon.ico" sizes="16x16" type="image/x-icon" /> <link rel="icon" href="apple-touch-icon.png" sizes="165x165" type="image/png" />
I tested in XP/FX4 and XP/Chrome(stable) and also the default Android web browser (Froyo) so far. They all ignore the favicon.
<link rel="icon" href="apple-touch-icon.png" sizes="165x165" type="image/png" /> <link rel="shortcut icon" href="favicon.ico" sizes="16x16" type="image/x-icon" />
Reversing the order works for the favicon but shows no special treatment for the apple-touch-icon on Android. Which I'm not sure worked so well, anyway.
I'm still in the initial stages of testing and looking for the new "best practice" for browser icons on a website. If this interests you or you have experience with this problem, please reach out. Thanks!
