7 ms·
There's a UX problem on mobile. I have to click on something to make the GIF appear. What do I click? A link. Expected behavior of a link is to link me elsewher
by ichydkrsrnae 5y ago
There's a UX problem on mobile. I have to click on something to make the GIF appear. What do I click? A link. Expected behavior of a link is to link me elsewhere, not to show a pop-up GIF, so I'm immediately confused when that happens. I also can't figure out how to make the link actually link. Does it link anywhere? Is it even a link or just Jscript onClick thingy? Do I have to click on the GIF to make it link, because that's 2 clicks when precisely one is accepted link practice. Clicking to engage and then clicking again to disappear is super aggravating, especially on mobile screen, especially on such a long list. Click, click, click, click, click click, click, click. Ahhhh!
This works well if I can hover over the links with a mouse to engage the pop-ups, which then disappear when I hover away. If I have to click on the links, like you do on mobile, then click again to dismiss, neither click actually linking to anything, it fails UX.
Also, too much info in too small a space on mobile. Too much being communicated. Too dense. What UX test calls engineeritis. You need drill down pages for these links. If I click one, I expect a page with detailed information, a drill down, not a pop-up summary GIF.
Mixed UX metaphors. Not lethal, but not quite there yet. Very cool, though, especially for the rapidity with which you were able to implement it, but it needs a bit more test on the UX side on mobile.
A button toggle that displays a responsive, inline GIF as a drop-down, not pop-up, is perhaps the better solution, even if it's not quite as neat as what your creativity created. That would work as expected without damaging your intent, but that still involves click click click.
- dheera 5y agoAlso, use WebM, not GIF, for better compression. GIF is obsolete trash from the 1990's internet. You can have a GIF fallback but 99% of browsers don't need it.
- pineconewarrior 5y agowell... 99% perhaps not. mobile safari is pretty important
- kevin_thibedeau 5y agoIt should be an accordion that opens a detail view.
- svdr 5y agoI like it more when items stay opened, instead of closing again when another item opens (like with an accordion).
- ichydkrsrnae 5y agoI'm chuckling at this because, every time I've launched a broadside against onHover, a crafty developer replies with an accordion. You sly dogs.
- pyronite 5y ago> There's a UX problem on mobile. I have to click on something to make the GIF appear. What do I click? A link. Expected behavior of a link is to link me elsewhere, not to show a pop-up GIF, so I'm immediately confused when that happens. The underlines being dotted, it's closer to an <abbr> element (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/abbr https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ab...), which does not act as a link.
- ichydkrsrnae 5y agoI'm staring at this conclusion with the most bemused expression on my face. I'm thinking of the lines painted on the highway, wondering what tragedies would result if yellow line, white line, dotted line, and solid line were similarly ambiguous.
- k1t 5y agoSometimes liberties are taken here, such as California originally separating carpool lanes with yellow lines (when they should have been white). Presumably they felt that even though yellow was incorrect, it sent a clearer "do not cross" message to drivers. They were later ordered to change them to white.
- deleted 5y ago[deleted]
- matt-attack 5y agoI noticed that change recently and assumed it was motivated by Tesla. There are certain things we all take for granted when driving. A huge one that we probably don’t give much conscious thought to us this: How do we know if the lane to the left is ok to go in, or if it actually is for carrying oncoming traffic? You’d like to think that one way though not the only way, is to look for a double yellow line. As in, double yellows always separate opposing traffic so never cross them. In CA though, double yellow was also chosen to separate the carpool lane as OP mentioned. So there was actually a really mundane case where driving to the left of a double yellow was actually fine. Seems very confusing to an autonomous car that’s operating at the mental-level of an 18mo old.
- treis 5y ago>Mixed UX metaphors. Not lethal, but not quite there yet. Very cool, though, especially for the rapidity with which you were able to implement it, but it needs a bit more test on the UX side on mobile. It's definitely a good idea but agree that it's just a bit off. The videos are small and hard to see and there's no way to share a direct link to a video.
- leephillips 5y agoThe page is a disaster on a desktop, too. It does something weird to the scroll, so I can't use either my arrow keys or my Vimium keys in the normal way. Note to web authors: I'm sure I'm not the only one who left quickly after I saw that my scroll was hijacked. If you want people to read your stuff, try dialing back the user abuse.
- mahdi7d1 5y agoI was surprised when my arrow keys didn't work properly. Now I see you had the same issue. Using an old laptop, I'm often navigating through pages with keyboard track-pad on these old laptops is trash.
- marcosdumay 5y agoI endured the hijacked scroll because I was curious about what he meant. It looks like a good idea, but in a very user-hostile interface, what wasn't surprising at all. If I had to guess, the author is honestly trying to increase his site's usability by overriding the default behavior, he is just failing spectacularly.
- deleted 5y ago[deleted]
- GuB-42 5y agoIt reminds me that we don't see "floating" touchscreens anymore. The Galaxy S5, and probably other phones had this feature where you could actually trigger hover targets by hovering your finger above the screen. I just tried it on my Galaxy S5 the linked page and it works flawlessly. It may be one of the gimmicks Samsung loved to put in their phones at the time, but as we can see, it is not completely useless. And it also doesn't look like there is any downside to it, except maybe a very small increase in price.
- ichydkrsrnae 5y agoonHover has always been a psuedoschizo decision. There are places where nothing is more useful, but misuse it and it aggravates the hell out of everyone, not unlike browser frames/iframes/etc 20 years ago.
- Minor49er 5y agoWhat is a "psuedoschizo" decision?
- ichydkrsrnae 5y agoA conflicting decision. Please ignore the word, my brain made it up.
- metafunctor 5y agoMake your next one a coffee?
- fuzzer37 5y agoAlmost schizophrenic. Made sense to me.
- Minor49er 5y agoOk, so how is something being misused "almost schizophrenic"?
- vadfa 5y agoNavigating on mobile is something you do on the go, when there are no other options. Of course it's going to be a downgraded experience.
- ichydkrsrnae 5y agoIs it? Mobile devices drove 61% of visits to U.S. websites in 2020, up from 57% in 2019. Desktops were responsible for 35.7% of all visits in 2020, and tablets drove the remaining 3.3% of visitors. Globally, 68.1% of all website visits in 2020 came from mobile devices—an increase from 63.3% in 2019. Desktops drove 28.9% of visits, while 3.1% of visitors came from tablets. However, desktop devices remain very important, as they drove 53.3% of total time on site in the U.S. and 46.4% of total time on site globally. https://www.perficient.com/insights/research-hub/mobile-vs-desktop-usage https://www.perficient.com/insights/research-hub/mobile-vs-d...
- jonahx 5y agoPoint taken about making it clearer it's a popup rather than a link but... > You need drill down pages for these links. If I click one, I expect a page with detailed information, a drill down, not a pop-up summary GIF. I disagree here and much prefer browsing the summary information with a gif to having to click through every single feature into a new page.
- ichydkrsrnae 5y agoYes, I am rather stuck on the use of that link as a link-button. I argued furiously against them back in the day and, obviously, lost.
- jjeaff 5y ago>Expected behavior of a link is to link me elsewhere That may be true, but I certainly wasn't confused when I tapped it and saw the popup. On mobile, you could make the popup take up the whole screen with an easy X button and perhaps it would solve that issue (Minor as it may be)
- deleted 5y ago[deleted]
- tempestn 5y agoThere's somewhat of a convention to use a dashed underline on links that have behaviour like this; perhaps that would be an improvement.
- Aeolun 5y agoEither it’s fixed, or it was never a problem to me. The dotted lines indicate ‘click here to see more’ to me. And I can go directly from one to the next item by just tapping the next one.
- deleted 5y ago[deleted]
- trungdq88 5y agoSite author here. Thanks for the feedback! I just pushed an update to improve the UX on mobile :) https://twitter.com/tdinh_me/status/1465898179971350528 https://twitter.com/tdinh_me/status/1465898179971350528