New in Firefox Nightly: Experimenting with context menus

27 May, 2014 § 28 Comments

Starting today, users of Firefox Nightly will see a new look to the classic context menu.

New context menu

Context menus on desktop browsers have changed very little since Firefox 1.0 was introduced. Meanwhile, new devices have brought new concepts to context menus. The context menu on Firefox for Android is much more graphical, showing recognizable symbols at a glance.

Context menu in Firefox for Android

Switching frequently used menuitems to their iconic forms can improve the usability of the menu, as it can make it easier to find the menuitems at a glance as well as click on. One way to visualize the difference is by performing what is known as a “squint test”. The image on the left is the old Firefox context menu, and the image on the right is the new Firefox context menu.

Squint test of old (left) vs. new (right) context menu (Gaussian blur=3)

Squint test of old (left) vs. new (right) context menu (Gaussian blur=3)

Looking at the squint test above, not only is it easier to see the actions of the buttons at the top, but we can also see that the new menu feels a bit leaner.

We don’t have plans to switch all menuitems over to their iconic forms, mainly because many menuitems lack a well-understood graphical metaphor. We’ll keep experimenting with our context menus, hopefully adding the ability to customize them just like the rest of Firefox.

Known issues: The context menus found in today’s Firefox Nightly are still missing a couple finishing touches that we are going to follow up with:

  • The icons being used are not the right size and are lacking HiDPI versions
  • The bookmark star is not shown as filled-in when the page being right-clicked on is already bookmarked
  • OSX is missing the inverted icons, currently showing grey icons on a blue-hovered background

Tagged: , , ,

§ 28 Responses to New in Firefox Nightly: Experimenting with context menus

  • Matthijs Tijink says:

    Good idea! One question though:

    Does this happen with context menus for links too? I rather like ‘open link in new tab’ to be the top item.

    • msujaws says:

      The context menus generally won’t change. For example, right-clicking on a link still shows the same context menu that it showed previously. Today’s change only affects context menus that featured the “Back, Forward, Stop/Reload, Bookmark This Page…” menuitems.

  • Robert says:

    What about keyboard navigation?, This break it, I personally don’t like that touch UIs be forced on desktop UIs.

    • msujaws says:

      How does this break keyboard navigation?

    • Robert says:

      how do I select with the keyboard the icons based actions, left and right? up and down? not possible?

      the same happens with the Australis menu, buttons are not keyboard navigable. you need to learn where things are on the old menu bar and the new Autralis menu if you are a frequent keyboard user. See bug https://bugzilla.mozilla.org/show_bug.cgi?id=881937

    • msujaws says:

      Up and down will move through the menu items in the accustomed direction (left-to-right for LTR readers, right-to-left for RTL readers).

  • I like this. Seeing ideas from the Android version popup in the desktop version is ace, and it’s a good visual differentiator between Fx and other browsers.

  • Has there been any recent analysis of whether people actually use all the items in this menu? In particular:

    How often do people want “view background image”?

    How useful is “select all” in the context menu?

    What about “save page as” in the context menu, as opposed to on the normal menu?

    Do we need *both* “view page source” and “view page info” in the context menu, or could we integrate those into one function?

    • msujaws says:

      These are really good questions and things that people are looking in to. However, at this point we don’t want to remove particular menuitems. http://bugzil.la/817726 is focused on combining the “view page source” and “view page info” buttons however.

    • writeonly says:

      If people care, we have Test Pilot and other data on this that I can dig out.

      In general though, ones that get used are “translate” (when available), copy, search, etc.

    • Noitidart says:

      I’m very interested in seeing the data. I was curious how many people click on the “stop” item in menu, as with blazing fast interenet these days theres no time to right click then find and click stop. usually hitting escape is faster.

    • msujaws says:

      The Stop button is replaced with the Reload button when the page has finished loading. I think some people in the comments section are getting confusing with the Bookmark button, thinking it is the Stop button.

  • […] Mozilla promises that the new context menu won't change the order of things or remove anything from the context menu. […]

  • mayank says:

    On windows, the icons look “grayed out”. Looking at them, i thought they wouldnt be clickable. Maybe make them more contrast-y ?

  • mayank says:

    yeah, you are right. The greyed out buttons are really disabled. Except for the reload button, which is enabled for every page, but still looks faded out.

  • murph says:

    • The reload button looks blurry, lighter, and a different color, even in that screenshot you posted.
    • Access keys are no longer accessible, which makes me a little sad. I know leaving them in but hidden isn’t a great option either though.
    • Re: keyboard navigability, it makes more sense for the arrow keys to move the selection in the direction pressed. i.e. left/right for the row of icons, or down to select the first regular menu item.
    • What is the purpose of that blank column on the left?

    • msujaws says:

      The icons will be updated, it is using temporary icons in the meantime. Yes, dropping the accesskeys was unfortunate, but as you said it would be odd to start supporting hidden accesskeys. I filed bug 1016414 to support using ‘left’ and ‘right’ keys. The blank column on the left is a platform convention for Windows, and is used by icons for other menuitems when present.

    • murph says:

      Thanks for the prompt reply. I do think this change is an overall improvement, and I’m looking forward the customization features.

  • jopjopsen says:

    This looks good…

    Also I’m really glad you are considering to do customization… I can’t tell how often I wanted to not have a lot of the buttons, but still didn’t bother with about:config

  • Sinclair says:

    It’s a nice idea, but not for me. Is there a way to turn this off? I use GreaseMonkey to customize my context-menu. This gets in the way of the menu items that used to be nice and convenient to access because I can’t put anything above these icons.

    On a related note, it would be great if the “Customize” option in Firefox could be used for the context menu and not just the main toolbar.

    • msujaws says:

      There isn’t a simple pref that can be changed to disable this feature, but an add-on could undo this change.

      The intention of this change is to eventually allow customization of the context menu through the “Customize” option. What you’re seeing now is just step 1 :)

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

What’s this?

You are currently reading New in Firefox Nightly: Experimenting with context menus at JAWS.

meta

Follow

Get every new post delivered to your Inbox.

Join 1,013 other followers