Hovertime

Among the core principles of Interaction Design is the feedback principle. You know how important it is when a design violates it. The touch interface of the mobile payment terminal at my local coffee shop comes to my mind. How many times did I hit a button twice, unsure whether the first tap registered? There is no sound or visual cue that confirms the action. The screen remains unchanged, until after a delay, it finally shows the success message. It’s confusing and unreliable. The device also feels slow.

The fix is to add immediate visual (and audible) feedback. The buttons should highlight on touch. The screen should change without delay to a success, failure, or progress message. I should receive feedback at any time, never guessing whether the system completes a task, encounteres an error, or still runs a process.

Immediate feedback makes an application feel faster — even if it runs a blocking process, like exchanging data.

“Feel” is the key word here. I could expand on this topic and talk about the animated progress bar trick (clever), skeletons (spooky), or other strategies to increase perceived performance . But for clarity, I decided to focus on a very basic thing: the good old hyperlink.

This most fundamental UI component from the internet era comes with built-in signaling and feedback. For discovery, it has a different color (blue by default) and an underline. To indicate interactivity, the cursor changes to a pointing hand when you hover over it. Not slowly morphing from one cursor shape into the other — the change happens immediately.

Since it became trivial, many people were tempted to add transitions everywhere on their websites, including text links. When visual feedback reveals through a transition, even a fast one, it adds delay.

Ironically, I often see teams put a lot of effort into optimizing the overall performance of their product — server-side compression, lightning fast CDNs, advanced caching — only to undermine perceived speed with poorly timed CSS transitions.

My attitude toward most design problems is “it depends”, but here I am somewhat radical: on pointing devices, you should always enable immediate visual feedback on hyperlinks.

UI transitions are not inherently bad, but they require careful application. On mouse-out, a subtle transition for certain interactive elements (links, menu items, sometimes buttons) can improve spatial orientation, similar to cursor trails (an accessibility feature in some operating systems). People also won’t miss cues on rapid cursor movement, as the visual feedback appears instantaniously.

It is also important to know when a delayed mouse-over feedback is the right choice. Think of anything that covers other elements as it appears, like tooltips and overlaying menus. When those otherwise useful things pop up unexpectedly, they can be annoying, even disorientating.

I focused on the hyperlink, but you can extend this as a general best practice. When UI transitions are applied carelessly, they make an interface feel slow. And who wants a slow interface?