Google has updated its interface for their Docs & Spreadsheets application. Besides the visual improvements, they’ve also “replaced” tags with folders, and added a “Google Suggest” function to the search box, that finds matches as you type. (Neat!)

While some may consider the move from tags back to folders a step backwards, the change is really superficial - under the hood, it’s still the same old tagging system. The only difference is how most users will interpret it.

The old ways

As TechCrunch indicates, there are still many people who prefer the traditional folder model over the tagging model. Tagging is a more recent phenomenon, made popular by sites like Del.icio.us at the growing crowd of “Web 2.0″ sites. Most people are familiar with folders for organization, since it’s a feature the user would have gotten used to in using a computer’s file system. Even though tags, (or “labels”, as Google calls them) are preferred by some, including myself, clearly Google has had research indicate to them that folders would work well for more people.

However, the change to folders wasn’t really a total overhaul - as you can tell from this quote from their announcement:

Even cooler, our new folders continue to work like the tags they’ve replaced - your old tags are automatically converted to folders and documents can live in more than one folder at a time.

This is confirmed by using the new Docs & Spreadsheets - though the icons look like folders, they can be made to behave like tags. They’ve tried to make some aspects like traditional folders; for example, when you’re in folder view and you drag a file to another folder, it is “moved” to that new folder - but what’s really happened is that the first folder/tag is dropped, and replaced by the new one. (In the “All Items” view, dragging an item to a folder merely adds the item to the new folder, without removing it from other folders it was in - just like tagging)

Folders in the application do not operate in the traditional sense, since you cannot create sub-folders, at least not at present. (I got a “server error” when trying to move a folder into another one) This betrays the true nature of the folders - they’re just tags in folder’s clothing. The interface has merely been re-designed to promote a folder-centric view of tags.

This isn’t something I’m against, as since I’ve indicated I prefer tags over folders. In fact, I think that this is a good move for Google, since they can accommodate both types of users - those who prefer the old folder organization, and those who prefer organization by tags. The present system gives a good illusion of folders (albeit without sub-folder support), but can easily be made to work as a tagging system. Some have also speculated that this change could be a harbinger of things to come for Gmail. Perhaps they’re rolling out this system to see how it does with the smaller Docs & Spreadsheets crowd before moving it into big-time action with the Gmail userbase.

Pretty sights

The visual side of the interface has also been given a facelift. With this, it looks and operates more like a traditional desktop application. This contrast with Google’s approach to Gmail, and resembles more Yahoo!’s approach to their mail client. Could this be another indication of Google wanting to make interface changes to Gmail, perhaps making it more like a desktop mail client in order to compete with Yahoo! Mail better? They’ve certainly done a good job with Docs & Spreadsheets, as the interface is pretty but not overdone. Furthermore, the “Back” button functionality is not broken and drag & drop works like a charm

One improvement they could make would be taken from Gmail’s interface - allow adding of items to folders/tags on-the-fly, without having to create the folder beforehand.

Security and Privacy concerns

Docs & Spreadsheets is undoubtedly very useful for collaboration across distances, or really for any project work in general. The prospect of no longer having to physically bring files between computers using sneakernet is a compelling enough reason, and I believe most people, especially students, would use this service, so as long as they knew about it. (I still think Google has to get out more knowledge of this service)

However, I’m less excited about this service when it comes to business use. So far, companies have been reluctant to store sensitive information with third parties, and for good reason - you may just never know who has access to your data, and furthermore, the risks of data loss may not be known. For personal use, these concerns also have merit. For businesses, something like Google Apps Premier Edition, a paid service with guarantees, would probably be better. Some of their services may even allow you to host the data behind your firewall.

A competitor to Microsoft Office?

While Google Docs is a great tool, I hardly think it’s a competitor to Microsoft Office. The two are really in separate markets. So far, online word processors can’t match the functionality of desktop ones, but are still good for a lot of what you’d need to do with documents. A closer competitor to Google Docs would probably be Microsoft’s Office Live, another suite of online tools. This service also has free and paid subscriptions. The service still has some way to go before it can be considered a serious contender in the office/work productivity arena, that is, if Google ever intends it to be.

