 |
||
January 04, 2006AJAX Design Pattern: Read/Write DivA new AJAX convention cropping up in a few places, one that is easy to implement and has real benefit to end users. I haven't found a description of it anywhere, so I thought I'd write it up here. The basic idea is that user controls (typically for editing the displayed data) should be hidden from the user until needed. At "rest", an area of the screen displays information in read-only fashion. This has the advantage of creating a much less intimidating screen. Instead of providing the user with 100 controls, users simply see the information in "read-only" fashion: i.e. in aesthetically pleasing html. This is obviously an appealing approach (every AJAXY portal, from google to netvibes is using it. Why is it so great? Why the Read/Write Div Works Also, the "read-only" view of the data takes up much less space than the "read-write" view does, so much more information can be packed into a given page, which means that the user doesn’t have to scroll down to read content. Avoiding the scrolling saves the user a measureable amount of time while browsing (3.05 seconds, according to my back-of-the-envelope GOMS keystroke analysis). Of course, the user has to do more work (1 extra click) to perform an edit of their data. The extra click is needed in order to put the div into "read/write" mode. But this is AJAX, so the extra click doesn’t initiate a trip back to the server, so there is no system "lag" time. Total extra time added to the "edit" process? 1.7 seconds. So we save 3.5 seconds on browsing (a frequent activity), and add 1.7 seconds on customizing (an infrequent activity). Sounds like a win from a purely rational perspective. But from an emotional perspective it’s even better. The instant response of the div opening for you to edit has the satisfying feel of opening a swiss army knife. The responsiveness gives you a feeling of control that is often lacking in web applications. This combination of cold logic of time optimization with an emotional response to the instantaneous response of the interface is the reason AJAX is such a great improvement over regular HTML. Over the next few weeks I’ll be pointing out other AJAX design patterns that I’ve noticed, and why I think they work. Previous Comments
I agree this is a good thing, but the part of the process you're talking about isn't AJAX, it's just Javascript. The AJAX part would be when you finish editing and the weather area updates without refreshing the whole page (assuming it does that). Posted by: Richard at January 5, 2006 07:18 AMRichard, Thanks for stopping by! I stopped fighting that particular battle a long time ago. The term AJAX has come to mean, in everyday language, using Javascript to create a richer and faster user experience, period. Using it to mean anything more specific than than just confuses people. You are technically correct, however. Posted by: Jon at January 5, 2006 08:12 AMJust because it's a losing battle doesn't mean people should propagate such a dumb mistake. There's a really critical functional difference in the meaning of the term. The people who might be "confused" by the actual correct use of language are the ones who don't care if it's AJAX or HOOT-NANNY or whatever, because it's COOL. These are the users, they don't care. quoting Amy Hoy
end quote
:-P Posted by: rubixor at January 25, 2006 04:00 PM Rubixor, be nice. Amy, thanks for stopping by. (Nice blog, btw). I manned the barricades when this AJAX term came out (I wanted to call them "Javascript RIAs"). That ship has sailed ... if you look at the contents of the "AJAX libraries" they are mostly about Div manipulation, animation, and widgets. If you look at the stories in Ajaxian they are about pretty much any kind of "heavy-duty" use of Javascript. When you consider most "AJAX" applications are NOT asynchronous and DON'T use XML, I think it's time to abandon any attempt at "strict" usage of the term. But I don't dispute your point at all, technically. Posted by: Jon at January 25, 2006 04:08 PMJon, Very nice observation. Live.com has similar functionality, which I find pretty much useful. Looking forward to see next patterns :) And I think AJAX is not XHR anymore. It was 6 montsh or so ago, not anymore. Stoicho Posted by: Stoicho at January 26, 2006 01:24 AMJon, I think that every post I have gone to for AJAX has had someone griping about the imporper use of the word ajax. All you people who gripe suck! Look at this article and enjoy it's content. If you want to comment on it, comment on how cool it was that he is putting together some ideas that he has, and that the widgets he explains actually make good sense. Was the article about the definition of AJAX.... no, just a good way for us to implement an interface for it. Can you have MVC without the view? No, so AJAX needs to be realized through some interface, and he is obviouslly making a good point about that interface... so SHUT UP! Posted by: Chad Wagner at January 26, 2006 06:41 AMnice article, btw, did you notice how easy it is to edit the title on netvibes? that's really comfortable! Posted by: receptor at January 26, 2006 02:23 PMnice article |
|
|
|
my company: www.uzanto.com email: jon at uzanto.com |
||
Add to del.icio.us
Digg this
Post to Furl
Add to reddit
Add to myYahoo!
Recent Entries