Firefox UX
Categories: Firefox General Interaction Design

Find it Faster: The New Search Interface in Firefox

76 responses

The new search Interface in FirefoxHow often have you done a web search, already knowing that you would click the first result that looked like a Wikipedia page?

Quite often? Then Firefox is about to make your life easier. With the new one click searches, you can instantly find what you are looking for across the web.

Find anything quickly on any page

When typing a search term into the Firefox search box, you will notice two new things: first, we improved the design of search suggestions to make them look a lot more organized. And second: there is an array of buttons below your search suggestions. These buttons allow you to find your search term directly on a specific site quickly and easily.

We are shipping Firefox with a set of pre-installed search engines that are tailored to your language. You can easily show and hide them in your search preferences.

Configuring search preferences
But you shouldn’t be limited to any default set we provide. That’s why adding additional search engines is easy. Are you a web developer? Then how about adding MDN and Stack Overflow to your one click searches? Writing a paper and looking up synonyms every day? Add a dictionary site! Just click on the magnifying glass in the search field while on the site and select the search engine you’d like to add.

Adding new search engines

Firefox is all about choice, and with the new UI, searching is now more flexible and powerful than ever. Coming soon to a Firefox near you!

76 comments on “Find it Faster: The New Search Interface in Firefox”

  1. Jan Tojnar wrote on

    What about searching by keyword in address bar? I don’t see any button for changing it. Is it hidden in context menu? The only thing I use search bar for is adding new search engines and setting them a keyword, otherwise I just use address bar.

    It looks nice though, I hope it will also finally bring search module sync.

    1. Philipp Sackl wrote on

      Keywords aren’t accessible in this version, but will be re-added soon. Old keywords should continue to work and you can still use bookmark keywords (right click into a search field on any website and select »Add a keyword for this search«).

    2. Mike Cooper wrote on

      You can right click on any search box, and click “Add a keyword for this search” to easily create new keywords.

    3. AMARACOLOUS wrote on

      I find it very fine

  2. Peter wrote on

    Choice? Flexible? Powerful??

    Gone are the keyword shortcuts. The keyboard navigation is a mess. Plus the new search breaks add-ons which won’t be fixed because you landed the patch at the end of a beta period.

    1. Philipp Sackl wrote on

      Those are all things scheduled to be improved.
      Old search keywords should still work. You can still add bookmark keywords (which do essentially the same thing) by clicking into a search field on any website and selecting »Add a keyword for this site«

      1. Peter wrote on

        >Those are all things scheduled to be improved.

        Can we get an official statement why this was landed on Beta? If it had landed on Nightly you would’ve had enough time to improve it.

        To me it looks like you try really hard to keep users switching from Yahoo:

        – Hide the name of the default search unless you search for something
        – Require 4 instead of 2 steps to change the default search engine
        – “One off” searches, so users click on Google instead of changing the default

        >Old search keywords should still work.

        New ones cannot be added anymore and existing ones cannot be modified.

        >You can still add bookmark keywords

        Great, looking up URLs for 20 search engines will be fun. You’re making OpenSearch useless for power users. And you really talk about “choice”, “flexible” and “powerful”??

        No comment on the keyboard navigation?

        No comment on the broken add-ons?

        I’m deeply disappointed in how this was handled.

        1. mirvink wrote on

          This is another UI change that doesn’t make sense and doesn’t bring joy, because it changes a fine system into a kludge because the designers think looks are more important than functionality.

          This is NOT an improvement. It’s more cumbersome, more clicks, takes up a huge amount of screen estate when you’ve got not just 6 search engines but 20-30 it breaks plugins, it’s not even finished (missing keywords) but it will be implemented anyway.

      2. Alex K wrote on

        New UI seems to make sense for average users, but why break Ctrl+Up/Down search engine switch for the experienced ones?

  3. Ariel wrote on

    You’re awesome, guys!

  4. Jesse Ruderman wrote on

    Why is the search bar no longer oval-shaped?

    Will there be a way to “add the current site as a search engine” without having the search bar visible? There’s right-click “add keyword for this search” but that seems to be a completely separate feature.

    1. Philipp Sackl wrote on

      The oval shape is specific to OS X versions earlier than Yosemite. It is still oval shaped in these versions :)

      The »Add keyword…« thing is separate, but essentially does the same thing. Unifying these and making them more useful is definitely on our list.

  5. hex wrote on

    Great idea!
    Thats what Mozilla needs,
    Rethinking every small part of browser and bring small UI improvements everywhere!

  6. Oleksandr wrote on

    Looks handy!

    Will user be able to use a keyboard shortcut as well as mouse to execute a search? My guess is:
    1. click on a search field to place a cursor
    2. type criteria
    3. hold Alt so the numbers would appear near each search system (according to your gif, it would be Alt+7 to execute search ‘mozilla’ on wikipedia – a page in a new tab)

    PS: I thought, search tool is going to be dropped. Search tool in address bar (with the Nightly’s ‘search for’ string, and the search tool on a new tab are all I need at this moment. The concept you have revealed is welcomed in address bar (problems with a suggestions list though).

    1. Philipp Sackl wrote on

      The new UI is keyboard accessible, but we’re still improving that part.
      Currently, you can press tab multiple times to select a search engine. You can even use the up/down arrow keys to select a suggestion first and then run the search through any engine.

      1. Zéfling wrote on

        Ctrl + up/down arrow keys to select a search engine still works ?

        1. Sebastian wrote on

          Looks like this is not working anymore.

          I often use Ctrl + Up/Down or click the search icon to toggle to the right search engine first and then start searching. This use case doesn’t seem to be covered anymore with the new search feature.

        2. Ludwig wrote on

          Just like Sebastian, I made excessive use of the Ctrl+Arrow way of choosing the search engine. Important was also that the search bar then stayed with the cosen search engine and didn’t every time fall back to the default search engine. I find this new behaviour quite annoying.

      2. Oleksandr wrote on

        So the keyboard short-cuts are not forgotten. Just haven’t found it in an article. Thanks for an answer.

        Also I want to discuss why users asking for the complete integration of search tool to the address bar. As we see, many users are asking for that (have no clue of a % from the all community). I ask for that too. And here are reasons (at least I feel so): the more places where a user can do a search – the more stuff a user has to learn (I mean a behaviour of UI). Also a user has to make a decision: which place to choose for a search (address bar, classic search tool, search field on a new bar or a bookmarked URL with a keyword)? Those are the reasons why I feel uncomfortable when I have to use a browser for an info search on the WWW.

      3. Oleksandr wrote on

        I have tried to paint what is on my mind. Here is a rough sketch of UNIFIED SEARCH WINDOW in an address bar (actually the concept you have revealed, but projected on what many users want):

        http://s2.postimg.org/8w7wla59l/firefox_unified_search_window_sketch_v0_001.jpg

        I think, the best fit for a browser would be only two places for a a search tool. For instance, an unified address/search window, and a search tool on a new tab.

        1. Noitidart wrote on

          WOW! I wasn’t for unified search and url but with the new panel its so absolutely beutiful. And then you got a rough draft started on unification and it looks like it can SUPERB!! I LOVE LOVE how tabbing toggles through the search engines. And using the arrow keys you move through the url selection.

          The issue with this unification is how to keyboard navigate between url suggestions and the search suggestions.

          The draft is a bit ugly right now but looks SUPER PROMISING!!

          1. Oleksandr wrote on

            I’m glad you liked this ugly sketch which brings the idea not the art. And the idea is mostly from FF developers. I just moved it a little bit to the left :)
            It says ‘Firefox Addon Developer’ in your profile, so how about to create similar addon?

            PS: unfortunately I forgot to put ‘Add Twitter search’ string between ‘Find on page’ and ‘Change search settings’.

      4. iambk wrote on

        Thanks for this information. I wasn’t able to intuitively realize that I could use [Tab] or [Up].

        The search box is actually an important feature that keeps me using Firefox instead of Chrome. I realize that whenever something gets changed some of us will complain. It sounds like you’re already on top of it, but please don’t forget those of us that still prefer quick keyboard navigation.

        Being able to change the search engine from one thing to another using [Ctrl]+[Up/Down] would be nice, but I also realize that might upset Yahoo and money is money.

        Maybe keyboard navigation is a lost cause. Steve Jobs always wanted to force users to use the mouse and I think he’s increasingly getting his way.

  7. cemal wrote on

    I think search bar should be merged with address bar.

    1. Gervase Markham wrote on

      That has been looked at several times, but there are difficult privacy problems to overcome if you also want to provide search suggestions. If someone is typing a URL, they don’t necessarily want their default search engine to know where they are going. And yet, if you want to provide search suggestions well, you have to send every keystroke in a unified box to the search provider.

      1. Albert wrote on

        +1 for privacy as this is one of the things I don’t like about Chrome

        1. EMB wrote on

          +1 privacy
          I would like an InstantFox like behavior where the suggestions only work if I prefix what I am typing with an shortcut.
          Sadly, InstantFox is having problems with FF 34. :(

      2. qwertz wrote on

        Well why not have an option to enable search suggestions in the address bar for those who want, and display a privacy warning : “Enabling search suggestion will send requests to your search engine each time your typing in the address bar” when you activate it.
        I’m sure this is a most wanted feature, especially since you have it in competitors such as Chrome.

    2. mjt wrote on

      +1 on the merge … two fields takes up real estate …

    3. Surya wrote on

      You can already perform searches from the awesomebar, but the search bar offers more options, so I feel like both should stay.

  8. Cazzie wrote on

    And in what release version will this appear?

  9. Zéfling wrote on

    For the same favicon, how to distinguish?
    Example with my list : http://ikilote.net/Galeries/Autres/Divers/Firefox_Searchbar.png

    1. Don Reba wrote on

      Agreed. With the names gone, I have to go by memory of their position in the list to tell apart the different flavours of Wikipedia and Wiktionary.

    2. Albert wrote on

      bug filed here: https://bugzilla.mozilla.org/show_bug.cgi?id=1110767

  10. Omega wrote on

    Why was this shoehorned into Beta instead of riding the train like the development policy dictates? What’s the point of having a development policy if you’re breaking the rules.

  11. Emilio wrote on

    It would be great that the new search will open in a new tab. (or to that possibility)

  12. HTTPS-WARNING wrote on

    When accessing this site at https://blog.mozilla.org/ux/2014/11/find-it-faster/ the images are included via HTTP (without S) and therefore are not loaded/displayed. Please fix your blog, thank you.

    P.S.: This comment form wants to be send over HTTP too and cause a warning. :/

    1. Albert wrote on

      Yeah, the warning on form submit it rather irritating …

  13. Al wrote on

    I’ve been using this since the weekend when it was pushed out to the beta channel, and I have to say it’s annoying compared to how I used the search field.

    Before, I would know which search engine I’m going to use (Google, Wikipedia, etc) and select it and then type my query. Quick and efficient.

    Now, I have to type what I want to search, move my cursor past search results I’m not interested in and then select the appropriate search engine. Slow and inefficient.

    If there was choice, I’d like to have the option to switch back to the old behaviour, or restore the dropdown to select the search engine before searching.

    1. Cedders wrote on

      +1. The lack of an icon or search description, the poor keyboard navigation, and the failure to easily set the default search are other problems with the changes. I agree with keeping the search bar separate for privacy reasons.

  14. Jaka wrote on

    So basically you’re implementing something that DuckDuckGo search engine already had for some time. You just redirect search query to Wikipedia, Twitter, and so on…?

  15. sizvix wrote on

    Will we need to click on “change search settings” heach time we want to change the engine of suggestion ?

    1. Peter wrote on

      Yes. It’s more flexible and powerful this way.

      “Change Search Settings” -> Click on dropdown -> Select new default search engine -> “OK”. Every. Time.

  16. Sean wrote on

    Didn’t IE ship this in IE8?

    http://windows.microsoft.com/en-us/windows/internet-explorer-8-web-search

  17. Børge / forteller wrote on

    Thanks for writing about this and for replying to comments!

    I really hope you will remember to keep the keyboard navigation just as simple as it is today. Ctrl + arrows is a very nice and simple way of changing search engines. If I suddenly have to press tab multiple times instead, that will make Firefox much less comfortable to use.

    I might start using the mouse more, which hurts my physical health.

    Hopeing for a reply! Thanks!

  18. Jama wrote on

    Opera is doing way better just put “a key letter” at the beginning and enter search term….
    For example, g how to blah bla -> this searches from google etc.

    I don’t like using mouse more often, I hope they added some shortcuts too.

    1. Maya wrote on

      Are tou kidding me ? Firefox does exactly the same…
      It’s called “Smart keywords” : https://support.mozilla.org/en-US/kb/how-search-from-address-bar
      You can use “g” as a keyword for google search in the location bar.

  19. Przemo wrote on

    I always use Drag and Drop Zones extension, it’s the most efficient way to search web: drag a word and drop on displayed squares so it opens in background tab for example. Do sth like this with your search field tiles
    http://cdn.add0n.com/images/drag-and-dropzones-big.png

  20. Tim wrote on

    I used to use FireFox … Used it for years … then, about a month ago, Firefox got riddled with LOTS of popup ads all over the page … I mean LOTS OF ADS

    Stopped using Firefox three weeks ago … can see NO reason to return to your Ad Riddles Pages

    You USED to have the best search engine out there … USED TO

    1. Philipp Sackl wrote on

      That sounds like your Firefox has been hijacked by a malicious add-on. This usually helps: https://support.mozilla.org/en-US/kb/reset-preferences-fix-problems?redirectlocale=en-US&redirectslug=Resetting+preferences

  21. Jack wrote on

    1. Why is there no favicon of the default search engine displayed in the search bar? The magnifying glass icon is ugly and non-specific.

    2. Keyboard navigation is pretty much ruined. Ctrl+Up/Down should still cycle between search engines.

    3. You should provide an option to completely disable this new “improved” functionality.

    1. Jack wrote on

      Also just noticed a bad bug.

      If you press Ctrl+E to do a search, type something, press tab a few times to select a non-default search engine, then decide to change your mind and *not* perform a search right now… hit escape… keep reading your web page. Then later, you press Ctrl+E to perform another search, you expect it to use your default search engine, but it uses the one you previously selected using your tab key.

      Again… if there was a favicon present, the confusion would be less.

      1. Jack wrote on

        Finally I’ve noticed that all of my comments were already covered in an article about this new feature… http://techdows.com/2014/11/firefox-34-disable-or-remove-one-click-searches-ui-in-the-search-bar.html

        As a developer myself… your developers need to step up their game.

  22. Noitidart wrote on

    This is absolutely beutiful!!! Can be even more beutiful. I love how tab toggles through engines and arrow keys goes through suggestions. Arrow keys are a bit out of the way though, so maybe ` and Shift + ` (tilde) can also be hotkeys for up down arrow?

    One feature this lacks is, often i would click the go arrow on empty search field to go to that search engines page. It would be nice if we could work this in, in some creative way.

    Also if I focus the field by right click in the search field, sometimes the context menu is behind the search panel.

  23. Noitidart wrote on

    Also we should make the icons draggable, rather then have to click on “Manage” to actually manage it. Would be awesome if you can just manage right there like the Customize page. If drag engine from bottom to top, then that would switch it for the default.

    Right clicking icons and remove should remove it.

    And also if you go to qwant.com then click the field you see the “Add Qwant.com” however it doesnt light up notifying you that its available like it used to. It was subtle, maybe we should bring that light up back. Maybe, it might be redundant, so maybe.

    1. Noitidart wrote on

      Because if a user wants to add it, they should know to click up there to check if its available. I dont think they really looked at hte light up to decide to add it. And the light up was so subtle it didnt really say much. I dont know, maybe add it back maybe dont (the light up part when add is availble)

  24. X4lldux wrote on

    Why is it available only in US?

  25. tomslayer264 wrote on

    Is it possible to quick-select a search engine with a hotkey, for example? Clicking or cycling through the list with the arrow keys is slightly laborious and really functional.

  26. Master Yoda wrote on

    It looks great but I want have an option to have the search buttons that now are at bottom being at top above the search suggestions.
    The less you have to move the mouse the better the user experince get, it feels fast and smooth then.

  27. Conscious wrote on

    It is no longer possible through the interface to remove Search Engines once added.

  28. Albert wrote on

    Perfect! That’s exactly how I wanted the settings to be all along. My primary search engine doesn’t change in Awesome bar, new tab page and search bar, but if I want a specific search I easily can do that via the search bar.

    Two (minor) things for list of adjustments:

    1) as Conscious already mentioned, make the search engines removable again. That’s at least my personal preference as it I don’t need a hugh list where I have 50% of search engines I know I am not using (and it might be good for Telemetry as well, maybe!?)

    2) I have the German and the English Wikipedia in my list, both times pretty much with the same favicon; currently the English one is bigger and squared (I guess it was pre-added), while the German one is slightly smaller and has rounded corners. I also can distinguish them via the ‘title/alt-text’ which comes up on hover, but that is – for a good reason – slightly delayed and would slow down my search if I’d always wait for that. Maybe someone clever can come up with something!? ;)

    Thx Philipp and the team!

  29. Axel Grude wrote on

    There are a lot of problems with this new search approach:

    I don’t like the fact that there are no labels on the icons as I have duplication of different flavors of search (e.g. google image, google image HD) also it is not practical when you have a wide search box (lot of mileage to hit the right provider) and the worst thing is that “oneclick” always reverts the search engine to the default. To have to go to options dialog to make a half hour search on a different engine “sticky” is really user unfriendly.

    Finally, why do you not display the icon of the search provider any more?

    You could improve the panel to true “one-click” by making the provider portion persistent on hover and moving it to the top of the panel. this means the popup does not close the complete panel and the user can choose a different search provider while viewing results from the initial provider. Also, I do not believe it is a good idea to have the concept of a “default” provider that can only be changed via a modal dialog – the old version was a lot more friendly for me. I might search only google for 30 minutes then mdn for an hour then mxr. I do not want 3 trips to the options dialog for this or constantly have to re-click the “non-default” provider, that actually adds a lot of extra work for me

  30. Surya wrote on

    I like this a lot!

  31. Håkan König wrote on

    First, please bring back the dropdown menu for switching default search engine. Or, failing that, make it possible to set default search by right-clicking on a search engine in the list. I do approx 30% of my searches on google, 30% on English wikipedia, 30% on Swedish wikipedia, 10% on other search engines.

  32. Jan wrote on

    Can we restore the old version of the search bar, at least as an option?
    Having wikipedia in two languages this really sucks as they both have same pictograms.

    1. Lisa wrote on

      Yes, please?!

  33. Spencer wrote on

    Found the workaround in about:config (browser.search.showOneOffButtons). Why not make this more visible?

    1. Mario wrote on

      I don’t understand — You’re suggesting what? “(browser.search.showOneOffButtons)”

  34. Axel R. wrote on

    Most of the time I did searches like this:
    1. Select search engine
    2. Highlight text
    3. Right-Click for “Search [engine] for [highlighted text]”

    This is now broken for me.

    I don’t understand why the former search bar had to be made more complicated.
    I hope mozilla is not going the gnome way of ignoring the user’s workflow for “pretty looks”. :-(

    Also I find it quite rude to force this update on the user base and not supply an UI-option to keep the old behavior. (For those who don’t know: Set “browser.search.showOneOffButtons” to “false”.)

    1. Mario wrote on

      What does that do? (browser.search.showOneOffButtons” to “false”)

  35. Lisa wrote on

    When I right click to do “paste and search” or the like, that box of icons comes up instead in the way of the copy/paste dialog.

  36. Ben wrote on

    New box seems fine but it’s missing 2 features:
    – You can’t see which search engine you’re using.
    – You can use Ctrl-Up/-Down, but the search engine you choose doesn’t persist.

  37. Rhys wrote on

    I often use right-click search on text from an article I’m reading. I use Wikipedia, Google, Youtube and others with roughly equal frequency, depending on what I’m looking for. If the one I want isn’t selected in the search bar, I it in the drop-down, highlight the text, then right-click to search.

    With this new functionality, it seems I have to either use the “Change Search Settings” dialog box to select a default, which is picked up by right-click, and what my default is is now not visible before I highlight the text and right-click.

    Or, I have to cut and paste the text into the search box, and manually select Youtube or whatever each time.

    Either way, it’s a lot more hassle. I think you need to show the icon for the default search engine on the search bar, as before, and allow easy changing of the default, as before. Also, change the right-click search (or add another line “Search with…”) so that it has a sub-menu for picking a one-off engine.

  38. Mario wrote on

    I hate it! I need it changed back to what I’m used to. I can’t highlight text on pages and quickly choose the search engine to search under with the text highlighted. Also I can’t open up multiple tabs under the search for each specific search engine? Major flaw because I can’t open new tabs for the different searches I want to perform for each different search, only on the same page and I hate that, it overlaps the page I’m on. Drastically cuts my productivity. In a market where multiple tabs in the norm — Who is the genius who came up with the idea to stunt an already good search bar?

  39. kilmi wrote on

    I don’t like it….
    Now it is harder to use than before, i think it is useless.

  40. Ugras wrote on

    is there an easy way to have old behavior or at least changing default search engine without entering into settings. (right click on logo for instance)