Tackling Usability Gotchas in Massive-scale Web site Redesigns – A Listing Aside

Enhancing usability is an efficient motivation for redesigns and was the driving pressure behind the ALA 3.0 redesign. However redesigns usually introduce new usability issues. On this article, I’ll focus on one such downside and the way in which we addressed it, specializing in the inventive dilemma and its resolution quite than on the technical implementation particulars. Chances are you’ll be redesigning a big or mid-sized content material website and restructuring it within the course of. In that case, you would possibly face the identical downside ALA did,  and the pondering that went into our resolution would possibly assist you craft your personal.

Article Continues Under

ALA was designed in 1998 and till lately was maintained by hand. Many journal, library, authorities, and training websites started life the identical approach and face comparable hurdles as they make the transition to standards-based design powered by database-driven publishing instruments.

ALA’s oldest articles existed throughout a number of pages of quirks-ridden, presentational markup. Its more moderen articles (2001–2003) lived in a CSS format powered by semantic XHTML and had been confined to a single web page. The CSS format aped the preliminary 1998 design and included its flaws in addition to its strengths.

A List Apart 1.0, circa 1999
ALA 1.0 circa 1998–99.

The design course of since 1998 had been iterative; as new options had been added or reader habits modified, refined mutations crept into the format from one situation to the following. Studying the journal in reverse order of publication date was like taking part in an archeological dig: you may watch the format regress to the Bronze Age. Though the oldest layouts possessed a naive allure, the location would work higher as soon as all articles shared a standard, up-to-date format powered by semantic markup and lean CSS format.

A List Apart 1.0, circa 1999
The identical website a couple of months (however many modifications) later.

Beneath the floor, ALA’s reliance on hand-maintenance slowed manufacturing and decreased the location’s usefulness,  as a result of an editor had to determine subject and creator relationships and manually replace applicable archive class pages every time a brand new article was revealed. A database pushed by subjects, authors, and dates would assist readers make connections and discover the content material they had been most desirous about whereas automating many editorial and manufacturing duties.

In August of 2003 I redesigned ALA, consciously breaking previous model associations and making extra reader-focused use of acquainted ALA conventions such because the right-hand sidebar, which had been with us since 1998. As he has accomplished for our firm’s shoppers, Brian Alvey then constructed a set of customized publishing instruments to ship the location and its RSS feeds. (The system can be able to producing PDFs, print, and newsletters, though we’ve got not carried out these options but.)

We dumbed-down the content material entry fields — or smartened them, relying in your standpoint — so authors can enter semantic XHTML as an alternative of WYSIWYG textual content, add article-specific scripts and types, and even hack the physique aspect for scripting functions. When an outdated article is reformatted, its markup is made semantic, its creator is added to the creator database, and the article could be discovered by its subject(s).

We additionally restructured our URLs, making them extra logical and therefore extra usable. In 1998, I had dumped our articles and tutorials right into a listing labeled “tales.” Again points and hand-coded class views additionally resided within the “tales” listing. It had made sense to me on the time, but it surely was not logical and it wanted to alter. A reader wouldn’t suppose to search for CSS articles at /tales/indexCSS.html. The extra logical place to look, and the place we now use, is /subjects/css/. Seamless redirects ensured that individuals following outdated hyperlinks would wind up in the proper place. However at this level, a couple of days previous to the delicate launch of ALA 3.0, we encountered a usability stumbling block.

A particular case#section4

Sustaining outdated URLs or seamlessly redirecting readers to new, improved URLs is important for any website, but it surely’s particularly essential for ALA. Go to any main search engine or listing and search on nearly any net design or improvement subject; A Listing Aside articles constantly present up within the high ten outcomes. Throughout the online, tens of 1000’s of hard-coded hyperlinks to ALA content material present us with a gentle stream of visitors. (Site visitors stays fixed even after we haven’t revealed something new for some time.) We respect these hyperlinks and that visitors. Furthermore, there are builders on the market who depend on bookmarked ALA articles with the intention to do their jobs. We had no intention of breaking our outdated URLs. But, halfway via the redesign, it seemed as if we would must.

The issue created by the answer#section5

In an ideal world, in the course of the few weeks between design, implementation, and launch, we might have reformatted our a whole lot of outdated articles and entered them into the system. In the true world, whereas redesigning and implementing, we had been in a position to reformat and systematize about 60 outdated articles. (The remainder at the moment are being reformatted by Tanya Rabourn and Andrew Kirpatrick.)

