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

201–210 of 250 posts

Re: Don't use custom CSS scrollbars

#201

Post by pyrale »

411111111111111 wrote: post #143
pyrale wrote: post #137

Earlier quoted context omitted.

I believe the point is that if you're unhappy with the default scrollbar, you should get rid of it altogether rather than torture it into doing something it's not meant to do. Having done e.g. an endless scroll application, the scrollbar was unfit for our use, no matter what we did. The right solution was to remove scrollbar and implement our own scrolling mechanism.

Which is straight up what jmbwell was complaining about, as it breaks their workflow such as tapping on the top to scroll to the beginning and everything else they mentioned.

There is no beginning in the thing I was talking about. Which is why removing the scrollbar and breaking people's expectations in a way they can see/understand was better than trying to repurpose the scrollbar.

Re: Don't use custom CSS scrollbars

#202

Post by no_time »

tsimionescu wrote: post #118
jmbwell wrote: post #41

I recognize that web developers want full control over the user experience, usually to the point of reimplementing all of the native UI widgets provided by the user’s OS. As a user, I prefer for my OS to do things my OS does, including styling my widgets. My scrollbars, my scrolling behavior, window chrome, all of it… whether it’s good or bad or right or wrong, that’s between me and my OS. As a user, I hate when web…

First of all, the OS does not style widgets, the browser does. And scrollbars are completely different in different browsers - they have different sizes, different behavior, different look-and-feels. So either you create versions of your app which match each browser individually, or you re-style the scrollbars to look the same as the rest of the app. Thirdly, there is an obvious counter to your arguments that shows t…

>You wouldn't expect a game to use the system look-and-feel, it rightfully uses a look-and-feel that matches the game itself.

Oh yes I do.

https://store.steampowered.com/app/2008100

Re: Don't use custom CSS scrollbars

#203

Post by MrPatan »

zelphirkalt wrote: post #190
MrPatan wrote: post #173

Custom scrollbars, as in "I'll hijack the scroll events and draw custom stuff on the side of the element" kind of custom, yeah, that's bad and buggy and annoying. Being able to style native scrollbars is a godsend which satisfies designers and brand people and prevents the first kind of custom scrollbars.

What is the point of satisfying a designer? If they design a product for a customer, then the focus should be on satisfying the customer. If they design a product for themselves to use, OK fine, go ahead. But their expectations should not be pushed onto everyone else. A website is not a playground to try out ones figma crayons making ever more complex figma designs. One of the lessons in about every design course or…

What's possible with the medium, whether you like it or not, is a lot.

I understand where you're coming from, but it's not where most users come from. Leaving scrollbars or whatever else unstyled and sticking out like a sore thumb tells those users "they can't be bothered to do it right, but everybody else does".

That's the designer's point.

If you want to go back to '94 websites so your scrollbars and drop-downs don't look out of place, good luck.

Re: Don't use custom CSS scrollbars

#204

Post by post-it »

asutekku wrote: post #188
post-it wrote: post #72

Earlier quoted context omitted.

`overflow: hidden` hides the actual content. GP wants the element to be scrollable with a hidden scrollbar.

You can do that already with: section::-webkit-scrollbar{ display: none; }

It's non-standard: https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-s...

Re: Don't use custom CSS scrollbars

#205

Post by LeoNatan25 »

nailer wrote: post #167
411111111111111 wrote: post #159

Earlier quoted context omitted.

Yes, that's one of the features that break with endless scroll bars, which was what this whole discussion was about.

It works for every single app that has endless scroll bars on my entire history of using iOS. Try it on Reddit for example.

It breaks more often than it doesn’t. Yes, the page “scrolls”, but it scrolls only a few pixels, while the internal “custom” scrolling implementation doesn’t respond to the event and does not scroll to top, resulting in a terrible UX.

Re: Don't use custom CSS scrollbars

#206

Post by pyrale »

nailer wrote: post #167
411111111111111 wrote: post #159

Earlier quoted context omitted.

Yes, that's one of the features that break with endless scroll bars, which was what this whole discussion was about.

It works for every single app that has endless scroll bars on my entire history of using iOS. Try it on Reddit for example.

When you scroll on reddit, there is a beginning and no end.

Some applications have neither a beginning nor an end, so scrolling to the beginning makes no sense. At best, you could make "scroll to the beginning" get back to the start of your navigation, but then your scrollbar wouldn't let you go further.

(also if you have both horizontal and vertical scrolling, you're still left with no horizontal options)

Re: Don't use custom CSS scrollbars

#207

Post by Sophira »

jmbwell wrote: post #41

I recognize that web developers want full control over the user experience, usually to the point of reimplementing all of the native UI widgets provided by the user’s OS. As a user, I prefer for my OS to do things my OS does, including styling my widgets. My scrollbars, my scrolling behavior, window chrome, all of it… whether it’s good or bad or right or wrong, that’s between me and my OS. As a user, I hate when web…

The thing that I really don't get is that these designers must be users too. Would they be happy to use what they create? One assumes the answer would be yes, but I'm not sure.

Re: Don't use custom CSS scrollbars

#208

Post by cebsoto »

Favorite line in this entire article....sums up the thought very nice and answers the "why" when I have to explain why modify components is not a good idea.

Ambiguity means less certainty about what the piece of UI is, how you interact with it, and what effects taking action on it will cause. The more you deviate, the more confusing things get.

Re: Don't use custom CSS scrollbars

#209

Post by donkeybeer »

kristiandupont wrote: post #196
donkeybeer wrote: post #100

Earlier quoted context omitted.

Yes 100%, apps should follow the theme for components set by the user.

Would you then also force developers to stick with the very limited set of native components, or are they allowed to make custom ones?

Lets say a date picker was not supported in html, I'd at least prefer they made one aggregating native buttons instead of from scratch with colored divs/whatever.

Re: Don't use custom CSS scrollbars

#210

Post by Sophira »

tsimionescu wrote: post #118
jmbwell wrote: post #41

I recognize that web developers want full control over the user experience, usually to the point of reimplementing all of the native UI widgets provided by the user’s OS. As a user, I prefer for my OS to do things my OS does, including styling my widgets. My scrollbars, my scrolling behavior, window chrome, all of it… whether it’s good or bad or right or wrong, that’s between me and my OS. As a user, I hate when web…

First of all, the OS does not style widgets, the browser does. And scrollbars are completely different in different browsers - they have different sizes, different behavior, different look-and-feels. So either you create versions of your app which match each browser individually, or you re-style the scrollbars to look the same as the rest of the app. Thirdly, there is an obvious counter to your arguments that shows t…

The difference is that games are a deliberate exercise in non-productivity. You are generally not trying to 'get something done' in a game except what the game itself is asking you to do.

When using a webpage, you generally are trying to 'get something done'.

Besides, games implementing their own widgets can be terrible for accessibility.

Post reply on HN