CBC.ca has recently redesigned their front page, just about a year after they underwent a major redesign, incorporating a mostly standards-based approach. While there doesn’t seem to be a big change, they’ve made a few small changes to direct their readers’ focus to different areas. For example, three big blocks in a horizontal row (with accompanying images) now direct users to the top stories in news, sports and arts & entertainment. Even more attention is drawn to the big header at the top of the page, that is used to focus users’ attention to the CBC’s traditional media offerings on TV and radio, headlining what major shows will be airing that day. One might wonder why the CBC is attempting to push people back to traditional media when online media is all the rage nowadays.

While I find the new design to be refreshing and more visually attractive, there are some deficits with it.

First, the good

The changes to the front page, as mentioned, haven’t been that big, and while some may think this is lazy, it’s actually a good idea when you have a huge and varied user base. People like familiarity (see the Active User Paradox), and a huge change would likely disrupt them for long enough to see a drop off in readership. By making small incremental changes, you can get a wide and varied user base to accept your new layout slowly over time.

One of the other nice things they added was the weather display at the top of the page, since “weather” was consistently a top search at the CBC.ca site. Rather than force a user to pick their city, the weather panel automatically finds your current city based on a geo-IP address lookup. (This I assume) You can, of course, manually select a city if you want, or if the process can’t find your city. This same process is used to display Local News (if available), but this is at the bottom of the page after most of the stuff on the front page.

Navigating to the News Page, (one of the four new main links - News, Sports, Radio and TV), you’ll find a page that looks curiously like the old CBC.ca front page. If you miss the old front page, you’ll just want to visit this page instead of the new one. Here, a single headline story is emphasized, followed by “Top Stories”, three more headliners, and then a bunch of sections. New to this page is the addition of a tab for “Most Blogged” stories. This feature uses Technorati to find incoming links to CBC.ca stories to find out how popular a particular story is. There’s also a side panel linking to the blogs of CBC journalists, so you can keep up to date with what they’re doing. Kudos to the CBC for acknowledging the importance that blogs play in online news, however, this can obviously be a double-edged sword, as stories like “Hasselhoff gets sole custody of teen daughters” will get top spot. (Who cares? Just because he was a Wendy’s spokesman?)

Lastly, they moved non-news stuff like the “Diversions” and games section down to the bottom, leaving only news-related items near the top of the page. In my opinion this was a good thing, since if you go to a news site, you should be wanting to find news. However, games-related searches currently occupy three of the top 10 searches on the CBC.ca site, so maybe I’m not in agreement with the masses on this one.

The Bad

Strangely, most of the rest of the site hasn’t been updated to the new layout. Individual stories such as this one remain under the old layout, potentially confusing users who generally don’t having to switch back and forth between layouts, especially on the same site. Perhaps they’ll slowly roll-over the stories to the new layout, but keeping two layouts simultaneously definitely is not a good thing. So far, only the major pages such as News, Sports and Radio/TV have been updated to the new layout, as far as I can tell.

The main navigation bar, containing “News”, “Sports”, “Radio” and “TV” as options is also a bit weird. Firstly, it’s location is a bit out of place - it’s slightly offset into the main header of the page, and while this isn’t bad per se, it just doesn’t fit in with the flow of the rest of the site, which doesn’t use this technique. For that reason, it looks tacked on - like a band-aid on the scrape of a child’s knee. The choice of options is also a bit perplexing. Firstly, including TV and Radio, in addition to the main page header being a conduit for TV/Radio listings, one has to wonder if CBC.ca is really committed to online news, or is merely being a cheerleader for their traditional media offerings. And, while “Sports” was an obvious option for a main header, what happened to Business/Finance? It’s apparently been relegated to a small text link hidden somewhere in the front page.

