The Message Notification Experience

Based on the links in my newsreader over the past couple of days, I know I wasn’t the only one who enjoyed  this thoughtful examination of one aspect of the iPhone’s mail app user experience.  The author describes how the app changes its method of alerting the user to new mail based on the user’s context within their inbox.  It’s a neat, yet subtle detail — so subtle that I hadn’t ever noticed it myself, and I’ve been using an iPhone for the past year and a half.

Having someone point out that detail was like someone telling you about the hidden-in-plain-sight arrow in the FedEx logo: not only can you not unsee it once you see it, but you start looking for similar instances elsewhere.  So perhaps it’s no surprise that I recently became aware of differences between web sites’ use of another, more subtle kind of alert mechanism.  And it resides in a web page’s humble <title> tag.

Now, the <title> tag has long been abused in all sorts of ways, from being used as an SEO keyword-spamming mechanism to being downright neglected and forced to serve up the exact same site name text in every single page.  Sometimes a UX architect like myself gets to help shape its usage, suggesting the <title> tag have structured, human-readable content for easy scanning in a list of bookmarks or search engine results.

But what about when page freshness is at least as critical as page content?

Compare Gmail and Twitter, both sites which reside in open tabs in my browser every day.  Both sites use the <title> tag to describe content (site name and location) as well as freshness (new message count).  But one is slightly more usable for my personal, tab-crazy scenario.

Because I have so many tabs open at once in my browser, the actual tab text (the <title> tag) gets truncated to as few as three usable characters.  (My tab for “The New York Times” reads “The …”)  In my main browser, Firefox, Gmail’s nicely-structured, decent-length title looks like this in fullscreen:

Full browser tab for Gmail

…but like this in a tiny tab:

Minimal browser tab for Gmail

What’s lost is my ability to see how many new messages I have at a glance.  To get that info, I need to break my existing task flow to mouse over or click on the Gmail tab.  If I’m just web surfing, no big deal.  But if I’m working in another app layered over my browser, actually stopping what I’m doing to click over to check my messages is a definite interruption.

(And yes, I know I could turn email off altogether while working on other things, but sorry, that’s not how I roll…)

Twitter better enables my multi-tasking lifestyle by helpfully putting the new message count as the first element in their title tag, which is visible even at the smallest tab size:

Minimal browser tab for Twitter

It may be less structurally proper, but it adapts far more gracefully in different scenarios, even the less common ones.  Just like the iPhone mail app.