thoughtcrumbs

Web teamwork: IA and CSS

One of the sessions I most enjoyed at WebVisions detailed a pretty clever technique for getting Information Architects, Graphic Designers, and Web Developers to communicate using the same vocabulary through the entire design process. In a typical multi-person web team, IAs plan the site's structure based on user studies. Then they deliver a wireframe to the designers who add the look and feel, and the designers hand it off to the developers to implement. However, while IAs should be focusing on strict content hierarchy (not presentation), most wireframes consist of page mockups: navigation goes here . . . and the welcome message here . . . and the news headlines here. The designer, who should be making those placement decisions, is reduced to coloring in the lines. Meanwhile, the developer is twiddling her thumbs because she can't start until the first two people have finished.

Christina Wodtke and Nate Koechley instead propose that the IA deliver a hierarchy document marked up in semantic HTML and CSS. Instead of a visual mockup, the document would show which content was most important (i.e., H1, H2), which elements were reusable (i.e., .featuredHeadline or .detailedPhoto), and what were unique (#studentServices, #facultyServices). Then, the graphic designer can determine the visual layout and the developer can begin the backend programming concurrently. Everyone uses the same set of labels, meaning isn't lost, and it's all hugs and puppies.

Hearing Christina and Nate describe the confusion generated by the current task-flow in web teams, I'm grateful that I work in a small institution, where I wear all three hats. I think in CSS classes and graphic techniques while analyzing card sorts. But I could be clearer in separating the three phases; my biggest problem is jumping too quickly to design or development without considering the architecture thoroughly. I'd love to spend some time at a larger company, dedicating my attention to just one of these three roles. But that's for another day; I have a card-sort to run and a form to build.