And, while on the news portal page, news is up-front and center, on the main front page, a good portion is taken up by the header pointing you towards TV/Radio. In fact, if you know about the Golden F in usability, you’ll realize that most people will only really look at this part of the page, and won’t see much of the news.

Perhaps this was intended - CBC.ca has to be more than just news, and has to cover all aspects of the broadcasting corporation, with TV and radio being their staple. Sort of like the difference between ABC.com and ABCNews.com. However, the old site didn’t make this distinction, and seemed to work well for most people. Hopefully people will get used to this separation in the future.

The Ugly

Of course, what I say doesn’t matter too much. (Though I like to think that it does) What really matters is what the overall readership base thinks, and CBC knows this, so that’s why they crafted a letter to their audience requesting feedback. In it, Steve Billinger, Executive Director at CBC, says:

We’re listening to you; we know you’re looking for these technological innovations—and it’s our job at CBC to give them to you. The digital media landscape is constantly evolving, with new innovations being developed every day—and Canadians expect us to be ahead of the curve. This is why millions of you come to CBC.ca every day for the latest in news, arts, entertainment and sports.

We’ve already launched our News and Sports portals, with Entertainment and other sites to follow later this summer. Enjoy, and thanks for visiting.

Okay, so maybe we will get more options other than just News/Sports/TV/Radio in the main navigation. But I still don’t get why they’re trying to divert so many people back to TV when they’re talking about the digital media landscape at the same time.

But what do the people think? An informal survey of their comments to the CBC regarding the new design shows that maybe 1/3rd to 1/2 of the people posted negative reviews of the new design. Keep in mind, this was an informal poll - the only people that wanted to say something were part of it. Generally speaking, people with negative opinions tend to voice them louder than those with neutral or good ones.

Complicated!?! How?

Now, I know what some of you may be thinking - just how can using a mouse be complicated?. Well, it’s not that it’s compliated per se, but rather that the patterns of usage associated with the mouse take time to learn before they become instinctive. I can’t really remember the first time I used a mouse, (it was many years ago, and I have since filled and emptied my brain many times), but I suspect that I didn’t “get it” right away.

Take the example of the single-click vs. the double-click when performing actions in an operating system, such as Windows XP, for example. Even if you don’t have problems with fine-motor-skill and control, you still have to learn when to use what - and by learn, I mean to have the distinction ingrained in your mind so that you don’t have to consciously think about it when you want to perform some action that requires a single or double-click.

Will that be a single or a double?

The distinction between a single and double-click for actions may seem arbitrary, and, sometimes it is, and sometimes they can even perform a similar action, in different contexts. If you stop to think about it, there really are quite a few rules about clicking that can only really be learnt through time spent using a computer.

Usually, the double-click is used for opening things that are represented by icons, at least when they’re on your desktop or in a folder. This is to distinguish between the single-click action on these items, which selects them. This is a pretty easy difference to understand. For menus, the double-click usually has no meaning - a single-click opens the item. In this case, there’s no need to select anything, usually, so there’s no need for a separate double-click action to separate selecting from opening.

For text, a single click places the cursor at the location, while a double click can serve to select the entire word. Notice that here a double-click is the action that performs the selection function, and though this is the logical way of setting things up, it’s all part of a set of subtle nuances of mouse use that take time to learn.

Context

But, where things get complicated is on a medium such as the web, where the context is a blend of the two basic situations described above. As mentioned before, with icons, a double-click performs the open or “browse to this folder” action. However, on the web, almost all actions are performed with the single-click. To follow a hyperlink, the link is single-clicked, not double-clicked, following the guidelines of a text document rather than those of a icon-environment or context. (This also makes selecting hyperlinked text more difficult)

At first, this makes sense, since most of the documents on the web consist mainly of text. But, what happens now if the link consists not of text but an image, rather like an icon? The action remains the same, but the look has changed, almost to that of an icon - thankfully, most web-browsers change the look of the pointer when it’s over a link to remind the user that it’s a link, and hopefully, they will be adjusted enough to use a single click for all links and not be confused.

