freedom in structure
July, 2001.
By Molly E. Holzschlag. (Link to original article.)
We already know how to build good Web sites. Most of us have read a ton of books on usability, interface design, and Web design. By now, we all know the ingredients for a fantastic Web site: great-looking design, a user-friendly interface, a flawless infrastructure with back-end intelligence, and superior content. The one element that often goes unrecognized, though, is interactivity.
Without an interactive element, even sites that look beautiful and behave properly lack a certain vitality. The word interactive is used so often in Web design that its meaning has become vague and diluted. Unless you're fully involved day-to-day in creating interactive design, it's difficult to describe what interactive means.
How do we focus on interactivity and still let our imaginations play? I think it's a matter of knowing the medium from a theoretical standpoint as well as a practical one. We need to remember what the Web is, how it's structured, and what it was originally meant to do.
Interactive theory
The Web isn't a passive medium, unlike most other media. We watch TV. We listen to the radio. We flip through the pages of a magazine.
We can't really watch the Web. Obviously, we can call up a Web site and sit and stare at it, but not much will change on that site if we sit there eating popcorn. The Web requires more complex action, involving—at the very least—making a selection from a menu or list of links and then moving to the next site.
The Web allows something that more traditional media doesn't: user choice and action.
In contrast, various publishers have determined the form, feel, and experience of almost all of the information on TV, on radio, and in print. We have little control over what happens during a television or radio program. The things we can do are limited to interacting with the machine, not the content. We can turn up the volume, turn down the volume, change the program, or as some prefer, turn off the machine completely.
We can subscribe or unsubscribe to newspapers and magazines, choose the articles we want to read from the pool provided, or write letters to the editor about content. But these options are nothing when compared to what we can do on the Web. What's more, this is becoming increasingly clear through the growing popularity of blogs and file sharing—each of which is a highly interactive activity.
The cycle of interactivity
From a practical standpoint, the simplest definition of interactivity is that of something or someone acting on another thing or person. Yes, this is a vague concept, which is one of the reasons why the particulars of interactivity are often up for discussion and exploration.
Begin with linking, the most available example of interactivity on the Web. A link can be a line of text, a static graphic, or a fancy graphic with lots of visual dynamic, like an animation or JavaScript rollover. But even with a lot of visual hoopla, a link is essentially static, until we come along and decide "Hey! I want to experience what's beyond this link." So we point, and we click.
nce you click, you're instantly gratified (assuming, of course, that the Web site in question is functioning properly) with another page, illustration, form, or whatever it is you're interested in exploring.
eb interactivity, then, is the cycle of a Web site visitor making a choice, and the medium—in this case the underlying Web technology—responding to that choice. You click on a link and get another page. Do this again, and the cycle repeats: User choice leads to a response from the medium. It's a very gratifying process.
This interactivity puts power and control literally into the site visitor's hand in a way that TV and magazines don't. Interactivity is, therefore, a relationship. If we, as developers and designers, learn to combine interactivity with the strengths of cohesive visual design and well-developed technologies, we'll please our site visitors and ourselves.
Of course, linking isn't the be-all and end-all of interactivity. But it is the heart and soul of Web structure and design, which is a rather fascinating world in itself.
Understanding the web's structure
Knowledge of Web site structure is always important, and never more so than when you're dealing with large amounts of data. When you have multiple sections with hundreds or even thousands of documents to manage, and new documents being added regularly, understanding the Web's infrastructure becomes paramount.
With knowledge of the Web's structure, we gain control over the way documents are managed within that structure. And, with that understanding, we can plan not only how our site visitors will interact with our Web site, but also how back-end technology will work behind the scenes to make the process powerful and effective.
Of course, we're all aware that the Web wasn't originally intended to be a graphical medium. The idea was to create a fast way to connect text-based documents for easy access. For example, if a doctor publishes the findings of a medical research study with references, she or he could, in the pure hypertext environment, link those references directly to related studies. Although today's Web seems much different with its highly visual commercial sites, rich media, and online games—the essential structure hasn't changed. It's just less obvious to the untrained eye.
Interactive media has been called "new" media. It's this interactivity that separates it from familiar, static media like newspapers, magazines, books, radio, standard animation, video, and even film.
The Web quickly advanced beyond text and into graphics. As soon as graphic file formats were supported inline using graphical Web browsers, the text link became the graphical link. Nowadays, that link might have all kinds of options added to it via HTML, CSS, and JavaScript—not to mention what happens if it's connected to an application server and database. Interactive options are growing—and with them, our creative opportunities—but I'd like to emphasize again that the essential structure has remained the same.
Linearity and non
Be it text-based, graphic enhanced, or technologically dynamic, what hypermedia can do is pretty amazing. Not only can we present static information, but we can present it in varying degrees of linearity.
Some cultures think of time in terms of a linear structure: 12 p.m. is followed by 1 p.m., Monday by Tuesday, January by February, and so forth. These cultures often think of life on a timeline—beginning with birth and ending with death. This is linear perception.
It's interesting to note that this is not the way much of the world thinks. Many Native American tribes have been described as having a spiral view of life, and many Eastern philosophies relate to time as a circular event, with birth and death simultaneously representing a beginning and an ending.
Another example is the difference between hearing a prepared monologue and having a relaxed conversation. In a prepared monologue, the speaker is discussing an issue, followed by a subissue, and so on. He or she is speaking in one direction—to the audience.
In a natural, relaxed conversation, people talk about different topics, and tangential points move the conversation to new topics. You might begin discussing the movie you saw last night, and end up supporting a friend through his or her emotional challenges with an ill parent or relative. And, in conversations, people talk at different intervals, and sometimes even all at once.
The Web encapsulates all of these things. Its infrastructure is inherently nonlinear. You can be reading along, and suddenly there's a tangential link on a page. Follow that link, and you're reading about a different subject altogether. Follow a link on that page, and another, and another, and in less than a few minutes we can conceivably have experienced such seemingly disparate information as politics, health, religion, Web design, and romance.
Despite the Web's inherent nonlinear structure, we can impose linear designs upon it. We can have a completely linear presentation with one page following another, as with a book. Another linear form that's common in the West is the hierarchy—which is essentially levels of lines. On the Web, we can have linear structures with some nonlinearity, or we can have completely nonlinear sites.
Of course, a completely nonlinear experience is appropriate only in specific instances. One early experimental example was CoreWave's A Glass Bead Game, where clicking on a link took you to a random page. CoreWave's original Web-based game was an intellectual journey that used nonlinear pathways to link ideas. For example, following a link from the word "physical" might bring you to a page that discusses Hopi rituals. It's then up to you to think deeply about what spiritual rituals have to do with the physical. This is a compelling use of nonlinear structure.
If you're building a site for a conservative corporation, random links would confuse most visitors. It's an inappropriate approach in that context. If you've ever visited a site that has thoroughly confused you no matter what input you gave, you've experienced a designer's failure to create an interactive experience. Why? Because if you leave the site, you don't continue your interaction.
The level and satisfaction of interactivity may be initially determined by a site's designers, but it will ultimately be decided by site visitors. If a visitor gets caught in a loop with a Web site, it may become more frustrating than interesting. This can be particularly true of confusingly complex navigation systems.
Because most site visitors are accustomed to processing information linearly, Web sites that totally embrace nonlinearity can be very challenging. A good designer will balance linear and nonlinear options carefully.
Knowing that these structures are possible, you can work within them to create powerful and appropriate data. Is there an ideal way to go about this? Well, there are certainly choices , and I'm convinced that the only way to make the best choice is go back to that all-important determinant: your audience. If the audience wants flat information, a linear site is in order. If the audience wants a wild ride, lots of linking and randomization will give them just the thrill they're after.
So how can we combine elements in our designs? These three steps will help:
- Begin with a simple linear or hierarchical structure.
- Add logical links within the site, like navigation, references, and indexes (this moves us toward nonlinearity).
- Add links to external, but complementary, sites when appropriate, and when it won't distract from primary information. (Conceivably, these links can be used to achieve a nonlinear experience.) The best way I've found to do this is to draw it out on a big white board. First, I draw the site's essential components, then I begin looking at interesting ways the pages can relate to one another. Depending upon the goals of the site (corporate versus creative), I'll use more linearity, or less, to best guide site visitors.
Your turn!
Your challenge is to begin drawing out your ideas. Are you currently working on a site that's driving you crazy? Go outside and sit under a tree for a few minutes with a sketch pad. Draw out your main components—don't use words at first, just boxes representing the important pages or site areas. Then, think about ways of relating those components in unique as well as expected ways. You might find that you come up with amazing results and solve a problem in a truly creative way. For some, an exercise like this doesn't come very easily—and those are the people who will most benefit from this challenge. Think with both sides of your brain, and the result will be a more usable site.