An excellent outdated rule of usability says you must by no means break a URL — and I’ve already defined why we agree. One other rule says you must use URLs which can be intuitive (i.e., /subjects/css/). It was a easy matter to redirect dangerous outdated subject URLs to good, new, intuitive ones. However how ought to we deal with outdated articles that had not but been reformatted?

Suppose you bookmarked David Eisenberg’s DOM Design Tips II when it resided at /tales/domtricks2/. No downside: the article has been reformatted and the system is aware of that its new location is /articles/domtricks2/. While you comply with an outdated hyperlink, the system queries its database and takes you to the reformatted model at its authorized URL.

Now suppose you bookmarked Concern of Type Sheets 4, a much-read (if outdated) piece that suggested utilizing pixels to spec kind sizes in CSS due to the maddening inconsistencies and bugs in then-dominant browsers corresponding to IE5/Win and Netscape 4. As this situation goes to press, Concern of Type Sheets 4 has not but been reformatted, therefore it doesn’t seem in ALA’s database. Ought to readers be prevented from discovering outdated articles? Certainly not. What’s a mom to do?

An interim web page for an interim interval#section6

Brian and I got here up with a two-pronged resolution:

  1. If an article has been reformatted, you’re seamlessly taken to its new URL.
  2. If an article has not  but been reformatted (if the system can’t discover it at /articles/), you’re taken to an interim web page from which, with one click on, you’ll be able to learn the outdated article in its unique format at a barely modified URL starting outdated.alistapart.com.

We selected the interim web page gadget to alert readers to the dated nature of the content material, to advise them that the URL would quickly change, and to allow them to know that sure outdated options would possibly not work. (For example, the dialogue discussion board related to a really outdated article won’t work.)

As soon as an outdated article like Concern of Type Sheets 4 has been reformatted and put into the system, that article and its readers will profit from the brand new system’s performance and value advantages. Till then, the content material stays accessible and the URL has not damaged.

Different strategies: not as good#section7

I’ve seen this downside dealt with one other approach at different largish websites: particularly, the URL disappears and the reader is informed “We’ve moved some issues round. Please go to our archived website [or please use Search] to see if the content material is accessible someplace or different.”

That technique is assured to frustrate readers. It may additionally anger the authors of the content material that “moved round,” who could also be linking to the lacking materials from their on-line resumes.

As dangerous as that’s, it’s higher than what occurs at different biggish content material websites, the place outdated content material is moved with no redirect, or may even be taken offline with out clarification.

Our technique beat the pants off these approaches, but it surely was imperfect for 72 hours.

Taking exception#section8

ALA 3.0 was a “delicate” launch in that we introduced it whereas the world’s Area Identify Servers had been nonetheless making the transition between our outdated and new DNS info. We had been in a position to soft-launch due to the kindness of Bruce Livingstone of Webcore Labs, who had hosted ALA from 2000 via most of 2003, and who briefly modified his DNS info to level to our new server. Till the DNS modifications completed making their approach via the community, a course of that may take as much as 72 hours, our subdomain-based interim resolution didn’t work. Inside 72 hours, the DNS completed rolling over and the issue solved itself.

Designing usability, daring to do much less#section9

Usability is like love. You need to care, you must hear, and you must be keen to alter. You’ll make errors alongside the way in which, however that’s the place development and forgiveness are available.

The usability downside mentioned on this article was one in every of many we addressed or are within the strategy of resolving. Within the life cycle of most giant tasks there comes a degree the place you must downsize your expectations, prioritizing deliverables with the intention to launch on time. Assume 80/20 rule. Assume “dare to do much less.” If producing 100% of your required options will delay your launch by six months, possibly you have to cut back, construct what you’ll be able to, take the location dwell, after which proceed to enhance it within the months forward. That’s what we’re doing with ALA.

When ALA 3.0 premiered with situation 160, some readers requested, the place was our search engine? The reply is, it’s coming quickly. We had been unwilling to launch till we had solved the bookmark usability situation mentioned on this article. But when implementing Search would delay the launch by months, it made extra sense to launch sans Search (and add Search later).


ALA is extra user-focused than earlier than, however we nonetheless have a methods to go. That’s the iterative nature of interactive media, and it additionally the thriller of life itself.

Leave a Comment