Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Don't use custom CSS scrollbars

ericwbailey.website

Post reply on HN
Print view View original

91–100 of 250 posts

Re: Don't use custom CSS scrollbars

#91

Post by Pathogen-David »

kypro wrote: post #20
Minor49er wrote: post #2

On the contrary, we should be encouraging people to customize scrollbars so that scrolling is taken into consideration again. It can help get rid of trends like invisible/hidden scrollbars or those useless horizontal progress bars that shows how far into a page you've read

There's been an ongoing trend in UI design in recent years to assume more and more of the user. The removal of scrollbars from browsers confused my parents. Instead of having up and down arrows by your content now you're just expected to just know that you scroll with your mouse / trackpad. Similarly, modern versions of Windows will just assume you know that the four squares at the bottom of your screen is where you…

In general it feels like a lot of UI design these days is optimizing for looking pretty in screenshots and photos rather than being useful as a tool, it's honestly gotten really frustrating in recent years.

Re: Don't use custom CSS scrollbars

#92

Post by presentation »

derefr wrote: post #65
presentation wrote: post #57

One thing I didn’t expect was that for a large data table that allowed side scrolling, Windows users comfortable with Excel didn’t know that they could scroll side to side because the scroll bar fell below the fold. I ended up needing to measure the page to set the height of the table to make sure that the table wouldn’t be taller than the page. But what I really wanted was to sticky the scroll bar so that it was alw…

That's not so much "styling the scroll bar"; that's "trying to tell the OS widget library's metrics-policy logic its business, because you know better than it does, because it's insufficiently smart." If you think about it, a "smarter" OS widget library would always "float" scrollbars at the edge of the visible part of the viewport that the overflowing surface occupies. No configurability needed — it's just always be…

That's cool and all, but until I have enough influence personally to dictate Microsoft's design, I don't really have a choice but to depend on web APIs to achieve the desired effect.

Re: Don't use custom CSS scrollbars

#93

Post by TobyTheDog123 »

Not to be an asshole, but --- well, I guess I'll be an asshole.

This is good, thoroughly-researched advice with just enough condescension that I walked away from it kinda wanting to style my own CSS scrollbars.

Additionally, there's a comment on this post replying to someone with "You'll live" which really isn't helping the case presented in the article.

I won't, I don't have a good reason to, but I had a nice nostalgia trip to w3schools: https://www.w3schools.com/howto/howto_css_custom_scrollbar.a...

Re: Don't use custom CSS scrollbars

#94

Post by jbverschoor »

preommr wrote: post #21

> Don't use custom CSS scrollbars Alright, I guess I'll go back to using js scrollbars instead /s I hate articles like this because they present highly opinionated solutions as something definite even though it has a narrow focus on what the author cares about. Web apps can be incredibly powerful and convenient, sometimes a scrollbar is in the middle of the page like with that codepen. In those situations, being able…

fwiw, I have enabled "always show scrollbars" on macOS, and I frequently use them on my iPhone too.

One of the most frustrating thing on the web is capturing any scrolling behavior, or catching conflicting keystrokes (such as cmd-f on some fora).

Re: Don't use custom CSS scrollbars

#95

Post by friendzis »

fbrchps wrote: post #31
abhibeckert wrote: post #25

Earlier quoted context omitted.

> being able to style and control the width of the scrollbar is useful No it's not. I have operating system wide settings for how scroll bars should work and the rules are complex with visibility and size of the scroll bar changing from one second to the next. I expect my scroll bar settings to apply to all websites and they are significantly better than what codepen does. Codepen also doesn't allow me to scroll past…

> highly opinionated solutions as something definite even though it has a narrow focus on what the author cares about Most users either don't have such strong opinions about their scroll bars, or would prefer it looks coherent with the application, or OS-native (your preference). But I can almost guarantee the larger group of non-technical users will have never thought about the styling of their scrollbars for more t…

> But I can almost guarantee the larger group of non-technical users will have never thought about the styling of their scrollbars for more than a few seconds.

