Handling Touch and Mouse Inputs.
This approach worked well for me. It used progressive enhancement to build layers of functionality and polish. It worked well, that is, until touch.
Take the example of a component that revealed additional content on hover.1 All of the relevant functionality can be achieved with CSS, but the touch experience isn’t ideal. In iOS, a tap will trigger the hover state, but the user can’t un-hover and return to the original state.
We can no longer assume that devices have a single input.
- Let’s leave aside the question of if revealing content on hover is a good design pattern. Let’s assume there’s sufficient affordance to communicate the available interaction to the user. ↩