Wed, July 27, 2005
Related Photo Flicker, Ajax—3:33 PM
With the photos and galleries working, it's time to focus on some of the more complex features that have been held up by their dependence on the photos and galleries.
One of these is a "pseudo-gallery," which will treat the photos that are related to a given item as an ad hoc gallery for viewing purposes. So, in addition to the photo section in the "related items" column (for an example, see my Shark Tale screed), you'll also have the opportunity to view that group of photos "as a gallery" – in a layout already designed specifically for displaying groups of photos. It's one of the most brilliant ideas of the re-bee, and I'm proud to say it works beautifully.
So, yesterday and today I got that working, along with a very slightly redesigned flicker for the photo section in the related column. The new version adopts the "slide" design from the gallery view, which will become the dominant metaphor for displaying clickable image previews at onebee. And, as of today, it's powered by Ajax – which means you'll be able to flip through the related photos without reloading the page. A quicker and more seamless experience, to be sure.
Implementing the Ajax solution is always a challenge, but it gets easier as I gain experience. I still work vigilantly to avoid deploying Ajax unless there's a good reason (same for any whiz-bang technology, for that matter). There must be a tangible benefit over the flat approach. It must not detract from the ordinary operation of the rest of the page. (E.g., breaking the "back" button, denying a permalink, or myriad other shortcomings.) And, absolutely paramount, it must degrade gracefully and seamlessly. In the case of the related photo flicker, if your browser won't execute the Ajax solution, it automatically falls back to the page-reload approach that onebee currently uses.
Degrading gracefully is absolutely essential. There are certain web browsers that are just too old to code for, but – within reason – you must try to provide the best possible experience for all users. In the case of the related photo flicker (or RPF, for short), I coded the old-school, page-reload version first and then decided to add the Ajax flair. It happened by accident for me, but I think this makes a good model for developers. Creating the default version first ensures that it's rock-solid and performs beautifully – as if it were the only version. Then, you slip in the newfangled widgets, and things get even better for the people with modern browsers. This way, the default isn't some hasty, half-assed kludge; it's a fully functional approach. That's a nice gift for your viewers – and it just might inform the design of the whiz-bang version, making both better in the process.