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

241–250 of 250 posts

Re: Don't use custom CSS scrollbars

#241

Post by MereInterest »

Sohcahtoa82 wrote: post #234
kristiandupont wrote: post #196

Earlier quoted context omitted.

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

They can make custom ones when a native one doesn't exist . There's literally no reason to write your own implementation of a drop-down menu. Zero. None. And yet, I occasionally run into a site where I need to enter my mailing address, and they have a drop-down menu to choose my state. In a native component, I can just tab to it, type "or", and Oregon (or OR if they're using the abbreviation) will be chosen, and I ca…

My best guess is that these abominations are made in order to adhere to some pre-made design that specified all the visual aspects without regard for the existing technology. If somebody gives you an export of a design made in Photoshop and says that you need to match it pixel for pixel, that design might not be readily implementable. Depending on the approvals needed, or the cost of hiring external designers, asking them to revisit the design in order to match the tech stack might be politically infeasible.

So instead of design being the intersection of form and function, design becomes entirely detached from the function.

Re: Don't use custom CSS scrollbars

#242

Post by Dracula707 »

so first about size is what 5 lines of css when most companies use react or any other framework. And every website has different theme, style, buttons, checkboxes so what let's don't use css at all then? and user can install extension that let them override css.

Re: Don't use custom CSS scrollbars

#243

Post by paulddraper »

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…

> As a user, I hate when web apps mess with scrolling.

To be clear, this articles talks about styling only.

Tbh, if you like native features of scrollbars, widgets, etc., the most practical way you'll get to keep them in 2023 will be if they can be custom styled.

Re: Don't use custom CSS scrollbars

#244

Post by circuit10 »

okanat wrote: post #27
circuit10 wrote: post #10

Earlier quoted context omitted.

It’s an Electron app in my case so there’s no browser chrome for it to fit into, and the scroll bar is also in the middle of dark-themed content: https://user-images.githubusercontent.com/13787163/161954436...

Since Electron can be considered the browser chrome itself, the developer can access to its lower level API to customize those things. You can also set the dark mode in CSS.

Why is that better than using CSS to theme the scrollbars as I’m doing now?

Re: Don't use custom CSS scrollbars

#246

Post by chiefalchemist »

tsimionescu wrote: post #221
chiefalchemist wrote: post #198

Earlier quoted context omitted.

> 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. Find me a user that sez "This experience sucks...that's the native scrollbar" and I'll give you $100. If you give me $1 for ever…

> p.s. Gaming is a different aesthetic, a different audience, etc. It's not what should be the user-centric internet. I don't think that games are an entirely different world from web apps. There is some amount of gradation between pure document-like pages at one extreme and games at the other, and a whole spectrum in between (say, an app like Google Earth probably doesn't need regular scroll bars to implement most o…

The technology is not the audience / culture.

Re: Don't use custom CSS scrollbars

#247

Post by noduerme »

zelphirkalt wrote: post #187
noduerme wrote: post #172

Earlier quoted context omitted.

It's very hard to actually write good UX from scratch, particularly stuff like scrollbars that require all sorts of relative resizing, drag listeners, velocity methods, second and tertiary controls (keyboards, drag-selection of text) and often need to handle those things after a variety of user interactions without redrawing their content or slowing anything down by constantly remeasuring the rest of the UI. Because…

I think in games reimplementing controls is done because of game engines having their own gaming-specific widgets or parts, which are not using the system's widgets themselves. Game creators will make use of the things available in the game engines.

Well like e.g. when I had to write UI elements into first iterations of Star Citizen, those were all in a 2D vector/sprite layer over the 3D world that had to be completely custom coded. Even the shape of the UI was pretty much completely open to interpretation. I have mad respect for people who write their own UI elements and "widgets" into games, given the restrictions that are often involved. Some do it better than others, but therein lies the art of observing and stealing from the best.

Re: Don't use custom CSS scrollbars

#248

Post by inetknght »

Sujeto wrote: post #232
inetknght wrote: post #45

Earlier quoted context omitted.

> I have an application that looks terrible if I don't make the scrollbar transparent. You have an application that works terrible if you make the scrollbar transparent. Transparent scrollbars are not intuitive.

There's a chat on the left side, right side shows media. If I allow scrollbars to render normally the whole site is split in 2, in the middle being a scrollbar, which looks bad especially if not overlay. I've considered not caring about it and just let the scrollbar, but it bothers me. It's my application anyway, the browser is not just a document reader anymore, it's an application framework (as well).

> If I allow scrollbars to render normally the whole site is split in 2, in the middle being a scrollbar, which looks bad especially if not overlay

Well that's your opinion. But I would rather see a scrollbar in the middle to show me that I can actually scroll something. Otherwise it's a hidden feature and hidden features are not features, they're bugs.

Re: Don't use custom CSS scrollbars

#249

Post by Sohcahtoa82 »

MereInterest wrote: post #241
Sohcahtoa82 wrote: post #234

Earlier quoted context omitted.

They can make custom ones when a native one doesn't exist . There's literally no reason to write your own implementation of a drop-down menu. Zero. None. And yet, I occasionally run into a site where I need to enter my mailing address, and they have a drop-down menu to choose my state. In a native component, I can just tab to it, type "or", and Oregon (or OR if they're using the abbreviation) will be chosen, and I ca…

My best guess is that these abominations are made in order to adhere to some pre-made design that specified all the visual aspects without regard for the existing technology. If somebody gives you an export of a design made in Photoshop and says that you need to match it pixel for pixel, that design might not be readily implementable. Depending on the approvals needed, or the cost of hiring external designers, asking…

They can use CSS to change the design.

It does not require the developer to completely rebuild the component behavior from scratch using JavaScript.

Re: Don't use custom CSS scrollbars

#250

Post by teel »

Funny to see this link here, just after I saw this site yesterday. I was forced to google how to disable custom scrollbars when I was reading the "A simple hash table in C" link from 2 days ago [1]. The site set the scrollbar width to 4 pixels which was so narrow I could just see it but couldn't grab it with mouse anymore. Totally unusable.

[1] https://news.ycombinator.com/item?id=36302552

Post reply on HN