But where things get really tricky and confusing is in modern “web applications”, which are just websites heavily enhanced with JavaScript (or other client-side technologies) so that the experience of using the website is closer to that of a desktop application than a regular website. Some of these applications have really tried to emulate not only the functionality, but also the look and feel of desktop applications, resulting in some usability issues with clicking.

Take this comment by about the new Yahoo! Photos site; the user laments about the interface requiring a double-click to open a full-size image rather than just a traditional single-click as on most other websites. (The double-click detection is done via JavaScript)

I’ll admit that while I was first confused by this action, I thought little of that user’s comment - I mean, how hard can it be to learn a simple action like that? But, after some more thinking, I’ve come to agree with the comment - breaking the pattern of how a user navigates on a website is not a good idea, even if it’s done to try to make your website feel more like a desktop application.

Change is not always good

As long as the user realizes they’re on a website, they’ll continue to use it like one, with single-clicks performing actions. If you’re designing a web-application, you need to realize this, and shouldn’t break this functionality to try to “trick” your user into believing they’re using a desktop application. Even if you provide many warnings and notices, they’ll still be slowed down by this change if they don’t continually use your site - and you always want to keep the learning curve as flat as possible. And, let’s face it - while making interactive web applications is cool and I’m all for it, most people (e.g., mainstream) don’t really care and just want something that’s easy to use.

If you’re a web designer, you may be disenchanted everytime you visit a poorly-designed or poorly-structured site. Why do these still persist, despite proper techniques of content/presentation separation having been around since 2001? Has the whole world gone mad? Fortunately no - but it is a complex problem.

The problem of poorly designed websites, in my opinion, can be traced to two important factors, both of which can be assigned varying degrees of “blame”, depending on your viewpoint. There are tons of complicating factors, but I believe these to be the two most important.

Firstly, HTML (the precursor to XHTML), was designed as a document markup language (hence the name), completely devoid or separate of presentation information. Since the earliest users of the web were mostly from academic circles, it’s no surprise that much of the markup in HTML applies to formatting things like scientific journal papers, which typically make extensive use of headings, lists, and other semantic elements. The complete lack of presentation styles in the first version of HTML might seem like a good thing nowadays to web designers “in the know”, but unfortunately, most people don’t think that way. This resulted in later version of HTML adding presentational elements such as font, and even browsers implementing their own non-standard elements, all due to user-demand for control of presentation. Much of these elements have now been depreciated or eliminated, but they still remain in use - it’s hard to close the door once it’s been opened.

The problem lies in the interpretation of what exactly is content, and what is presentation. Content exists for the purpose of communicating information or a concept; presentation defines how that content should be shown. However, most non-technical people tend to blur the line between the two - for most people, presentation is part of the communication process. This is an equally valid point-of-view, and is in fact, probably the normal way to view things - human beings are visual creatures.

It takes a different sort of person to consciously think “This part of the document should be marked up with a list because it depicts a series of objects with some sort of logical relation among them”. Most people simply read the list as-is, but subconsciously, they are probably making the same connection. I think this has to do with the person’s MBTI, (and obviously their areas of education), but that’s another topic altogether.

The second factor deals with the unusually low-barrier to entry for making a website. HTML, quoted as the lingua franca of the web, is a fairly easy language to learn, as far as learning topics in computer science go. A grade school kid who can read at a decent level can easily learn the basics and begin coding the basics of a web page almost immediately. This is enhanced by the availability of many WYSIWYG HTML editors that make creating web pages as easy as using Microsoft Word or PowerPoint. However, while HTML is easy to learn, like many other things it is hard to truly master, especially when using it properly with a combination of CSS and JavaScript. This creates the situation where “a little knowledge is a dangerous thing“.

While it’s easy to make a web page, it’s also easy to flaunt disregard for web-standards, accessibility and usuability, all in the name of making a page that looks “nifty” or “cool”. This is perhaps best seen in the unending multitude of MySpace pages, where users are given control to customize almost any part of their page. This has resulted in pages that are either poorly designed, hard to use, do annoying things like play music, or a combination of the above, creating a haven that is a throwback to the Geocities of the 1990’s. The problem is compounded by problems with proper implementation of best-practices as well as the fundamentally different ways design must be done on the web as opposed to other forms of media such as print.

