Skip to: site navigation/presentation
Skip to: Thoughts From Eric

Browser Version Timeline

Way 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 2004 1999 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.

20 Responses»

    • #1
    • Comment
    • Wed 16 Jan 2008
    • 1321
    Fyrd wrote in to say...

    Nice…and quite a different design from the timeline on Wikipedia. I assume you’ve seen it already?

    • #2
    • Comment
    • Wed 16 Jan 2008
    • 1328
    Eric Meyer wrote in to say...

    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…

    • #3
    • Comment
    • Wed 16 Jan 2008
    • 1347
    Fyrd wrote in to say...

    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.

    • #4
    • Comment
    • Wed 16 Jan 2008
    • 1430
    Ed Knittel wrote in to say...

    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.

    • #5
    • Comment
    • Wed 16 Jan 2008
    • 1432
    Sophie wrote in to say...

    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?

    • #6
    • Comment
    • Wed 16 Jan 2008
    • 1529
    Neal G wrote in to say...

    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.

    • #7
    • Comment
    • Wed 16 Jan 2008
    • 1548
    Chris A wrote in to say...

    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!

    • #8
    • Comment
    • Wed 16 Jan 2008
    • 1618
    John Faulds wrote in to say...

    No mention of Mozilla? I suppose it’s a bit difficult as it continued to be developed for a while after Firefox came along.

    • #9
    • Comment
    • Wed 16 Jan 2008
    • 1806
    chofmann wrote in to say...

    hey eric,

    just noticing that netscape 7.2 was in 2004 not 2003.

    • #10
    • Comment
    • Wed 16 Jan 2008
    • 1822
    chofmann wrote in to say...

    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.

    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

    • #11
    • Comment
    • Wed 16 Jan 2008
    • 2127
    Eric Meyer wrote in to say...

    just noticing that netscape 7.2 was in 2004 not 2003.

    Whoops! Had a typo in my notes. I’ll get it shifted. Thanks for pointing out the error.

    hard to believe you would leave mozilla out of the mix.

    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.

    • #12
    • Comment
    • Wed 16 Jan 2008
    • 2138
    Eric Meyer wrote in to say...

    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?

    • #13
    • Comment
    • Wed 16 Jan 2008
    • 2149
    Bob Monsour wrote in to say...

    Another approach to timeline construction can be found at MIT at:


    • #14
    • Comment
    • Thu 17 Jan 2008
    • 0100
    Chris A wrote in to say...

    Eric, I’m using: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv: Gecko/20071127 Firefox/

    But also see the exact same rendering issues in IE7. View this image to see what I see.

    • #15
    • Comment
    • Thu 17 Jan 2008
    • 0136
    Dan wrote in to say...

    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.

    Flock 1.0 was launched in November. 1.1 was just announced this week.

    • #16
    • Comment
    • Thu 17 Jan 2008
    • 0251
    Martijn ten Napel wrote in to say...

    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!

    • #17
    • Comment
    • Thu 17 Jan 2008
    • 0427
    Chris Hester wrote in to say...

    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. :-)

    • #18
    • Pingback
    • Sun 20 Jan 2008
    • 2308
    Received from Trevor Davis | Blog » Weekly Link Round-Up #14

    […] Browser Version Timeline […]

    • #19
    • Comment
    • Tue 22 Jan 2008
    • 1829
    Brenton Strine wrote in to say...

    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.

    • #20
    • Pingback
    • Fri 25 Jan 2008
    • 0939
    Received from 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 […]

Leave a Comment

Line and paragraph breaks automatic, e-mail address required but never displayed, HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Remember to encode character entities if you're posting markup examples! Management reserves the right to edit or remove any comment—especially those that are abusive, irrelevant to the topic at hand, or made by anonymous posters—although honestly, most edits are a matter of fixing mangled markup. Thus the note about encoding your entities. If you're satisfied with what you've written, then go ahead...

January 2008
December February