0

My website is made up of tabs that only have visual content, like a photo album in a grid. When opening each tab, in addition to the extensive vertically scrollable content, there is a close button in the upper right corner to return to the home page ❎. On desktop, it is not so problematic because with a simple mouse movement the visitor go back to the top and close it. But on mobile, the content is arranged in two columns, which makes it necessary to scroll down quite a bit to be able to view it completely. There is a fixed "back to top" button in the lower right corner ⬆️. To close the tab, the visitor must scroll up or click the ⬆️ button and then ❎, which implies two clicks to close a tab.

I don't know if I should set the close button fixed too, to avoid so much scrolling or clicking.

Update

  • Tabs are arranged vertically and take up the full width of the page
  • When opening a tab the content takes up the entire window, which is why there is a button to close the tab
  • The close button is fixed at the top of the content

The question is whether when scrolling the content down, the close button should always be visible in the top right corner of the screen instead of the content

tabs

2
  • Not sure why we need the close button in this context. If we have the scroll to top, wouldn't the users be able to click on home button or the site name directly or any other tab? Will the close button always land on home?
    – Ren
    Commented Oct 7 at 6:30
  • 1
    Question updated.-
    – Danielillo
    Commented Oct 7 at 7:13

1 Answer 1

2

Considering that there is a lot of content on every tab, it will be difficult for users to remember about the Close button after they have scrolled down to lower sections. For continuity, the page-title needs to be displayed as well. It is preferable to have them both visible at all times so that the users are not lost as well as have the option to exit whenever they want. What we can do is transition them to a smaller size once the user starts scrolling so that the bar does not occupy a whole lot of the screen on the top.

mobile view

User Control and Freedom: This paper cites an interesting case when the Close button is not visible on overlays.

When presented with an overlay or lightbox, users often get disoriented and think they are on a new page — especially where overlays take up the whole screen. Therefore, to return to the previous screen, users often use the browser’s Back button instead of tapping a Close link or X icon. This action has the effect of taking the user back two steps, rather than one, causing confusion and disorientation.

1
  • Coincidentally, this is exactly the solution I came up with and the one I've been coding until now.
    – Danielillo
    Commented Oct 7 at 17:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.