Wednesday, December 5, 2018

interaction design - Should scrolling in a textbox overflow to scrolling a page?


When entering long sections of text into a textbox in a browser (such as when using gmail or a site like this) we can scroll within that textbox, which is as it should be.


However, the behaviour of that textbox scrolling changes without direct user input when we get to the extremes of the textbox. It changes from scrolling within the textbox to scrolling the page. The result is that you can't quickly scroll to the top or bottom of a textbox in a browser in the same way that you can scroll to the top or bottom of a screen in a browser.


You can see this in a recording of a textbox scroll overflow that I made.


I find this to be poor UX wise, but it seems to be applied universally in browsers. What is the reasoning behind it, and is there any research supporting this behaviour?



Answer




I was unable to find research that supports this, so if anyone knows of anything proving or disproving what I am about to assert, please feel free to add a comment.


My assumption on this behavior is that the rules of scrolling are hierarchical and the browser has a chain of "responders" that will receive the scroll message from the browser. When the browser scrolls, the event is messaged to the scrolling chain which is defined by the user's focus and then stepping outward through the DOM.


In this example, the first responder is the textbox. When it receives the scroll message, it will check its scroll position and increment/decrement accordingly. Unless it is at it's max/min, in which case it will pass the scroll message to it's parent scrollable object, until eventually that scroll message is received by the browser window's scroll bar.


Despite its faults (as evidenced in the question), allowing scrolling to scroll "out of" the initial container is better than the alternative, which is to only scroll within the focused element.


WHY this is actually good UX is that the average user is not going to understand the implicit hierarchy of scrolling, and could become "trapped" in a textbox.


The only way out would be to un-focus the textbox by clicking or tabbing off the element, which is not easily discoverable and I'm not sure what affordance one could give to indicate that unfocusing the element will allow full-page scrolling.


A hierarchy of scrolling, while problematic, does not constrict the user. The browser is taking a "you're the boss" approach in deferring to the user's scrolling which from a meta level is good UX.


Edited to add: However it might be nice to allow for CTRL+scroll or some other keyboard chord which a power user could use to limit scrolling to the focused element (the chord would restrict the scroll message to the focused element and prevent the message from being pushed up the tree if the element's scroll position is at max/min).


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...