20 Years of Websites Evolution: Part 3 – Dynamic Pages

This is part 3 in the series: 20 Years of Websites Evolution.
Previous part: Part 2 – Content Management Systems.

In the previous part we saw how the systems which supported website publishing evolved during the years. But that evolution, which ended with CMS products, only affected those who create and maintain the sites, and site visitors were not aware of it. But there was another technological evolution that occurred simultaneously which had greater impact on them, since it happened in their own browsers. This is the Client Side Evolution.

Dynamic Pages

In the year 2000, sites were not just static on the server-side, they were also static in the client site (the visitors browsers). This meant that once the page was loaded in their browser, the only interaction users could have was to navigate to another page. This greatly limited what they could do in a site, and for many it was not enough. More interactivity features were required like:

  • responding to mouse & keyboard inputs (dynamic menus)
  • animation of text, drawings, and images
  • streaming of audio and video
  • microphone and camera interaction
  • advanced vector and raster graphics

in other words – they wanted to feel like the site responded to them.

In the start of the century, HTML technology (which is the language of the browsers) was very limited and couldn’t be used in order to fulfill those demands. So in order to achieve those requirements sites began use browser plugins.

Browser Plugins

Browser plugins are separate programs which run alongside the browser. Users had to pre-install the plugin before entering the site, and then they could see sites powered by those plugins. There were 3 big plugins which dominated the market share: Adobe Flash, Java Applet, and Microsoft Silverlight

Since they ran on the user’s OS, browser plugins had greater access to the user computer. This meant it was possible to create better quality interactive sites with them than it was possible with just plain HTML. Because of this they were used to build Rich Internet Application for over a decade.

But the honey-moon period did not last forever. Browser plugins still contained “static” content – for example changing an image required developing and uploading a new site version, which took a lot of time and money. They were also plagued with stability, performance, SEO and more importantly – security issues. When Steve Jobs decided in 2010 that his new iPhone will not support flash, this signaled out the end of the RIA age. Presently all plugins manufactures have stopped supporting them; it began with Microsoft Silverlight, later joined by Adobe Flash and finally even Oracle gave up on their Java Browser Plugin.
Even the browsers themselves have stopped supporting those plugins; Chrome, Firefox, and Edge will not support NPAPI plugins at all very soon.

Clearly a better approach was needed. Lucky for us browser improvements in JavaScript & HTML gradually allowed to implement the interactivity needs without using any browser plugins.

Javascript

JavaScript is a scripting language which comes with all browsers, as a supplement for HTML. It’s initial purpose was to allow user interactivity once the page was loaded (but now it is used to achieve a lot more than that).

The use of JavaScript to change the page DOM content was initially called DHTML by Microsoft in 1997, but it had slow adaption rate because of browser differences – each browser had different JS & DOM implementation which made writing cross-browser code very difficult. That time period, when browsers manufactures fought over which implementation is better, was called the second Browser Wars.

In 2006, new JavaScript libraries (like jQuery, YUI Library, Dojo Toolkit and others) bridged the gap between browsers and allowed developers to create rich dynamic client side sites with widgets like: dynamic menus, picture galleries, rotating banners, calendar & time pickers, tabs, tree, tables & lists (with sorting and filtering), auto-complete, charts & graphs and even animations.

Beside creating richer client-side user experience, JavaScript had another important feature: the ability to communicate with the server in the background, without user interference (without causing a post-back). This feature is called AJAX, and it greatly improved the responsiveness of the sites, by enabling techniques like AJAX paging and dynamic content loading. The improvement in responsiveness sometimes even allowed sites to replace an entire desktop application – those sites are called Web Applications now.

The end of the Browser Wars:
By the year 2012 Microsoft conceded to W3C and released IE 10, which was the most standard-compliance browser it ever produced. Since then all browser manufactures follow (or at least try) the Web Standards which enable developers making native cross-browser applications without the need for special 3rd party JavaScript libraries.

Those unified standards (like ES6) allows JS to not only be used for user interactivity – now it has the power to create the entire site, by generating HTML inside the browser. This allowed the creation of new type of sites which are called Single-page Applications (SPA), which we will talk about in a later part.

The end of browser wars was also the final nail in the Visual Web Editors coffin, since those tools were designed to create static pages and had very limited support for dynamic pages. The lack of ability to create modern dynamic pages in those tools made them non-viable options for most clients, and today they are only used by niche web agencies to create only the smallest sites.

But functionality is not everything – sometimes your site also needs to look good.

Design

As more people started using the web, there has been an increasing demand to make sites look better, often because of competition. This had brought an entire new specialty – Web Design.

In order to support the increasing graphical design demand, client side applications needed to use newer and better techniques.

From the earlier days of Table based HTML design to CSS powered Grid Based Designs to Responsive Web Design and even the newer HTML 5 and CSS 3 techniques (like Flexbox, Adaptive Web Design ) and the upcoming CSS Grid, website design has been constantly evolving over the last 20 years with no end in sight.

In the next part we will learn how sites can connect to other sites in order to share their data.

Next part: Part 4 – Data Integration

What do you think?