The control must not cover content or primary actions
Aliases: FAB covering content · floating scroll-top
What it is
Back to top almost always floats above content so it can be tapped at any depth. Occlusion is that control covering the sentence being read, the primary button being aimed at, or the bottom tab bar. The shortcut’s value appears only at long distance; the cover happens on every frame it is visible. The question is not whether the shortcut should exist. It is whether the pixels it occupies are currently doing work.
Why it happens
A floating control and the content fight over the same pixels. The lower-trailing corner is a thumb zone, and also where the last list item, a chat composer, a primary action, and the rightmost tab live. Put the shortcut there and hit rate is highest — and so is collision: a tap meant for Next or the last card fires a jump away. If the button fades in during scroll, it can appear under a finger that is already down, producing a jump the user did not initiate.
There is a reading cost too. A fixed opaque disc over a paragraph ending or a critical part of an image makes people lean aside to read, or conclude the content stops here. Transparency eases visual cover, not hit-box cover — the tap still belongs to the shortcut, not to the link underneath. Together with a tab bar, the two layers leave a seam that neither can be tapped reliably.
Where it stops holding
On a large desktop viewport with content centred and margins left over, parking the control in the margin can cover almost nothing. Reading mode and fullscreen media should drop it for a while. When the primary action is itself a floating button, the two must not share a corner: offset them, or decide which action is actually more frequent on this page. If accessibility focus order inserts this button between every block of content, keyboard users are stopped on every pass; occlusion moves from space into time.
Applying it
- Give the control a bay that does not overlap the primary action, the tab bar, or an input. On conflict, yield to the main task rather than shrinking the main button.
- Show it after scroll settles; do not insert it under a finger mid-scroll. Near a bottom primary action, dodge or hide.
- Do not let the hit box extend far beyond the visible glyph, or an invisible edge will eat neighbouring links.
- How to check: at a depth where the control is shown, tap the last content item, the primary button, and the rightmost tab ten times each, and count jumps to top. Then see whether it covers a last sentence or a critical number. Accidental jumps, or having to move it to read, mean occlusion holds.