GOOGLE® CHROME® BROWSER KEYBOARD-ACCESS

Figure 1 shows a screen shot of the top portion of the Google® Chrome® browser.

I have mentioned before that I don’t care for Chrome for various reasons, but here is another one. Much of the application functionality is practically unusable without a mouse. Never mind the fact that there is no text in the title bar for an automatic screen reader (not 508 compliant), there is also no visible menu bar. The wrench icon at the far right of the URL text is the way to access menu options, but the icon is not in the [Tab] order. (Neither are any of the other icons, by the way.) Through trial and error I finally discovered that Ctrl+f invokes the menu (see Figure 2), at which point the arrow keys can be used to move to a desired option and the [Enter] key to select it.

Ctrl+f seems like a strange key sequence to access the menu, unless you realize that most Windows applications have File as the first menu on the menu bar and Ctrl+f activates the menu and selects the first option in the menu. But why is there absolutely no clue on the GUI about how to access the menu? It must be because they have no interest in customers that don’t (or can’t) use a mouse.

Other browsers and applications give the user the option to hide the menu bar, but to have the menu options only available under an icon on the toolbar is very unkind to users, whether they have a keyboard or not. Note also on the Chrome menu that only some of the options have a key sequence indication; with the other menu items the only access appears to be to arrow to the item and hit [Enter]. Having a menubar with underlined characters for quick Alt+[key] access is a much better idea.

(By the way, I went through the entire keyboard hitting Alt+[key] for each number and character. I discovered only one other key sequence that did anything: Alt+d puts the focus on the URL field and adds the current URL to the Bookmark list and displays it under the Star icon in the address area. But again, there is no indication of this anywhere on the GUI.)

Technically, Chrome is still 508 compliant in this area because the application features are still accessible without a mouse, but why was it made so difficult to figure it out? Extensions are a different story, however. Figure 3 shows Chrome just after installing the Web Developer extension.

When the installation is complete a popup points to the new Gear icon on the toolbar. Unfortunately, I can find absolutely no way to access toolbar extensions through the keyboard. I installed other extensions and read all the help I could find, but I was out of luck when trying to access them only via the keyboard. A mouse click on the Gear icon (between the URL field and the Wrench icon) is required to popup the Web Developer options. And even once the toolbar is activated, the [Tab] and [arrow] keys do not put focus on any of the toolbar buttons, so, again, the mouse is required to use any toolbar functionality. Poorly done.

FIREFOX® WEB BROWSER KEYBOARD-ACCESS

Figure 4 shows a screen shot of the Firefox® web browser with the Web Developer Extension installed.

Notice the Web Developer toolbar just below the standard toolbar, including the options Disable, Cookies, etc. The toolbar options for this extension (like the Chrome toolbar) also provide no direct keyboard access, but Firefox at least gives an alternative. Figure 4 shows the Tools menu with the Web Developer options added in automatically as part of the extension installation.

This is fabulous! I have complete access to all of the functionality of the extension through the menu. There are even Alt+[key] options for each and every menu item. Very well done.

WEB APPLICATIONS

Windows applications are one thing, but more and more is being done through browsers with Web Apps. I have used GWT® (Google Web Toolkit) and GXT® (Ext GWT) on several different projects that needed rich functionality quickly. These tools provide that, but they are not nearly as keyboard friendly as I believe they should be. Figure 6 shows an sample Grid to Grid Drag & Drop widget (and sample data) provided by Ext GWT.

The widget is fantastic…if you’re using a mouse. Multiple items can be selected on either side and dragged back and forth. A tooltip follows the mouse cursor indicating the number of items currently being dragged. Because it’s so powerful, it’s also very tempting to use even though there is absolutely no keyboard access for moving the items from side to side. It is possible to [Tab] to one side or the other and use the arrows keys to move through the list and even use the Shift+[arrows] to select multiple items in sequence, but nothing can be done with the selections if you’re using only the keyboard. Hopefully that will come in future releases.

KEY DESIGN POINTS

1. Having menus hidden under an icon is a great way to avoid clutter, but the icon should be in the [Tab] order and/or there should be a clear method for invoke the menu via the keyboard only.
2. Having mouse-specific features like Drag and Drop makes the functionality quick and convenient, but there should always be a keyboard alternative for all functionality.
3. Always test access to your entire application, web application, or web site with keyboard only.