The Evolution of Web Design

Can you believe that the first published website is already 20 years old? Web design has come a long way since the first website was published by Tim Berners-Lee in 1991. This infographic is a peek at the evolutionary tale of web design, which is ironically still in its infant stages. Enjoy the infographic below and let your imagination wander. You might find yourself asking, “Where will web design be in the next 20 years?”

The Evolution Of Web Design

View an enlarged version of this Infographic »

 

Facts and Stats to Tweet:

  • The very first website was published in 1991 by Tim Berners-Lee. »tweet«
  • Flash was introduced by Macromedia in 1996. »tweet«
  • Dynamic design language PHP gained popularity with its PHP3 release in 1998. »tweet«
  • In the year 2000, Microsoft Internet Explorer 5 became the first web browser to achieve better than 99% support for CSS1. »tweet«
  • In 2000, the W3C recommended the second release of Javascript, and by 2002, nearly all browsers supported it. »tweet«
  • In 2008, mobile access to the internet exceeded desktop access for the first time in history. »tweet«
  • Today, two thirds of cell phone users say they access the web/email from their device. »tweet«

About The Author: Sean Work is the marketing coordinator at KISSmetrics. Follow him on twitter (@seanvwork) or on .

  1. Takes me straight back to my early years of webdesign, messing around with Frontpage and MSPaint. Great story!

  2. Actually Flash existed before 1996 under a different name:

    SmartSketch (pre-1995) >> FutureSplash Animator (1995) >> Macromedia Flash (1996)

  3. Thanks – interesting article. Wonder where we’ll be in another 20 years time??

  4. It is great to see that popular sites are keeping up with the times.Being certain about technology is impractical because you may not know what is happening at other part of the world.

  5. great info-graphics… can I share this on my website…(Im happy to link back to this page for more details as source…)

  6. Looks great and is very informative. One minor, nerdy quibble though: the Java logo is used on “The Rise of Javascript” Significant Achievements. Java =/= Javascript.

  7. Ohh… A great infographic ;) Thanks for sharing!

  8. This infographic is so on point!

  9. The only thing missing from this (awesome) post is: http://www.youtube.com/watch?v=dMH0bHeiRNg

    Nice work guys. And LOVE your new option for the auto direct to a link from the insights question.

  10. Website design can make or break your site. A site needs to be eye pleasing, not too busy, and functional. There also needs to be pertinent information, but not too much as in today’s world, people are too busy to spend time reading information

    • It does but at the same time, there are so many sites that are indeed very ugly yet make millions of dollars. It’s a quite the conundrum, really.

  11. you describe in nice way,we easily understand in flow-chart,really good job.There also needs to be information, , people are too busy to spend time reading information…..

  12. I don’t know others counstries, but Brasil always had 10 years of delay in the years related in this infographic.

    • I’m sure and that really is a shame, but hopefully as technology evolves, they’re able to keep up or much closer than they were before.

  13. I remember when I was first introduced to MSPaint. I fell immediately in love. Those were good times.

  14. Fact that technology is changing at a constant and rapid pace. Website design can make or break your site. A site needs to be eye pleasing, not too busy, and functional. There also needs to be pertinent information..

    • Sometimes ugly does win, but it’s usually not the case and when it does win, it’s usually for random, affiliate type sites.

  15. I think you need to start earlier…Ted Lewis’s Xanadu (www.xanadu.com) project was the first hypertext model of what became html which is the basis of the web. He based his work on a an article in Atlantic Monthly published in 1945: ‘As We May Think’ by Vannevar Bush (http://web.mit.edu/STS.035/www/PDFs/think.pdf).

  16. What’s most interesting to me is how much the web hasn’t changed. We’ve come full-circle in many ways. At one point we went extreme with the rise of flash and other crazy technologies. Now, more and more websites and noteable designs use simple layouts with a focus on text content, minimal graphics/media, contextual navigation.

    As web designers we often curse the difficults created by how the web evolved in ways that made our jobs difficult. But truly, the original innovators were visionary in their work.

  17. I love this idea, but calling this an infographic is streching this a bit…. Putting text and images inside chronologically ordered circles gives me no information that a bullet-point or numbered list wouldn’t give me, and the information is not more accesible or understandable either..

    • I have to disagree with this a little. The point of an infographic is using visually oriented shapes, symbols, etc. to make the data/info more palatable. Many of us are extremely tired of bullet points and numbered lists. Our consumption of information is changing and this infographic does a good job of making a timeline more visual than a list.

  18. Not too shabby! I would have liked to see more of the really awesome designed sites at the end (not exactly digg or flickr) But over all interesting infographic.

  19. IMHO you forgot sumthin…

    The rise of adaptive layout.. CSS Media Query instead of mobile sites

    oh also typography evolution with font-face :D

  20. This infographic is illegible on my smartphone. I seen to be getting a low-res version of the graphic. Nice circles, though.

  21. In Early to Mid 2000s:

    Web designers began ditching tables and using JavaScript for page layouts.

    Not quite. Swap JavaScript for CSS.

  22. Well written informative post. I agree with Sten Moe’s comment above, but nevertheless, an enjoyable and informative read. Thanks for taking the time to post.

  23. nice and creative, many thanks you have put a lot of work into this

  24. great infographic! it’s easier to understand and I can clearly visualize it. I can’t believe web design has come a long way! I still want to learn how to do it though.

    - Jack Leak

  25. I just discovered this site and there’s some really interesting and different articles that you might not find elsewhere.I also am really excited to be a web designer in 2011. Browsers performance is getting better and having to design for all types of devices gives us more
    work!

  26. All of my blogs evolved from beautiful magazine-like designs to simple, readable with the minimum of design elements. Readers are happy with this, it’s easier to read and the pics I or they post a more distinguishable. Internet is not a luxury anymore, so are the requirements to the design. Much depends on the audience, however. Some sites are just pics and titles and they are OK.

  27. Wow! you have a very nice and complete collection of tips on your blog. Thanks for sharing them. Alex Ruiz.

  28. Thank God! thanks for the replay mateIt really is good to temper expectations early, Just wait until he tweets about dinner with Digger Phelps

  29. This is very interesting especially a guy like me who is doing web design since 1996 ! Thanks for the posting !

  30. Wow! Nice illustration of the evolution of web design-keep going!

  31. Thanks for this inforgraphic! I become interested reading this infographic rather than reading wall of text. It’s good to know web design history from the very start. It’s been 20 years. :)

  32. Hey,

    Excellent info graphics. :)
    You have explained a great deal here !

  33. I read this post and its such a great inspiration. And the presentation with historical method makes it a great read, Thanks for sharing as ussual

  34. Great info graphic!
    thanks for sharing nice information.

  35. It is great to see that popular sites are keeping up with the times.These type of technologies re very helpful for designers.

  36. Yeah you have one of the best sites and information around. we love to see more of it! keep up the work!

Comments are closed.

← Previous ArticleNext Article →
Buffer