So you argument in favor of breaking the UIs of the non-technical users - who don't know that it is not their computer working wrong, but rather the site operator deliberately making things inaccessible - is users don't know that it is you breaking things? Sounds rather horrible.

Re: Don't use custom CSS scrollbars

#96

Post by pickingdinner »

eviks wrote: post #85

> There’s no visual indication that there’s more content present in this window—the only way to discover it is to scroll downwards. However, without an affordance to indicate the presence of additional offscreen content, the chances are low that someone will bother to check. > This is why Apple introduced a preference to always show scroll bars. But the proper solution is to add the info/affordance in that specific i…

I was under the impression "scrollbar = more to see" has been somewhat of a standard for a while now. The Mac example is just one of those classic UI fails.

The worst are the pages where the scroll wheel doesn't work, even when you can see the scrollbar just fine. I'm always baffled, since no simple page would have that problem. Clearly they developed it and didn't care for breaking it.

In html I would sometimes force the scrollbar to always show to prevent layout stuttering. But otherwise, changing the color of the scrollbar to match the fg and bg colors of the page shouldn't be too big of a deal. And I wouldn't mind if some browser skins would change the default scrollbar colors to match, either.

Scrollbars are already stylized across the web and across programs. Most users don't mind it. With options come the bad choices, which anyone can list on one page.

Re: Don't use custom CSS scrollbars

#97

Post by jchw »

preommr wrote: post #21

> Don't use custom CSS scrollbars Alright, I guess I'll go back to using js scrollbars instead /s I hate articles like this because they present highly opinionated solutions as something definite even though it has a narrow focus on what the author cares about. Web apps can be incredibly powerful and convenient, sometimes a scrollbar is in the middle of the page like with that codepen. In those situations, being able…

My kneejerk response to articles with these sorts of titles is nearly always just, "No thanks."

I know "considered harmful" has become a cliche, but I almost miss that format now.

Re: Don't use custom CSS scrollbars

#98

Post by chrismorgan »

gwern wrote: post #53

> When you style things on the web, you get control over almost the entire experience. From ten thousand feet up, your scope of concern is this: The mockup scrollbar looks nothing like scrollbars are now. > Do you need to make someone download that extra data? > > Spoilers: you don’t. Scrollbars work without CSS. No, they don't, because web browsers have been busy removing scrollbars as much as possible . As I type t…

> As I type this, there is no scrollbar on my screen because Firefox no longer does that.

If you’re using Linux: blame GNOME for this; in GTK 3 and 4, they actively removed your ability to get non-overlay scrollbars without each individual app manually supporting the concept. So there’s no global switch or anything like on macOS or Windows. Firefox has a setting “Always show scrollbars”, but precious little other GTK software will support non-overlay scrollbars in any way.

Re: Don't use custom CSS scrollbars

#99

Post by jojobas »

MereInterest wrote: post #32
abhibeckert wrote: post #25

Earlier quoted context omitted.

> being able to style and control the width of the scrollbar is useful No it's not. I have operating system wide settings for how scroll bars should work and the rules are complex with visibility and size of the scroll bar changing from one second to the next. I expect my scroll bar settings to apply to all websites and they are significantly better than what codepen does. Codepen also doesn't allow me to scroll past…

Or to phrase it a different way: Being able to style and control the width of the scrollbar is so incredibly useful that it must be in the hands of users, and not designers.

Would you extend that to buttons, text fields and all other components in general?

I'd say default should be whatever the web designer wanted, if you're not agree you can always use one of the overrider plugins.

Re: Don't use custom CSS scrollbars

#100

Post by donkeybeer »

jojobas wrote: post #99
MereInterest wrote: post #32

Earlier quoted context omitted.

Or to phrase it a different way: Being able to style and control the width of the scrollbar is so incredibly useful that it must be in the hands of users, and not designers.

Would you extend that to buttons, text fields and all other components in general? I'd say default should be whatever the web designer wanted, if you're not agree you can always use one of the overrider plugins.

Yes 100%, apps should follow the theme for components set by the user.
Post reply on HN