Tierra Innovation

Tierra Lab

The evolution of web aesthetics

It’s no secret that since the advent of “Web 2.0,” web design has taken a turn for the slick. Many folks in the realm of design and branding have noted the rise of lush reflections, gradients and sleek effects in every corner of the web. It often seems like these tropes have become the one-size-fits-all style for everyone from your high-tech startup to your local law firm. Lately Kristina and I have had several conversations about how designers, in the wake of all this slickness, seem to have abandoned some of the interesting ‘rougher’ web aesthetics we saw several years ago. This brings us to the larger question of how do web design aesthetics emerge? And in the case of slickness what’s really been the driving force—new technology, metaphors from other mediums, or just trends?

In the mid-nineties, the first wave of web design was heavily influenced by two things: print media and the UI metaphor of the desktop. In 1995, Clement Mok designed a desktop interface for CollegeView that used manila folders, spiral bindings and pencils as part of the user interface. Aspects of the desktop metaphor were carried over from operating systems to the web, where we also used the “page” metaphor to navigate through digital environments.

CollegeView, designed by Clement Mok in 1995

While these interfaces were easy to navigate and more importantly easy to learn, recreating the page in online environments often required rich graphic interfaces, which could be taxing on bandwidth. In addition, many designers were trying to achieve some of the graphic richness of print media, and in the era of dial-up it was hard going. Long load times lead to backlash, as end users got sick of waiting around for pages to download.

So in response, we started to let some of those heavy tactics go. In the late nineties and early 2000s, a new aesthetic emerged – one that embraced the constraints of the web. Flip through Deep Sites: Intelligent Innovation in Web Design by published by Max Bruinsma in 2003, and you’ll remember that it was quite a different time. Designers shifted away from a linear, page-based

Image from the book “Deep Sites” by Max Bruinsma, showing the website xs4all.nl designed by Johanna Balusikova

Image from the book Deep Sites by Max Bruinsma, showing usemedia.com designed by Joes Koppers

metaphor and embraced a hyperlinked reality. We stopped trying to emulate print and began to understand that web aesthetics could be based on the very thing that enabled them—code. Designers started asking themselves, what does html naturally do well? and then ran with it, blowing it out. Web pages started looking more boxy, more haphazard, and interesting in the way that they differed from print. In addition, web standards-based design picked up steam—a boon to end users, and a positive creative constraint for many designers.

Fast forward to November 2007. I was at web design conference where Elliot Jay Stocks gave a short, cheeky presentation called “Destroy the Web 2.0 Look.” His basic premise is that “Web 2.0″ is not a design aesthetic. In fact, the term has nothing to do with design. You can have all of the user generated content, syndication and rich media that comes with Web 2.0, without relying on design clichés like reflected logos, beveled edges and ’special offer’ badges. While Kristina and I agree with Stocks about the misnomer of “Web 2.0” as a design aesthetic, we would venture that there actually is a ’slick’ aesthetic afoot in web design. But it has more to do with CSS than with Web 2.0.

Right around the time that the ink on “Deep Sites” was drying, major web browsers began to seriously support CSS, and awareness and enthusiasm for CSS took off among designers. While it’s too dramatic to say that CSS changed everything in the world of web design, it changed a lot. There is a newfound richness in the surfaces of the web, coming ever closer to that of print media. A level of visual detail and graphic embellishment that would have previously choked bandwidth is now afforded by CSS. Web Designer Wall’s Best of CSS Design 2007 gallery has some great examples of sites that take graphic embellishment to new heights. And that’s not to say it’s all about images and textures. The control of typography on the web has made huge strides. In an interesting reversal, we’re once again striving for the precision and detail of the printed page.

Image from the Best of CSS 2007 gallery on webdesignerwall.com

So whither the ‘down and dirty’ web aesthetic of a few years ago? Does its roughness still hold value today? We think so. For starters, it’s refreshingly honest. It adheres to the notion of finding beauty within constraints. It says it’s all right for different media to have different aesthetics. Granted, it doesn’t transport you the way slickness does; instead it reminds you of exactly where you are—on the internet, on a screen.

And what about slickness and rich surfaces? There’s value there too. Slickness can provide a tangibility that we arguably need, in order for our actions on screen to feel physical and dimensional. Once you’ve experienced OSX who wants to go back to boxy OS9? Slickness can be immersing. It can elicit wonder.

But at the end of the day, the deluge of slickness just reminds us that roughness is hardly tapped out. We suspect there’s a lot of interesting unexplored territory there. The web is young, and we should be building on its visual language, not throwing out the baby with the bath water. So let the form—be it slick or rough—fit the content and the experience. Otherwise designers are just yielding to the cycle of trends.

Bookmark and Share


Leave a Reply

Copyright © 2010 Tierra Innovation, Inc.