In reality, HTML is a language that demands almost the same level of attention to detail as a programming language. However, since programming languages are harder to learn, they present a greater barrier to entry that keep out those not willing to learn things the right way. (If you make a syntax mistake, the program will probably not compile or run - however some would argue that there’s still a lot of problems related to poor programming practices as well.) Some people would like these strict rules to apply to XHTML as well - in fact they do, if XHTML is served as XML, which it was intended to be. This has created a very stratified community of “website designers”, best summed up in Roger Johansson’s article on Levels of HTML knowledge.

Furthermore, good structural HTML is important if you care about Google or any other search engine indexing your site properly. The Googlebot (their spider that crawls the web, searching for new content to add to their search index) will have the easiest time indexing your site if you’ve properly separated content from presentation, and used meaningful (X)HTML elements to markup your content. Many people do not understand this - they either don’t understand or have the false view that search engines view websites in the same way that people do, through a browser. Additionally, if you care at all about accessibility, you must follow web-standards, which are conducive to designing a website that is accessible by anyone with disabilities.

I don’t draconian parsing rules are the solution, as for something to be the lingua franca of the web, it must be accessible to use by all. Easy to use, standards-compliant XHTML editors are what is needed, but I acknowledge that the problem is difficult. Thankfully, things are improving - despite the presence of sites like MySpace, the increasing popularity of blogs has given another outlet for people to create personal websites. Most of these blogging platforms are relatively standards-compliant, and in line with the spirit of web standards as well, and in many ways have been at the forefront of promoting good website design. Let’s hope more sites follow suit.

Why and what’s it for?

A lot of people might wonder what all this talk about “validation” and “standards” is even about. This is a valid question - after all, many people place website design in the same realm as making a powerpoint presentation or even a word document - and there are no standards or validation to worry about for those documents, so why should there be any for webpages?

Well, in this case it’s important to understand the differences. In a certain sense, Word and PowerPoint documents must also “validate”. If you were to open a Word document in Notepad, change a few random characters, it probably would look all messed up when you opened it back up in Word. This is because Word would not be able to parse or “understand” the changed or “invalid” data since it wouldn’t be in a form that it expected.

The same goes for (X)HTML documents, except sometimes it’s not as noticeable. Browsers have been coded, for the most part, to work around invalid markup to some extent, due to years of improperly coded and invalid sites dominating the web. However, as Tantek points out, improperly-formatted documents screw up the DOM (Document Object Model), so when it comes time to add JavaScript to your site, things may start acting weird. It’s best to clean up your act now - if you code by hand, you need to be aware of the rules you need to follow for validation. For other people, unfortunately, there are still many WYSIWYG editors that spew out ugly code. Dreamweaver may be a good choice in this sector.

The official validator does a pretty good job of diagnosing errors and giving warnings, though Tantek’s entry gives a better explanation of some of the more common errors that remain unfixed during the validation process.

Of course, if you’re using a blogging tool like WordPress, much of this work of validation is taken care for you. You just need to be sure that you don’t use invalid markup in your posts - something that may seem annoying to non-techies, but there are times when rules should be followed.

Proper separation of presentation and content

This is perhaps the most preached concept in proper web design, as you can find articles about the subject going back at least a few years. For those used to the “old ways”, this is perhaps the first thing you should know after validation. In fact, you pretty much need to have to the two. It’s entirely possible to have a valid webpage that uses tables for layout/design, but this would violate the proper use of tables. Tables are a semantic element (which means they carry meaning and assign a certain meaning to the information they contain), so using them for layout is an incorrect practice, though it’ll pass the validation test.

This is an important difference to note. Validation tests for document well-formedness, that is, can the data be properly interpreted by a client that only follows the outlined (X)HTML parsing standards. Use of tables for a layout is a design decision that is separate from this; however, the two bad practices of invalid markup and table design often go together. If you’re looking for a good guide to dropping tables, check out Stop Design, and get your site out of the 90’s.

