8 ms·
Inventing Favicon.ico
- salusinarduis 12y agoI would love to read more of these delightful early web stories. Does anyone have a collection of them?
- johanbrook 12y agoNot entirely web related, but Andy Hertzfeld has collected lots of early Apple stories on http://www.folklore.org/ http://www.folklore.org/. Really delightful as well.
- mmahemoff 12y agoIf you're into podcasts, http://www.internethistorypodcast.com/ http://www.internethistorypodcast.com/ is doing a very comprehensive effort speaking to original sources about all things early internet. Also the Reply All podcast has covered various quirky aspects of internet history http://gimletmedia.com/show/reply-all/ http://gimletmedia.com/show/reply-all/.
- have_humility 12y agoLots of Mozilla stuff: http://www.jwz.org http://www.jwz.org (gruntle, doc, hacks, blog; everything) http://www.mozillamemory.org http://www.mozillamemory.org http://www.codersatwork.com http://www.codersatwork.com
- UnoriginalGuy 12y agoHonestly even in retrospect favicon was a positive thing with little to no downsides except maybe a single "wasteful" HTTP/s request. The <link rel="icon" href="./whatever.ico" /> was a further improvement still on the basic concept a year later. The only concerns I've heard about favicon is: - They've grown beyond the original use case (e.g. address bar, tabs, drag to desktop/app tray, etc). - The icon definition hasn't expanded with its new scope, so specifying low, medium, and high definition formats is left up to server hacks (i.e. providing the right one based on the browser user agent string). - There's no way of in-lining the icon (e.g. for single page applications, appliances, etc). - Apple now has their own incompatible favicon "apple-touch-icon" which is just a higher resolution favicon. - They can be used to trick less technical users into believing a HTTP site is a HTTPS one. For example make the favicon a green padlock. This is mostly a browser issue, and may be resolved by marking all HTTP sites as insecure (which some have proposed). To be honest all of these could be fixed with some subtle changes to the ref="icon" definition to support a quality modifier, and also being able to point at an in-line graphic object for the favicon. The last point requires us to mark HTTP as insecure. Instead we treat HTTPS CA signed as "secure" and HTTPS self-signed as "insecure" when the reality is that HTTPS self-signed is more secure than plain old HTTP (yes, I know, you can MITM self-signed, but at least it is encrypted).
- TazeTSchnitzel 12y ago> The icon definition hasn't expanded with its new scope, so specifying low, medium, and high definition formats is left up to server hacks Not really. The Windows icon format .ico did "responsive design" before the term was even coined. It supports multiple sizes and bit depths (remember Windows used to have to support everything from 1-bit to 24-bit colour) stored within a single file. > There's no way of in-lining the icon (e.g. for single page applications, appliances, etc). Huh? <link rel="shortcut icon"> works with data: URIs just like everything else. For example, my personal site uses one: http://ajf.me/ http://ajf.me/ Source code: <link rel="shortcut icon" href="data:image/x-icon;base64,AAABAAEAEBACAAEAAQCwAAAAFgAAACgAAAAQAAAAIAAAAAEAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////AP//AAD+fwAA/38AAP9/AADFbwAAuW8AAL1vAADBbwAA/W8AAL1vAADDQwAA/+8AAP9vAAD/8wAA//8AAP//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"> > Apple now has their own incompatible favicon "apple-touch-icon" which is just a higher resolution favicon. This is mostly true, but I guess they wanted to avoid scaling up 16x16 favicons into a blurry mess on iOS, so made icons specially tailored for the iOS homescreen into their own category. > They can be used to trick less technical users into believing a HTTP site is a HTTPS one. For example make the favicon a green padlock. This is mostly a browser issue, and may be resolved by marking all HTTP sites as insecure (which some have proposed). This could be solved in future by allowing them only for HTTPS sites :D
- bootload 12y ago<link rel="shortcut icon" href="data:image/x- icon;base64,AAABAAEAEBACAAEAAQCwAAAAFgAAACgAAAAQAAAAIAAAAAEAAQ AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////AP//AAD+fwAA/38AAP9/ AADFbwAAuW8AAL1vAADBbwAA/W8AAL1vAADDQwAA/+8AAP9vAAD/8wAA//8AAP //AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA AAAAAAAAAAAAAAAAAAAAAAAAAAAA"> very clever, tried this (ajf) - did you code this or export via an editor?
- oneeyedpigeon 12y agoDown voted for breaking the site. Not that it helps...
- 12y ago
- deleted 12y ago[deleted]
- deleted 12y ago[deleted]
- deleted 12y ago[deleted]
- TazeTSchnitzel 12y agoIt's mere coincidence I saw your comment when I did. I'm not "pounding F5", but I did edit my comment above a few times, which also causes a page re-render.
- byuu 12y agoFair enough then, sorry. But why did you quote me again in my corrected post? :/ I'm not going to delete it, don't worry. I don't really care about comment scoring, I mean what I say and stand by my words. (but I guess it's nice that your quote is keeping what I said in black text, eh? :P)
- byuu 12y agoIt's positively galling how happy he is about such a terrible decision. How many billions (trillions?) of wasted favicon.ico requests have been made because they didn't bother to engineer this the right way and make it a <link> tag in the document? And pushing the Windows-specific icon format was just icing on the cake. And now Apple's doing it too with two more of their own requests. I wish we could send him the bill for all the wasted power, all the wasted developer time (even ten seconds per developer for all 100 million+ sites out there adds up to quite a lot.) Then see how glad he was he checked this misfeature in. EDIT: I don't care if you downvote, but if you do so, please tell me why I am wrong. I'd genuinely love to hear why you think this was a good idea.
- TazeTSchnitzel 12y ago"It's positively galling how happy the inventors of robots.txt were about such a terrible decision. How many billions (trillions?) of wasted robots.txt requests have been made because they didn't bother to engineer this the right way and make it a <link> tag in the document? I wish we could send him the bill for all the wasted power, all the wasted developer time (even ten seconds per developer for all 100 million+ sites out there adds up to quite a lot.) Then see how glad he was he checked this misfeature in."
- wareya 12y agoRobots.txt is different. Without it, bots have no way of knowing whether to get any other data from the site. You would need "bots allowed" information in the HTTP handshake itself to prevent bots from accidentally hitting pages they shouldn't. This can already be Very Bad.
- TazeTSchnitzel 12y ago> You would need "bots allowed" information in the HTTP handshake itself to prevent bots from accidentally hitting pages they shouldn't. Humans could also hit such pages. If your GET requests change state, there's no helping you.
- aembleton 12y agoSort of related - on a previous HN discussion that moved onto favicons, someone suggested a website they created for helping to create them. That is http://realfavicongenerator.net/ http://realfavicongenerator.net/ I've found it very useful. Select a picture and all sorts of different formats of favicons are created.
- jongalloway2 12y agoI'd like to see SVG favicons become a standard so we don't need to keep packing favicon files full of different sized bitmaps. Apparently Firefox supports it: http://caniuse.com/#feat=link-icon-svg http://caniuse.com/#feat=link-icon-svg
- freshyill 12y agoThe sooner we get away from the asinine practice of using a Windows format for this, the better. It looks like all the current browsers support .png favicons, so we can at least cut out .ico at some point in the near future. .svg sure would be even better though. Someday, hopefully.
- evan_ 12y agoOne reason why this isn't the perfect solution it may sound like is that often different size icons have slightly different designs. Near the end of this post: http://www.hicksdesign.co.uk/journal/branding-firefox http://www.hicksdesign.co.uk/journal/branding-firefox Compare the 128x128 and 48x48 icons, and then compare the 48x48 and 16x16. As you go from 128 to 48 much of the detail in the fox's fur goes away, and as you go from 48 to 16 it becomes a simple gradient and the detail on the planet disappears as well. If they simple resized a vector image, the 16px would be a muddy mess. (There are probably much better examples somewhere, but this is just the one I've used in the past- apparently, for the last 10+ years...)
- swift 12y agoSVG images support media queries, which handles this use case pretty well. See here: http://blog.cloudfour.com/media-queries-in-svg-images/ http://blog.cloudfour.com/media-queries-in-svg-images/
- wvenable 12y agoAnd circle is complete: infinitely scalable icons defined for specific resolutions!
- swift 12y ago
- emehrkay 12y agoI love these stories. Is there a general software site with shorts like this (kinda like http://www.folklore.org http://www.folklore.org)? This was pretty good writing too. I was able to easily imagine what it would be like working at 10pm for Microsoft in the 90s. I begin to wonder if the characters knew if they were shaping the internet. Id like to read something about the first iPhone's Safari team. I bet they had to jump through major hoops to build that browser.
- jabo 12y agoI wonder how many people working on ground-breaking stuff today are doing so unbeknownst to them, without realizing that they are shaping the field that they are working in.
- jicea 12y agoIf you're into podcasts, you should check this episode of Debug http://www.imore.com/debug-11-don-melton-and-safari http://www.imore.com/debug-11-don-melton-and-safari : it's Don Melton's interview, former Engineering Director of Internet Technologies at Apple, talking about open-sourcing Mozilla, building Nautilus, creating WebKit and the Safari browser. This one is also good, again with Don Melton, http://www.imore.com/debug-111-don-melton-blink-servo-and-more http://www.imore.com/debug-111-don-melton-blink-servo-and-mo... about Servo and Blink.
- szatkus 12y agohttp://blogs.msdn.com/b/oldnewthing/ http://blogs.msdn.com/b/oldnewthing/
- yuhong 12y agoA security flaw in IE5 support for this feature: http://web.cip.com.br/flaviovs/sec/favicon/index.html http://web.cip.com.br/flaviovs/sec/favicon/index.html http://technet.microsoft.com/en-us/security/bulletin/MS99-018 http://technet.microsoft.com/en-us/security/bulletin/MS99-01...
- jabo 12y agoOn a related note, anyone know why Safari has done away with favicons next to tab titles? Safari is pretty unusable as an everyday browser for me without them.
- reubenmorais 12y agoMost browsers have de-emphasized favicons in their UIs due to phishing, by moving them as far from the address bar as possible or through other measures, like Safari which only shows it when the address bar is focused. People used padlock favicons to trick users into thinking they're browsing a secure website.
- jabo 12y agoHmm, looks like Safari does display the favicon right next to the address bar: http://i.imgur.com/Gj0Wu8h.png http://i.imgur.com/Gj0Wu8h.png So someone could theoretically use a green padlock icon as the favicon and still trick users. My gripe is that with favicons missing in the tab bar, it's pretty hard to quickly navigate to the tab I want: http://i.imgur.com/yhStBMj.png http://i.imgur.com/yhStBMj.png
- robotresearcher 12y agoThat's not the current version of Safari. The current version 8.x.y does not show favicons.
- couchand 12y agoIt's hard to imagine using a modern browser without favicons on the tabs. What are the folks behind Safari thinking?
- lucianmarin 12y agoIt’s easier on the eyes. You don’t to squint at a 16x16 images to get to the right tab. Once you get used to it, you won’t want to go back to Firefox or Chrome. I use Safari 8 daily and it’s simply amazing, fast and reliable.
- snambi 12y agoWow! This is an awesome story!
- deleted 12y ago[deleted]
- WorldWideWayne 12y agoI put a favicon.ico on one of my first sites and I was pleasantly surprised to find that the request for the favicon was only made when someone bookmarked the site allowing me to track the number of people who did so. Of course that is no longer the case, but it was nice while it lasted.
- johnchristopher 12y agoIn the early 2000s mozillazine and others were covered with posts asking how to display and update a favicon reliably. Browsers seemed to randomly display and update it and your post explain some things I saw back then.
- dheera 12y agoYou can still look for (the absence of) a referer while filtering out bots and crawlers. It's not perfect, but few people type in URLs manually, no if you're getting repeated requests from a human user with no referer, it's highly likely it was bookmarked.
- khoatv 12y agoLove the story! Honestly I often stare at the loading icon until the favourite icon is fully loaded.
- bsimpson 12y ago> you just had to put a file named favicon.ico at the root of your IIS Server, and you were good to go! That sentence says a lot about MS's view of the world in the 90s. "Just put an image in a Microsoft-proprietary format in a Microsoft-named location on your Microsoft web server to see this neat little feature in your Microsoft browser."
- laserbutt 12y agoI read this post a while back but somehow it won’t burn out. So I’ll throw a little more gas on and add some history. In 1997 I’d wake up each morning after maybe 5 or 6 hours of sleep, shower and get dressed, wake up my 4 year old daughter, feed her and dress her, and then take her to daycare. Then I’d go to work and one of the first things I’d do is read through the late night checkins. I was Bharat’s manager. Ray’s story is legit. Bharat had checked in a feature late one night, without a code review, and hoodwinked a junior PM into okaying the “spec”, which I found out later was not much more than a scribble on his whiteboard. First I dropped by the the PM’s manager’s office (who now heads up code.org, and who apparently chewed out the PM after I left him) and then I went to chew out Bharat. That’s just the way it worked - I knew I’d be getting a call (we had phones back then, on our desks) from my manager. Of course Bharat wasn’t there - it was like 930 in the morning. Eventually I did chase down Bharat later that day. I was unhappy because a) I hated the implementation - it should have been a link-rel or something similar that didn’t invoke an extra http request, b) I knew based on the way he’d leveraged the IE cache to store the .ico file that if the user ever manually flushed the cache the file would get deleted but the cache index would not get nuked -ie. he checked it in with a difficult to fix bug c) the code hadn’t been reviewed (which was stupid, rare, a potential firing offense, but most importantly could get you assaulted by the thugs who lurked in building 26). It was never a problem that he hoodwinked the junior PM - just funny. In the end, we agreed he’d get the code reviewed ASAP and he’d fix the bug. The code review happened within the hour (Bharat’s code was fine, but years later it was found that the lower level code it called resulted in ms99-018). The second didn’t - the bug entered and then later got pushed to the next release by one of the PMs. Then Bharat left, and I left, and others… and the bug lingered for years. I’d send whiny emails every couple months about it to the folks still working on IE and… fixing the bug got pushed the next couple releases. I can’t remember when it was finally fixed, but someone forwarded me the checkin mail when it did… I wish I’d kept it. At any time that week that Bharat checked in the feature I could have sent an email and the checkin would have been backed out. I did hate the implementation… but I liked the feature. It had nothing to do with somehow “screwing Netscape”. It was just a nice, simple, cool feature - easy for web-devs to take advantage of, nice for users. So the bureaucracy broke down that day, and the result was a popular, inefficient, buggy feature. The right call? Ray says it was. For me it was one of thousands of calls that we all have to make in a career, most right, some wrong, and some will be debated forever. I guess this is the latter. Move on. Maybe UnoriginalGuy can get his ideas in some standard and implemented in Chrome or Safari. Or he could just check some code in late one night when nobody's around to stop him - I'm sure Ray will okay the spec ;-)
- sedatk 12y agoSuch a small yet significant achievement, and it only was realized by jumping over the corporate bureaucracy. It makes you think a about how much innovation has been lost in the gears.
- Eric_WVGG 12y agoThe filename “favicon.ico” continues to drive me crazy. I always hated Microsoft’s insinuation that bookmarked or saved web pages were somehow analogous to “favorites”…