January 24, 2011 3 replies

3 Nifty Browsing Features that Should Be on Every Site

Here are three little tweaks that go a long way in improving one’s browsing experience and should become default features on every website.

Kottke’s unread posts notification in the title bar

Kottke unread posts notification

It’s not just web applications like Gmail or Twitter that can enforce the “push” instead of “pull” format that is associated with the real-time web. If you spend a significant amount of time browsing Jason Kottke’s site you’ll probably notice the title bar changing when a new post gets published.

I added a new feature to kottke.org over the weekend: live updating on the home page. If you leave kottke.org open in your browser (with JavaScript on) and I post a new link, the page will display a message urging you to refresh to view some new posts. The page title changes too, so if you have it up in a tab, you can tell at a glance if something’s new. Right now the page checks for new posts every ten minutes, but that could change depending on server load, etc. Thanks to Twitter Search and Tumblr for the inspiration.

Developer hack: Kottke didn’t give details on how he did it, but this script is doing the work.

Infinite scrolling

Infinite Scroll logo

Paginated websites make digesting content more manageable, but sometimes you just want to consume as much as possible too. Imagine devouring as many Google search results and Flickr images as you can.

Infinite scrolling—at least the hacks mentioned below—load the next page when you’re done browsing the current one. The next and previous page links are still there, so you have both options to choose from.

User hack: install Greasemonkey and the AutoPagerize user script.

Developer hack: use the jQuery plugin or the WordPress plugin.

FFFFOUND!’s keyboard navigation

Don’t underestimate the efficiency of the keyboard. At image-bookmarking site FFFFOUND!, using the keyboard is the best way to get around.

Developer hack: install paging_keys_js.

December 8, 2009 3 replies

Mozilla Jetpack: jQuery-esque Firefox add-on development

And by jQuery-esque I mean easy! The premise of Jetpack, Mozilla Labs’s latest creation, is that anybody who knows HTML, CSS and JavaScript can create Firefox add-ons.

It takes 80 lines of code to block ads on websites as shown in the demo above, and 14 lines to edit images from within Firefox. Granted, it just sends the data to Pixlr which does all the hard work, but lowering the obstacles to develop some fairly nifty scripts is a commendable effort, just as what jQuery did with JavaScript, Sass with CSS, and HAML with HTML. It’s made even more compelling with Bespin, Mozilla’s HTML5-powered web-based code editor.

Perhaps I’m still in a “standardize everything” mood, or envy this new doodad since I’m now using Chrome as my default browser, but don’t you sometimes wish all browsers could do this? Do the same set of things? We’re getting to a point where the level of HTML and CSS support is the same across every browser, so it makes me wonder what’s the next step for the idea of cross-browser compatibility.

It will probably depend on what the web browser means to its various makers. Google has unveiled the Chrome OS, which will run on a specialized version of Chrome. Opera is focused on its “web servers for everyone” feature in Opera Unite. (And Internet Explorer is playing catch-up, mostly.) Browsers are basically the gateways to the whole Internet, but they’ve become more ambitious than that and their vendors will attend to those ventures first before convening to create new cross-platform goodness.

January 23, 2009 one reply

Encouraged Commentary, JavaScript, and the great experience

Encouraged Commentary script by Jim Jeffers

Take an ordinary blog post, highlight a passage you want to comment on, and have it appear on the comment form without having to scroll all the way down. Or mouseover a comment, then show replies to it as well as all other comments made by that person. That’s all in the spirit of Encouraged Commentary, which is a jQuery-powered script by Jim Jeffers.

Now this, I would say, is what JavaScript was meant to do. Not that fading, zooming, and sliding around are pointless applications of JavaScript. Impressing people is a lot less important compared to making them feel welcome, and that they’re a part of something. In this case, taking part is by quoting text or keeping track of conversations more easily.

Of course, what Jim did may seem more subtle an achievement than what designers and developers try to come up with, or what the ordinary blog visitor would appreciate.

But it’s one more contribution to that great experience. I’ve talked about Issuu last time, so this counts as number two. To that “wow, I had a pleasant time commenting on your blog today, Jim, you’ve made it so easy!” kind of feeling.

I hope that I encounter more examples of this—not just in commentary, but for every other aspect of a website.

/* */