Tantek also gives a nice tip on CSS class names - the use of context. I’ll be the first to admit that I’m probably the worst offender. I use class names like postDate and postMetadataTag when an element with a class of date within an element of class post is the better and more succinct way to do it.

Serving up standards

In short, while following all these guidelines may seem a bit daunting for the new or occassional web designer, it’s worth it to follow these rules as it’ll make your site easier to maintain, and make the XHTML format more viable in the long run. Adhering to an open data standard will make the web easier to use, search and update.

However, this design constraint also imposes some problems on people with higher resolution screens who want the website to use more of the available space. (I personally run at 1280×1024, but prefer the smaller, fixed width as easier to read due to the smaller line lengths.) Well, taking a cue from some websites out there, I decided to implement a style sheet switcher that would allow users to pick which format they wanted. It’s now available - see that icon in the upper right corner that looks like this?

Simply click on it to toggle between a fixed a fluid-width layout, and view this site how you like it. At this time, I have no plans to add other different styles, as in my mind a simple switcher like this is all that’s needed. And, I don’t really feel like a re-design at this time; I think this current design is good at least for a few more months. (On a somewhat unrelated note, I’m currently working on a WordPress theme for public release though, stay tuned for more details.)

How’s it work?

The script I used was an older one, written by Paul Sowden for A List Apart. It’s almost five years old, but still works great with a few slight changes. What’s cool about it is that it saves your selected style in a cookie, so upon return, the website will know which format you prefer. So, while Firefox users have always had the ability to switch style sheets, this script adds to that by saving the user’s selection for future reference. The script also works fairly well across browsers; I’ve tested it in the latest versions of Firefox, IE and Opera.

I’ve also made it so that the script downgrades well - if for some reason, JavaScript is not enabled on a user’s browser, the style switcher icon will not be present. They will still be able to switch styles if their browser provides this functionality, though.

One hitch I ran into was with the use of this script with the IE7 fixes library by Dean Edwards. Using IE6, the style switcher doesn’t quite work; when clicked, the styles do not toggle, but the settings are saved via cookies. Thus, a reload of the page is needed to see the effect - not exactly ideal, and it makes it look completely broken. So, for the time being, I’ve disabled the IE7 fixes, and so far, nothing seems to be whacky with the layout of the site when viewed in IE6. (Dropping the IE7 scripts also will save about 24 KB in bandwidth per page viewed in IE as well.) There are other javascript style sheet switchers out there, so I may give them a try to see if they’re compatible, or if I have even more time, try to write my own. But the “problem” might be with the IE7 fixes.

Not that I mean to putdown the IE7 fixes - they’ve been a great asset at times when I’ve been too frustrated to figure out why IE was borking on some piece of CSS. I highly recommend IE7 if you’ve been pulling your hair out over some layout problem. I haven’t yet had a “real” problem with it, but as always, I try to use this sorts of fixes as a last resort - let’s see how long I can hold out for, and let me know if you notice any layout problems.

I’ve always shyed away from graphic design, mostly because I found it tricky to learn, and just didn’t bother to put forth the effort. As a result, I think my web design has suffered, since almost anything I come up with is noticeable devoid of any complex, good-looking graphics. Well, I’ve decided enough is enough, and am really trying to learn (at least the basics, whatever that means) with Adobe Illustrator. While there may be better programs out there for learning, Adobe products seem to be the de facto standard out there, so starting from scratch, it seems like a good way to go.

So far, I’ve just been searching the web for resources, and haven’t bought a book. I don’t tend to buy computer-related books, (unless it’s a useful reference), as things tend to get out of date fast and render your purchase, at the very least, less accurate. While stuff on the Internet might be less of a complete course than a book, it’s good for getting started and seeing whether I’ll be able to keep up interest. A quick google search for “adobe illustrator tutorials” turned up this set of tutorials, which are going to serve as my starting point. While they are easy, and I’m sure all the Illustrator gurus out there are laughing at their simplicity, that’s the whole point for me - to find something easy to learn that can pique my interest for self-learning.

