A Brief History of Web Design for Designers | Hacker News Reader

A Brief History of Web Design for Designers

blog.froont.com

92 pointssandijs27 comments

Neat start, but so many holes! JavaScript didn't take off for years, jQuery didn't come about 2006, and arguably the real start of the JavaScript "renaissance" was Prototype in 2005. CSS grid layouts got their start in around 2004, trying to finally replace tables for presentation. The larger CSS frameworks started in 2006 or so. Flash didn't even really take off until the Flash MX 2004 with the release of ActionScript 2. Even then ActionScript 1 didn't come out until 2000 with Flash 5 and Flash 4 before that had very little functionality with support for Actions, but people started using them right away in 1999.

Well, I guess my take isn't a brief history, but there is so much fun to learn in there on how we got to where we are!

Yes, the history of web development is easily forgotten. JavaScript was basically considered pretty useless by many web developers before Prototype and jQuery came and provided a compatibility layer that fixed browser differences. It was not worth the effort to add javascript to your html because no one had any confidence that it would work in all types of browsers. It's less than 10 years ago.

In South Africa JavaScript took off like crazy in the late 90's. Netscape was still big then. Here's a thing I built in 1997 - it was a side project I used to teach myself JavaScript -

http://www.wittenburg.co.uk/mobile/

Choose "Handsets" from the top menu, and play around with manufacturers and network types to narrow the list of cellphones

Well, the first web access in 1990 was graphical. http://www.w3.org/History/1994/WWW/Journals/CACM/screensnap2... Extracted from Tim Berners-Lee's (inventer the WWW) comments http://www.w3.org/People/Berners-Lee/WorldWideWeb.html.

The history is far deeper and richer than captured here.

I always enjoy recaps of tech timelines. Thanks for putting that together.

My wishlist of more web timelines with additional/different focus would include:

20 years of web advertising and tracking: this would outline the nuclear arms race between web authors and web browsers' user protections and google ranking algorithms. Stuff like cookies, the invisible 1 pixel image pingback, seo keyword spamming, etc

20 years of web technology failures: Java applets, XHTML, semantic web, etc. It's instructive to use hindsight to explain why some technologies/ideas don't get adopted.

Open question: would VRML count as a failure?

The deep silence says Y E S...

The amusing thing about web design trends is the dislike of tables, followed by the creation of CSS and JavaScript hacks to create columnar web design. Tables are now back, but they're called "layout tables".

What's been lost are the good page layout tools that didn't require manually writing HTML and CSS. Macromedia Dreamweaver once allowed laying out a page without even looking at HTML source. Now, you can't even buy Dreamweaver; it's rental-only.

Please point me to something about "layout tables" because I haven't hear of or seen a resurgence of <table/> layouts.

I'm not sure many people refer to "layout tables", but a significant proportion of the online "grid systems" and "frameworks" are dedicated to essentially producing the same functionality as <CENTER><TABLE><TR><TD COLSPAN="2" VALIGN="centre"> etc. in a more verbose, less reliable manner, using HTML classes, CSS and the odd JS hack.

That's what gets me. The div/float/clear approach, which is one-dimensional, is a poor match to "modern grid layouts". Elaborate CSS gimmicks are needed to fake it. Here are four of them: http://www.sitepoint.com/easy-responsive-css-grid-layouts/ One just uses tables.

Now we have "grid" as a primitive in CSS. Inevitably, it needs a special case for some versions of Internet Explorer. There's "grid", and there's "-ms-grid". Here's the W3C spec.

http://dev.w3.org/csswg/css-grid/

It's a lot like tables, but it uses different terminology and has some extra bells and whistles, so that makes it OK.

There are still Dreamweaver like tools, they are just terrible and produce completely unmaintainable code that doesn't work with anything other than simple static sites. If anything tools like Dreamweaver/Frontpage were made obsolete by Wordpress and services like Squarespace, etc.

Also, I'm not sure what you are really referring to in your first paragraph or what the fact that you can only rent Dreamweaver (true for the entire Adobe Suite) has to do with anything.

Unfortunately you kind of have to understand a lot about the HTML and CSS to make sure the layout will be correct on a dizzing combination of actual resolutions, fake resolutions, screen sizes, aspect ratios, "finger sizes" and viewer distances. All without a reliable way to find out most of that information. :-|

However there is always the burger to the rescue.

☰ <- yum!

You missed Web 2.0, around 2004, the rise of AJAX.

Designers don't care about that...it's dangerously like code.

Note also the omission of SVG support, WebGL, or any of a number of similar technologies that actually make the loss of Flash compelling.

True. I also left out Frames. Web 2.0 for me was too much about aesthetics, but AJAX is very close to JS. Both deserve a spot in an extended version of the history though!

It's about design.

The post also states that Flash was "freedom", which it was only in a design sens.

It was a freedom in programming too, JavaScript was/is still buggy from browser to browser and with Flash using ActionScript you could code once and run confidently in any browser with the plugin.

"Web 2.0" was a lot less about aesthetics than "flat design" (the emergence of custom font solutions that didn't require Flash or graphics was the real revolution; the "flat"-ness itself is just a fad, and for that matter HN has been pretty flat looking for a while now!)

The browser wars deserved a mention, probably in the Javascript section too, and the death of the "web safe" palette.

Embedded video everywhere is probably the biggest boon to designers in recent years, even if it's been theoretically achievable since Flash came onto the scene. Or earlier if you count animated gifs

"The dark ages of web design (1989)"

The Golden Age of Accessibility maybe :-\

Except not that many of us had means to access that information. I totally agree with this though: http://motherfuckingwebsite.com/

From 1989 to 2014 encompasses 25 years of progression. If you think about any other 25 year segment in history, I doubt you would have found such changes in print/media than there has been in the last 25 years. Consider that it took 25 years just for the printing press to move from Germany to England[1].

Imagine if it took 25 years for any technology trend today to go from the US to any other developed country in the world.

[1] http://en.wikipedia.org/wiki/Printing_press

I would like to see an article that goes depper into the bright future of web design. The future no doubt is bouncy and full of smooth animated transitions. It makes web apps easier to use and gives people what they have been used to from their smartphone apps.

Google's Polymer, react and the famo.us javascript libraries seems to be only the beginning of a string of new libraries that pushes html rendering optimisation to new levels and makes it easier to do tweening and handle user events.

I like how in the "what's next" section, we still don't have vertical centering.

Thanks CSS!

flex box is on its way =D (I hope, lol)

It's so close to being suitable for production!

I was hoping for a little trip down memory lane in terms of aesthetics. All of the gifs are beautiful, but look like they are from 2014!

A really nice overview otherwise.

Reply on news.ycombinator.com