Browser Version Timeline
Published 16 years, 3 months pastWay back in March of 2007, I moderated a SXSW panel called “A Decade of Style”. As part of the introductory material, I created a browser-history timeline in Keynote, spread across two slides. I’d always meant to throw it up on the web for general edification and reference purposes. So I finally have, in a slightly simplified visual format (the original had a parchment-like background and so on).
In the end, the web form of this is pretty simple, even though it wasn’t simple to produce. It’s just a series of images, one per year. I have in mind a way to do it without the images, which would be nice, as that way the information would be accessible to the blind. Right now, all the images just have empty alt values, I’m sorry to say. Besides which, creating the same timeline out of structured content would be a fun challenge, albeit one I really don’t have the time to tackle right now.
A few notes:
-
Internet Explorer has two lines, one for Windows and the other for Macintosh. I did this because their release schedules often had little or nothing to do with each other. The other browsers represented typically release cross-platform on or about the same day, and so each got a single line.
-
The temporal resolution is one month. In other words: no, I didn’t attempt to place the vertical connector bars so they correspond to the specific day of the month a browser was released. In many cases, I don’t have that information—just the month and year of release.
-
I was interested to discover that the “quietest” years in the timeline were
1999, 2002, and 20041999 and 2002. (My earlier belief that 2004 was quiet was due to my having the wrong year for the release of Netscape 7.2. Um, whoops.) -
Because the timeline was created for a session about CSS, the timeline starts in 1996 and doesn’t include pre-CSS browser versions. I may extend it backward at some point, although that introduces interesting questions like whether or not to include Mosaic, Viola, Cello, and so forth; and whether to extend it all the way back to 1989.
-
Yes, I’m missing browsers such as Konqueror and iCab, not to mention the whole forest of Gecko spin-offs like Camino and Flock. Again, there’s the question of which browsers to include and which to omit. This was dictated partly by perceived market share, but mostly by good old-fashioned laziness.
I’ll do my best to address any suggestions for improvement, though this is kind of a side project and so commands a comparatively small share of my attention. Still, even if it never changes again, I’m happy that it’s finally out into the world.
Comments (20)
Nice…and quite a different design from the timeline on Wikipedia. I assume you’ve seen it already?
Actually, I hadn’t see that, Fyrd; thanks for linking it! Had I found it, I probably wouldn’t have bothered with assembling my own paltry effort. Ah well…
Hey, at least your version’s less cluttered and doesn’t require SVG support. As the original author of the timeline on wikipedia, I can certainly empathize with the effort you must have put into getting all the dates and drawing up the image, as well as deciding which browsers made the cut.
Kind of funny reading your notes, as they’re the same issues I ran into. If at any point you expand your timeline and need to find more release dates, I’d suggest looking at the source of that SVG file, they’re hidden in there.
Eric, nice job. However, I have to think that one of the best things that will come out of your post in the SVG timeline on Wikipedia that Wikipedia user ADeveria is credited with (whom I take is a.k.a. Fyrd). I really like seeing the “Based on” relations.
Wonderful graphic. Thank you.
I agree that it’s nicer and less cluttered than the Wikipedia version.
And I have a CSS question… Why do you repeat :hover in the
#timeline:hover img:hover {} rule?
That really puts into perspective how long it was between IE6 and IE7.
Hopefully we won’t have to wait that long again.
Eric have you ever looked into an easy way to combine css and timelines/charts? I was bored awhile back and created this but it would be interesting to see somebody as smart as you come up with something using css and html.
Very nice. It makes apparent Microsoft’s inexcusable 5 year gap from 6.0 to 7.0. Hey Eric, I’ll buy you a beer if you overlay market share. Just kidding!
[I am wondering why your scaling the images in the CSS (368.5px??). In browser scaling is no good, missing month line indicators, etc…]
Thanks, Eric!
No mention of Mozilla? I suppose it’s a bit difficult as it continued to be developed for a while after Firefox came along.
hey eric,
just noticing that netscape 7.2 was in 2004 not 2003.
XP/SP2 probably should be noted as well. Although it was an OS upgrade it included several changes to IE, some of which broke some backward compatability with previous versions of IE6. http://www.microsoft.com/windowsxp/sp2/ieoeoverview.mspx
hard to believe you would leave mozilla out of the mix. Mozilla 1.0, 1.4 and 1.7 had several million users and likely more marketshare than IE for Mac, or early Safari, or Opera releases.
You can get dates for those releases off http://www.mozilla.org/about/timeline
Whoops! Had a typo in my notes. I’ll get it shifted. Thanks for pointing out the error.
I’m sure that Konqueror fans feel the same way. For what I was doing, I had to stick to a limited set of browsers (there’s only so much vertical space on a slide), and those were my choices. If I ever decide to go definitive, I’ll certainly add in Mozilla, but I think the Wikipedia sources do a better job of being definitive anyway.
Neal, I’ve never seen an easy way to do timelines with HTML+CSS. I’ve seen one or two efforts similar to yours, but my thinking lies in a somewhat different direction. No proof my ideas would actually work, though!
Chris, I scaled the images in an effort to get to a decent overall timeline size. In my browser, they scale quite nicely, with no dropped lines or other visual problems. Which browser are you using?
Another approach to timeline construction can be found at MIT at: http://simile.mit.edu/timeline/
Regards,
-Bob
Eric, I’m using: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.11) Gecko/20071127 Firefox/2.0.0.11
But also see the exact same rendering issues in IE7. View this image to see what I see.
I like what you’ve done here. I’m wondering if there’s a reason why you’ve omitted Flock. Flock has recently received a bit more credibility by getting recommended by the Netscape folks.
http://blog.netscape.com/2008/01/16/netscape-recommends-flock-too/
Flock 1.0 was launched in November. 1.1 was just announced this week.
Time flies when you are having fun; I can remember the introduction of Netscape 0.92b very clearly in my university years!
What is so nice about your posts Eric, is that so many people care to leave a link to other very useful sources of tackling timelines; it never ceases to amaze me how you get so much qualified response!
1. You should indicate which versions of IE are for Mac and Windows respectively.
2. The names of the browsers would be nice too.
3. “whether to extend it all the way back to 1989.” – Why of course – if it is to be fully accurate. I didn’t know browsers went back that far! Was 1989 Tim Berners-Lee’s initial web browser?
4. In your previous post about styles you wrote “In some browsers, inserted text is underlined. This leads to confusion, because most people expect underlined text to be a link.”. I find it odd that you used such deleted and underlined text in this post. One could cry hypocrisy, but you’re too nice for that. So I’ll just wonder silently about it. :-)
Pingback ::
Trevor Davis | Blog » Weekly Link Round-Up #14
[…] Browser Version Timeline […]
I would very much like to see you go back in time to Mosaic and the other older browsers. The obscure browsers you mentioned don’t really matter and you shouldn’t worry about them. But the historic ones would be cool to see on this graph.
Pingback ::
backdraft » Blog Archive » Linea de tiempo de navegadores
[…] 579 : Eric Meyer presenta la linea de tiempo de navegadores, prestar atención a los detalles en el gráfico como que Internet Explorer tiene 2 lineas […]