Hopefully, this will turn out better than that time I tried to learn to play guitar.

Guilt by association

I’ll admit I’m as guilty as the next technocrat for promoting the “web 2.0″ term and how it’s going to revolutionize and change the web as we know it. But, it dawned on me the other day that perhaps it’s not all that it’s cut out to be. Sometimes, being enveloped in the “wow” factor of new technologies and what they could potentially be used for, causes one to put their head in the clouds, so to speak, for far too long to be in touch with reality.

For a while, I, like many, thought that other people just didn’t get it, and that soon enough, they would see what web 2.0 really meant and appreciate its benefits. I mean, for the tech-saavy individual it’s easy to see what benefits things like Ajax or a well-designed, standards-compliant website could offer; if nothing, they’re “cool” and have a nice “wow” factor.

From a technical point of view, these things are true. Just like gearheads who will stand around an autoshop marvelling at what’s under the hood of a nice auto that they just retrofitted, these technologies do have merit. But, what do they mean for the average user? More and more, I’m starting to believe the answer to be, “not much”. This isn’t a deficiency with the “average user”; to say so would be a gross generalization, and after all, this “average user” is your main customer.

Digg’ing a divide

A good example is digg. Launched late in 2004, the community-oriented news portal site offers the unique editorial system of user-submitted news. Anyone can submit a link to a news story, which can then be “dugg”, or voted up, by other users. Stories with a lot of diggs reach the front page, where they can be seen by more people. (This also creates a sort of “mob rule” effect, but that topic is for another day.) Digg has been quite a success, with currently over 400 000 registered users, myself included.

Digg is also the quintessential web 2.0 site - not only does it feature a strong, community-oriented website with content that users determine, but it also has many web 2.0 design features, such as nice design/layout, and many Ajax-enhanced functions, such as when you digg a story. The site has also spawned a new term, “the digg effect”, when a website featured in a popular news story becomes slow or unusable because of the mass of traffic directed to it from digg.

Though digg is quite popular, it is also quite a niche website, which may be somewhat of a small surprise. According to some statistics, 52% of digg users are “IT professionals, developers or engineers”, and furthermore, “39% publish their own blog”. These are definitely the people who are proponents of web 2.0 and the like, since the blogosphere has been quite successful in driving innovation in web technologies.

Additionally, traditional online news outlets like the New York Times, are still way ahead of digg in terms of web traffic, according to some reports. All of this leads me to believe that the vast majority of web users don’t care, or don’t know, about sites like digg, which are almost universally praised among tech-saavy circles.

It’s all in the design

Another thing that got me thinking was the generally-accepted idea that if you want to make a popular website, you need to have a good design and also offer all sorts of fancy features. This doesn’t appear to be so, as indicated by the popularity of sites like MySpace.

I think this belief arose for a few reasons. Firstly, many of us have spent hours creating a design that looked great to us; after all this work, it would be hard to believe that other people could not find an attractive design a good reason to keep visiting a website. Secondly, many of the websites that catch our attention and are popular, are also well-designed. Those that weren’t well-designed, we didn’t bother to return to, since they didn’t appeal to our niche. However, these are the sites that may have more broad appeal, and hence remain popular despite their horrible design.

Niche is still good

Which brings me to my final point - while it’s cool to have a well-designed site that features all sorts of nify web technologies, do not fall into the trap of believing that this alone will make it popular. Don’t fall into the trap of believing that web 2.0 will soon become known and praised by all, because it probably won’t. And, don’t be completely dumbfounded about why the general public can’t understand why web 2.0 is all-that-and-more; they’re not stupid, it’s just that it is still quite a niche topic, and is just fine the way it is.

This is why when my university, Queen’s, decided to try out a CMS, it piqued my interest. I read about the progression of this, from the time they had to get input from various sources to when they had to define criteria that a CMS would have to meet in order to be selected. While these are baby steps, in relative terms, it’s a trip to the moon, since what they had before must have been a horrendous mess to keep up to date and to maintain.

