Tuesday, October 28, 2008

Trends in Web Design

The web is like any designed media -- fads come and go. Here are some I've noticed in the past few years:

About two years ago, online publications like Wired and CNN.com led the way away from strong background graphics, switching to largely gray layouts where the content and accompanying images draw the most attention. (In relation to technology, this shift makes good sense; as download speeds have gotten better, large graphics specific to the stories are feasible. Using repeating background images for an entire site was an efficient way to add color and visual appeal in the early days of the web.)

Over the past year, more sites are incorporating JavaScript-based interactivity, such as scrolling panels and hovering windows, that don't take the visitor away from their starting point. These elements shift considerations in information design and layout away from discrete pages and toward user-friendly controls

This summer as I was working on a freelance book project that required updating screen captures of websites, I noticed another more subtle shift. Although only a year had passed, the featured sites had changed to make room for much more ad placement–-nearly every site had been reworked to show Google ads in multiple places on the page even if the rest of the design was the same.

Maybe the big lesson is that web site design, like fashion, is not timeless. Even sites that were the height of cool in their day might end of the web equivalent of a 1970s polyester leisure suit. It will be interesting to see what comes next.

Thursday, October 16, 2008

Designing a Fun Site

The goal of my current web project is to present a lot of information in a non-threatening way.

To avoid overwhelming people, I'm trying out some interactive page elements – slideshows that scroll sideways and, hopefully, sections that open and close vertically when clicked.

Here's a picture, but you can visit the draft version at http://telr.osu.edu/teachonline/tour.htm to try it.

The slideshow uses a language called JavaScript, which allows clicks on the screen to cause changes in what appears there. (To be more specific, I'm using some special JavaScript libraries called jQuery that includes prebuilt bits of code (also known as functions) to control different parts of the page in different situations.)

My goal with this design is to encourage people to click to the information that interests them and perhaps read other parts that are within easy reach. The less work it is to move through the content, the more likely our audience will be to learn what we're teaching.

I'll keep you posted as this site progresses.