Hi there, I'm Joe. My first post here on PantherTrick provides an overview of the problems web designers face when bringing their creations to life, how the situation has improved in the last decade with better browsers, and a preview of what future technolgies will bring to the web.
Where we are today…Web 2.0 and Web Apps
In the last year or so, web technologies have evolved into something we all call Web 2.0. Web 2.0 differentiates itself from the "old web" a big way – web sites are no longer mere static documents. Nowadays, the user-generated content revolution is built upon the backbone of sophisticated websites called rich internet applications, or web apps.
These applications push the boundaries of HTML to deliver an always-connected user experience that matches or eclipses that of a desktop application. Improving the user experience greatly eases the learning curve required to publish content on the web, and as a result, the web has blossomed into an even larger, more democratic community than it ever was in the early days of the Internet.
How did we make it here?
Web applications weren't built overnight. It's taken a lot of new technologies to make the jump from the early web to today's world of YouTube, Reddit, and Facebook. It's also taken more of a struggle than one might imagine to actually implement and widely distribute these technologies across multitudes of computers worldwide.
There has historically been one common problem that has prevented web applications and other technological advancements from really coming into their own: browser support of web standards. This is very nearly the absolute root cause of the web's multitude of problems.
What are web standards?
Web standards are design specifications made and agreed upon by browser vendors, designers, and standards bodies, such as the World Wide Web Consortium (W3C) or The Web Standards Project (WaSP). These are standards that cover many aspects of web design, such as how to display an image, how styling should work, how a web page communicates between a browser and a server, or even how HTML itself is architected.
Within the realm of web design there are currently three pertinent standards: HTML 4.01, CSS 2.1, and JavaScript, also known as ECMAScript. The latter two standards, maintained by the W3C, have a recommendation status, meaning that they are widely enough accepted to be the first choice when building a website that conforms to the most stable, most agreed-upon standards.
Why are web standards important?
As with any convention or standard, web standards establish a target for web browsers to hit when implementing web technologies. This prevents duplicative efforts as well – rather than have two browser vendors implement the same idea in incompatible ways, a web standard allows vendors to simply conform to an accepted specification. The hopeful goal of these standards is to make conforming websites look and function correctly in all web browsers that support these web standards.
So web standards are great, but what's the real fuss here?
Simply put, not all web browsers correctly implement or even support the currently recommended web standards.
Chances are you've already experienced this first-hand through the confusion of seeing a web page appear different in two different web browsers. As layouts get more sophisticated, you can bet a week's worth of sleep that the time spent testing and debugging the design in multiple web browsers will steeply increase. (Fortunately, this really has improved even within the last year. Whew!)
Now, imagine you're building and testing a web application that both look and behaves differently in different browsers! Oftentimes this frustrating predicament inspires elaborate hacks to work around the shortcomings in one or more particular web browsers in order to achieve a modicum of consistency for a given design.
So who's the culprit?
(Brief personal disclaimer … I'm a longtime Mac user, and I use both OS X, Windows, and Linux on at least a weekly basis. With the understanding that Apple clearly is not the end-all of computing, I do think the following blame is very rationally and properly placed…)
Microsoft's Internet Explorer has plagued web designers with incorrect, incomplete, or otherwise non-standard ways of rendering HTML, CSS, and even JavaScript instructions. This is a very real problem – for years, building a complex, sophisticated website has required endless hours of debugging and testing of techniques before achieving a look and function that may only be mostly consistent across different browsers at best!
This is nothing new. Once Internet Explorer began shipping for free on every Windows-based PC, IE's ubiquity, paired with its history of near-flagrant disregard for web standards (despite the company's membership status in the W3C), have meant that hacks and workarounds are often an absolute requirement if a designer hopes to reach the ~90% or so people using Internet Explorer as their web browser.
Got any good news, then?
Fortunately for everyone, the situation with web standards has greatly improved in the last six or so years. Internet Explorer itself has improved…somewhat, but other pioneering teams of web browser engineers have taken on the Herculean effort of moving web technologies forward.
New Kids on the Block – Firefox and Safari
The Mozilla Foundation's web browser technology, rescued from the sinking ship of Netscape Navigator, evolved into the runaway hit Firefox in 2004. The underlying technology Firefox uses, a rendering engine named Gecko, was built from the ground up to support and take advantage of web standards. Firefox has offered designers the correctness and consistency that web designers have yearned for, and it has also opened the door to newer technologies that sparked innovation in web design after a period of stagnation from about 1999 to 2003. (Sidenote: Gecko debuted in subsequent versions of a reincarnated Netscape browser, as well as Mozilla's eponymous Mozilla browser suite, both of which came into existence early in the decade and predate Safari.)
Meanwhile, Apple released the Safari web browser to the public in 2003, which drew its efficient, highly standards-conforming rendering technology from the WebKit project. WebKit now powers Google Chrome, several browsers native to Linux, as well as at least four major mobile devices' browser applications.
The WebKit project's dedication to web standards, speed, code portability, and innovation have taken the browsing world by storm. One company (so far), Palm, Inc., even considers WebKit so robust that they have built an entire mobile operating system (webOS) with WebKit at the core for the upcoming smartphone, the Palm Pre.
The Road Ahead
The improvements that Firefox and Safari have brought to the web have finally moved designers past the point of worrying about existing standards and onto the process of building the next web standards. These standards, which Firefox, Safari, and Chrome have already begun to implement, will facilitate even greater web application interactivity.
HTML 5, the frontrunner of this new generation of standards, aims to greatly simplify embedded audio and video, add new web app-inspired HTML elements, and allow websites to store data in a local database. The standard was started by a group of web designers and browser vendors, so the focus has been on creating more elegant support for effects already accomplished today through hacks or misappropriations of HTML elements.
The WebKit team has steadily added support for advanced styling, such as CSS gradients, CSS transforms, such as scaling and rotation, and even CSS animation. Meanwhile, CSS 3 has also been proposed and partially implement in Safari, adding slick features such as drop shadows and even robust multi-column layout attributes to the existing CSS 2.1 standard.
Other WebKit-created enhancements, such as the <canvas> HTML element, allow designers to create interactive pieces of artwork that may quickly rival the power of Flash animation in the near future. The <canvas> element also tells the story of an evolving web – what was once a Safari-only feature is now not only supported in Firefox, but is also a proposed standard as part of HTML 5.
The web has been a world filled with innovation and creativity since the very beginning. Its changing role as host to both the user-generated content revolution and the game-changing universality of web apps will most certainly continue to ripple through popular culture at large for years to come. Though the web's dark ages have set us back a bit, the promises of new technologies and fiercely competitive improvements in web browser technologies have truly rekindled the flame.
A lot of great stuff in this post. Now, lets see you make a graphical representation of what yo've discussed. I'm thinking an image/collage of the "browser wars" or predict the future. I know of a few image-based examples of this already out there, but lets see what you can come up with!
ReplyDelete