Hack and / - Dr hjkl Meets the Vimperator

In November 2009, I wrote an entire column (“Dr hjkl and Mr Hack”) devoted to programs with vi-style keybindings. In the column, I introduced the Vimperator plugin for Firefox and discussed how it worked, but at the time, I mentioned, “The Vimperator plugin is extensive enough to deserve a column of its own (in fact, e-mail me at lj@greenfly.net if you'd be interested in that.)” Well, I received a number of responses, so between that and my love for all things with vi keybindings, I think it's worth giving the Vimperator plugin the full column it deserves.

As I mentioned in my previous column, the main reason I love vi-style keybindings is that they keep your fingers on the home row (the asdfghjkl; row on your keyboard)—something quite important if you touch type. Once you get used to using hjkl to navigate documents, it and the rest of the keybindings become second nature. If you touch type with any decent speed, you realize how much it slows you down to reach for the mouse or even the arrow keys—particularly for something simple like clicking a link. Now, most Web browsers have some limited way to browse a page with a keyboard, but they almost always use the arrow and Page Up and Page Down keys, all of which are pretty far from the home row.

In the past, I've used a number of methods to add some level of vi-style keybindings to Firefox. At first, I used a custom configuration to my Firefox config, and later, I used the mozless extension. Both worked okay, at least for certain versions of Firefox, but they still were a limited version of the real thing. Well, the Vimperator plugin is the real deal. It goes far beyond simple keybindings and actually creates a modal interface with an incredible level of detail. You not only get hjkl navigation, but you also can open tabs and even record macros just like in vim. What's more, Vimperator was built with Web page navigation in mind, so there are keybindings available to make it easy to click on links and even hover over elements on the page—all from the keyboard.

The first step is to install the Vimperator plugin. Visit vimperator.org, click on the Download Vimperator button on the page, and go through the typical Firefox plugin installation process. Once you start Firefox again, the first thing you will notice is that your menu bar is gone (Figure 1)! Now, this might be fine once you get accustomed to Vimperator, but I found it a little jarring at first, so you might want to type :set guioptions+=mT to turn the menu bars back on for now. Notice that as with vim, you press the : key to enter command-line mode. Vimperator turns Firefox into a modal browser like vim that has a command-line mode (accessed when you press the : key) as well as a normal and insert mode. Also as with vim, when you get stuck in some strange mode, you generally can just press Esc a few times to get back to normal. If you find you want the menu bar back permanently, add the following to your ~/.vimperatorrc file:

set guioptions+=mT 

This file acts like ~/.vimrc, so you can add any other Vimperator-specific settings here as well.

Figure 1. Vimperator-Enabled Firefox without the Menu Bar

The basic navigation with Vimperator should be pretty familiar to you if you've ever used vim before, but in case you are still new to that kind of navigation, here's a quick list of keybindings:

So for instance, if I wanted to use Vimperator to search for “Sarah Conner”, I would press /, type in Sarah Conner and press Enter. Vimperator would jump to the first instance on the page. If the first Sarah Conner wasn't the right match, I would press n to move to the next match or N to go back to the previous match. If I wanted to start a new search from the top of the page, I could type gg to move back to the top, then / to enter search mode, and then type, for instance, “John Conner” and press Enter.

As with vim, you also can add numerical modifiers to any of these commands, so if you want to move down five lines instead of just one, you can press 5j. If you forget the keybinding for a particular function, just press F1 or type :help to see the full Vimperator help screen.

Vimperator would be useful even if it provided only the standard navigation keys, but it also adds a complete set of keys to access standard browsing functions. Here is a list of some of the standard ones:

Now, I've found that when I use tools like S5 for Web-based presentations, the keybindings it expects conflict with Vimperator. Luckily, Vimperator makes it easy to disable its keys temporarily. Simply press Ctrl-z, and all keybindings will go back to standard Firefox mode until you press Esc. I also use this mode when I browse Google Reader, because it already accepts vi-style key bindings to browse through RSS feeds. If you just need to enter one key that Vimperator won't intercept, you can press Ctrl-v, and after you press the key, Vimperator will go back to its normal mode.

Once you have the standard movement down, you might wonder, how do I actually open a new URL without a menu bar? Either press o (or type :open) followed by the URL you want to open to load that URL in your current tab, or press t (or type :tabopen) to type in a URL to open in a new tab. In addition to these basic keys, there also are a number of variations to them:

Once you type in a URL, you also can press the Tab key to trigger Tab-complete based on your browser history. Speaking of browser history, you still can access that and the other standard Firefox functions from command-line mode: