Michael Verdi

A Shortcut to Your Shortcuts

While watching people use browsers, I noticed a common pattern. When done with a website people often click into the address bar to start a new task. This is followed by a pause as they try to formulate the query that will get them to the next thing.

Although the address bar is the part of the browser that people interact with the most, it’s essentially a command line interface with “Search or enter address” as your only help. So part of our strategy for Firefox is to make the address bar easier to use.

The Challenge

The goal I set for all of our search work was to give people new capabilities for finding and making sense of information without forcing them to adopt new ways of working or feel like they need to learn to use a browser again. Things should be discoverable with routine use.

My Roll

Initial Explorations

Firefox is great at suggesting things when it has some context. Because it knows me, if I type the letter m in the address bar it will suggest michaelverdi.com as the place I probably want to go (your result will be different!). But, I wondered, what could it suggest before I type anything at all?

We experimented with a few different types of contextual recommendations—similar sites, links on the current page, trending searches, and news stories.

Reuse a tab or create a new one, it’s all the same

The Firefox new tab page includes a section of shortcuts to your most visited sites. So, ultimately what made the most sense was to suggest these same sites when you click into the address bar. This way it doesn’t matter if you reuse a tab or create a new one, your most visited sites are one click away.

accessibility

This was pretty tricky to get right. We want the address bar and the panel that contains its results to be fully accessible with the keyboard. The issue with this new interaction was that the tab key is used both by people who only use a keyboard to navigate the UI and by power users who use it to navigate the address bar results. Because we were going to show the results before you typed anything, keyboard users would be trapped in the results pane.

We could have fixed this by removing support for tabbing through the results pane but that didn’t align with our goals. So with some sacrifice to total consistency, we changed how the tab key works depending on how you focus the address bar. If you use the keyboard, the tab key will navigate the UI. If you use the mouse, the tab key will navigate the results. In the end it just works and it set us up for our next project: Tab-to-Search.