Tuesday, July 30, 2019

android - iPad/iPhone alternative for hover states


I've recently updated my personal portfolio with some CSS3 and jQuery magic. I'm extremely pleased with the results and yes, it's fully responsive. But i have an issue. I've structured my portfolio items so that initially each item box has an overlay on it, when the user hovers over an item, the overlay shoots up and reveals content. This works well on a browser with a mouse.


Now, on an iPhone/iPad, visually the site looks great but obviously the user has no mouse and has no user-friendly hovering state. What is the most user-experienced conventional way to gracefully supply an alternative to "hover to reveal content".


Also, before someone says it, I am aware that the hover effects I have on my site serve no functionality but they just look nice. See here




Answer



There is no hover equivalent on iOS devices. The most conventional gesture to interact with content is 'tap'. You could have the content boxes open a pop-up or overlay on tap (which would work better on iPad than iPhone). Using other gestures which have no strong established convention could just confuse users. But it might just be more graceful and usable to put all of the content in plain sight.


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...