When the first DHTML toolbar was used on Webmonkey, part of its purpose was simply to say "LOOK MA! We've got DHTML!" While the old toolbar did help solve some of the constant design problems — such as getting as much content
"above the fold" as possible — the bar was really created as a way to showcase a then-new technology and demonstrate how it could be used in a practical way. DHTML could animate elements, put layers of content on top of each other, and it could respond to user input.
Years later, Webmonkey redesigned the site, and one of the big changes was our toolbar. After years of working with DHTML, we had gathered plenty of experience and expertise, not to
mention plain old coding know-how, so we decided to use that knowledge to change the
toolbar's look and behavior. The Webmonkey designers wanted to create a
toolbar that was more functional, less obvious, and easier for our audience
to understand. Our goals were no longer to show off what DHTML could do
or prove that we could do it. DHTML had been around for awhile and
most Monkeys out there already knew what it could do.
This was about the time that the usability doctrine was starting to take
root on the Web. People were less interested in gee-whiz tricks and were way more into making sites that were easier to understand than
before. Also, Webmonkey had grown considerably in the years since the last
redesign, and we had more content collections than we had room for on the
homepage. If we were to display every collection title, the list would be so
long that the sponsors' links would be pushed off the top of the page and
below the lower boundary of the browser window. And if you've
worked on a site where the main source of revenue is advertising dollars, you know
that's unacceptable. To reflect these changes, Webmonkey went with an interface metaphor that almost all operating systems use to show a hierarchy of
information, the browsable menu that can be expanded or hidden
selectively. It's the perfect choice — familiar,
easy to use, and compact.
And we built it using DHTML. As much as gee-whiz interfaces are called old hat —
not to mention scorned by usability experts, derided by HTML purists, and
considered the bane of online art gallery enthusiasts around the world — there is a
case to be made for having a cool interface toy on your homepage. For
Webmonkey, it's a tradition. Longtime readers will remember the Jimg java-powered wrench that used to be on our front door (click*click*click). Compared to that hulk, this new toolbar was almost prosaic. Even with all the unusable interfaces that we've had to suffer through, there is something special about dynamic interfaces: They're fun. Never
forsake the power of the toy — just make sure the audience can understand how
to use it.
In the pages that follow, you'll learn how we did it. So gather 'round for another Webmonkey campfire story, this time about the cross-platform, W3C-compliant, easy-to-use DHTML toolbar.
next page»