There still is a lot of work to be done, however. The vast majority of the pages that form the Queen’s website still lack a common “look & feel”, which I believe is important for an institution. While organizing everything under a common CMS would take much effort because of the training that all staff would require to adjust to such a new system, (not to mention the adjustment the webmasters of each department would need), I think it is a necessary step in the overall evolution and update of the website.

As an example, Queen’s can look at the University of Waterloo’s website, inter-university rivalries notwithstanding. They clearly have a defined look & feel, and have a nice web development blog that seems to be in tune with current web standards, technologies, and practices. (As evidence, look at their standards-based design for their sites.) Most of their departmental and faculty websites also share the same styles, and standards-based designs, at least on their front-pages, as I’m sure there are a few static back-pages that haven’t been integrated into their system.

With more and more universities making the switch to a CMS for easier management, the upcoming changes for Queen’s could not have come at a better time. I only hope that this pilot project does not get stalled or otherwise delayed; ideally, I’d like to see site-wide changes before I graduate next year.

For most people, this change will amount to the new layout and styles applied to the website. This amounts to a greater focus on today’s “Top Story”, as well as special features such as their kids section and online radio. Online feature stories were also given greater precendence over mere headlines, which were moved below into neatly organized panels - an overall greater focus on in-depth online articles, rather than just everyday news headlines. The new design definitely looks “more busy”, but not cluttered, in my opinion.

It’s also interesting to note that the design folks at CBC took a lot of user input into account when doing the redesign.

We embarked on the redesign process about 15 months ago, starting with a massive study conducted for us by Decima Research. The survey asked your opinions about dozens of elements of CBC.ca’s design, information architecture and content – and, over just a few days, more than 5,000 of you filled it out for us.

The results of that survey, combined with the feedback we get daily through e-mails, phone calls and our online forms, formed the basis of this redesign. Our goal was to improve the site for you, by making it easier to use and giving you more of the features you’d like to see.

Overall, the site looks a lot more user-friendly, and definitely in step with “modern-looking” sites. RSS feeds have also been added, something that was in dire need, especially on a news-oriented website. The site may end up looking a lot like other news sites (CNN.com comes to mind), and while this may be criticized as a lack of creativity, sometimes congruence is helpful when browsing, to better give the sense that this is a news site, and not something else.

But of most interest to me was the transit to a standards-based, semantic website that properly separated content from style. Upon a quick first inspection, the site appears to make good use of proper XHTML elements, with not too many generic div elements used. This should make the site more friendly and accessible to a variety of browsers, especially those for the visually-impaired. The move also signals CBC’s commitment to web standards, something that, while having its share of growing pains, should help improve the state of the Web now and in the future.

The site also does a fairly good job on separating style graphics from content images - though the link images at the top should probably be put in place via CSS, and not be part of the markup. Another more serious problem would be the use of inline Javascript; in particular, the use of Javascript to submit the search form should have been avoided, as seen in this attribute:

onclick="javascript:forms.gs.searchWeb.value='cbc';
forms.gs.submit();"

I’m not sure what they’re using Javascript here for (as I haven’t bothered to look at everything), but chances are, whatever effect they are doing could be accomplished by using an external script file and then using event registration - all of the major browsers support this, and it results a better site because you don’t have messy inline Javascript calls in your markup. They are also using several onmouseover attributes to dynamically change images, which again, can be accomplished in a cleaner way using event registration.

Which brings me to my next point, that while CBC.ca did a good job of separating content and style, they were a bit sloppy when it came to content and behaviour. While the styles and visual layout information were separated out in a style sheet file, the Javascript governing behaviour was not. The mass of onclick and onmouseover/onmouseout attributes attests to this.

But don’t get me wrong. I have a very favourable attitude towards the new CBC.ca, and I while I may seem nitpicky here, I applaud their efforts as a move in the right direction.