We're building a responsive web site and we're having a discussion about how to display controls on a map. The theory is that people with touch-enabled devices do not need to see zoom sliders because they could and know how to pinch the map. So if we detect if a visitor has a touch enabled device we simply hide the controls. The benefit is a less cluttered interface. Would you recommend this approach? Is there devices out there that support both touch, mouse and keyboard navigation?
Windows 8 has the following behaviour for its Maps app:
- Users of touch-only devices never see the zoom controls
- Users of non-touch devices always see the zoom controls
- Users of hybrid devices such as touch-screen all-in-ones will depend on how the user is currently interacting with the map.
To clarify that last point; Windows 8 enters a sort of "touch mode" once you start interacting with the computer via a touch screen (regardless of the connected hardware), e.g. if you tap your password field on the login screen instead of targeting it with a mouse, it'll show the on-screen keyboard, regardless of whether or not a physical keyboard is connected. Naturally it accepts input from either.
The same thing goes for scrollbars, which are much wider and more familiar on Windows 8 when used with a mouse than with touch only:
So in keeping with that behaviour, Maps changes its behaviour dynamically based on which input device you use. If you enter Maps with touch it will not show controls until you move a connected mouse (in which case they fade in). If you enter Maps with a mouse, the controls start visible and dynamically fade out once you start pinching and zooming. Once they're visible the controls look like this:
I would suggest keeping the sliders even for touch devices.
I was doing some testing recently with someone that has had an iPad for 2 years, and discovered that they did not know that you could pinch to zoom. I'm sure they are not alone in this.
Also, touch devices are often used by people that are physically unable to pinch to zoom, and who rely on the ability to simply tap on the action they need. If you take away the controls you then hurt the accessibility of your application.
I think it would be a great idea if you could know (for sure) that the device visiting your site is touch only. But that is hard to do, especially when these touch enabled devices are coming to the market.
I'd say - support both methods but don't omitt the controls for mouse users.
I think that if the users don't need the controls, why waste good real estate. THe whole idea of responsive is that it... well - responded to the user. Devices that have both input options hav a mouse, therefore you need to show it to them. The reason is that if the mouse is what the users is using at that moment, it would be awkward to leave the mouse and start touching the screen and then oging back to the mouse. What you will lose in this option is the affordance of the pinch Maybe you can detect earlier whether the user is using a mouse or not, and then assume that htis is her favorite manner of input at that moment