Background
On mobile web it's important to provide users with feedback when they tap on links/button/active elements. While mobile browsers (Safari & Chrome) add this type of feedback by default, in the past we've intentionally disabled the default feedback so that we could provide and style our own custom feedback. This strategy recently failed on iOS browsers, resulting in no feedback for users (since we were disabling the default, and our behavior was not showing). We've fixed this issue here T188043.
Current State
- Android: we override default behavior. Custom feedback is shown when clicking on hyperlinks (they turn yellow) and some buttons. Some tappable elements don't provide feedback (e.g. search results, section headers, images)
- iOS: we allow the default behavior to handle feedback. Any element in an <a> tag provides feedback in the same manner. Feedback is shown more comprehensively than on Android, but is unstyled.
Opportunity
We could come up with a more intentional approach to touch feedback, specifically:
- Which elements, when tapped, should provide feedback? Do we want to be more comprehensive than we currently are on Android?
- How should the styling of feedback differ for various elements (e.g. images vs. links)?
- How important is maintaining consistency between iOS and Android behavior?