4 ms·

I was reading through this, just laughing and laughing at how ridiculous it was that people in 2001 thought changing the color of the scroll bar was somehow imp

I was reading through this, just laughing and laughing at how ridiculous it was that people in 2001 thought changing the color of the scroll bar was somehow important or useful. I was all, "Hahah, people were very silly in 2001, and the web was a very silly place." Then, as the years crept ever forward, I began to realize this isn't a blast from the past...it's not like a discussion about the blink tag. It's a real thing that people still actually give a shit about 14 years later! My whole perspective on the thread changed. I'm just gonna say that I have never once, in my entire 20+ years of building things on the web, wanted to change the color of the browser scroll bar. Until I read this thread I wouldn't have even realized someone would want to change the scroll bar. It seems like such an odd thing to do, and I'm imagining it looking silly, like something out of a 2001 page design (but maybe it doesn't look silly when done well). But, I'm not a designer. Maybe I just don't get it. Either way, I use Firefox, and I do not care whether the scroll bar color can be changed. Edit: I don't mean to insult folks who do think this is a useful feature. I'm really just expressing my genuine surprise at the entire tone of the linked thread. I don't oppose inclusion of this feature, and lots of people have mentioned valid reasons why they want it. I will likely never truly understand it, or share that desire, but I'm certainly not gonna get scrappy about it. And, I probably wouldn't even notice, if it did become available in Firefox tomorrow.

bhouston 12y ago
We do find it useful on http://Clara.io http://Clara.io in the editor (you have to be logged in to see them) -- we have a complex UI and the standard thick scroll bar is ugly and much too large. So we thin them down and simplify the styling so that they fit more into the overall UI. It is a very pleasing difference.
- esrauch 12y ago
  This is just my one experience (and you certainly know better the needs of your own product) but you are gaining "that looks nice" in exchange for "this is harder to use because the target is smaller and harder to click".
  - NathanKP 12y ago
    The action of clicking the scrollbar is more of an edge case than a significant design cornerstone these days. Most people are going to be scrolling with a mouse wheel, or a two finger swipe on their touchpad, etc. Clicking and dragging a control is slower, and a fundamentally bad experience in the first place. The only practical purpose of the scrollbar in modern design is to serve as a visual indicator that an area can be scrolled, and to show location and scale. If you have a reasonably complicated web app there is a good chance you are going to need a scrolling view inside your page. You still need a scrollbar to show that the area can be scrolled, but using the default control styling looks really ugly.
    - regularfry 12y ago
      > Most people Really? Have you got any numbers for this, or are you actually saying "this is how I use it, and I presume most people are like me"? Because what you're saying simply isn't true for me. When I'm reading a long block of content, I'll often click the scroll thumb and keep it clicked, using either the mouse or trackpad (or trackball, for that matter) to seek proportionally through the page. You don't get that proportionality of motion with either the mouse wheel or the two-finger trackpad gestures which mimic it. The "most people" argument you're making is what leads to broken ideas like infinite scrolling, which appeals to one subset of the population who assume that everyone else uses their UI in precisely the same way that they do.
      - NathanKP 12y ago
        So given that you like to use the scrollbar in that matter which would you rather see: 1) A native scrollbar that is restyled to match the colors of the webpage it is in? 2) A janky web view with scrollbars hidden and then reimplemented in JS which doesn't function they way you want it to? Like it or not designers usually don't spend time on the subset of the audience that clicks and drags the scrollbar. They spend time drawing a pretty looking scrollbar. When it comes to the implementation personally I think it still better to have a scrollbar that functions the way you expect it to, even if it looks a little different, rather than ending up with many different reimplementations of the scrollbar by different programmers.
deleted 12y ago
[deleted]
thristian 12y ago
I'm not a designer either, but I can see their point of view: they're being paid to make a website internally consistent, and if they can't style scrollbars, then either they're stuck with a bland, vapid style that looks reasonable across all platforms, or they make something that's cool and awesome and makes their clients happy right up until the first scroll-bar appears, at which point it looks ridiculous (in particular, think about a <textarea> where you can style the border to match all your other form-fields, but not the scroll-bar, so you wind up with two visual styles pressed right up against one another). Being responsible for something you can't really control is frustrating for anyone, so I have a measure of sympathy for the designers who want stylable scrollbars.
dangrossman 12y ago
If you'd like to know what a custom CSS scrollbar looks like in practice, in 2015, log in to your Google Analytics account (I noticed you use it on your website) with Chrome. Not only do people want to change the scroll bar, but probably half the internet-using population sees custom scroll bars daily, since Google uses them heavily (Gmail, Docs, etc as well).
- dredmorbius 12y ago
  Google's screwing with scrollbars, especially, making them so damned tiny I cannot use them, is among the reasons I looked up how to style scrollbars -- so I could set my own local default style in a user stylesheet and override idiot Web designers (or their idiot clients) who think they know better than I do what I want. What I've ended up with is actually fairly close to the Mac OS X scrollbar, though I kind of got there by accident. And no, in general, I wouldn't impose this on other people on a site I built. Leave stock UI interfaces alone. http://codepen.io/dredmorbius/pen/azrmZW http://codepen.io/dredmorbius/pen/azrmZW
aptwebapps 12y ago
I don't think it's just the browser's scrollbars one the side, and sometimes the bottom, of the page. It's all scrollbars inside the page as well. They're traditionally considered part of the OS UI so are left alone. At the moment, people who really want to change the scrollbars internal to the page can replace them with js scrollbars.
vvpan 12y ago
So in 20+ years of building things you haven't worked with a designer who customized scroll-bars? It as if you haven't worked with a designer at all.
jsprogrammer 12y ago
I don't necessarily want to change the color (although, why not?), I mostly just want to change the width of the bar. Having a huge, fat, white and grey scroll-bar on an overflowed `div` right in the middle of my sleek, dark-themed site with integrated 3D (both CSS and WebGL) elements just sticks out more than a huge, swollen thumb. For now I've set `direction: rtl;` so that it blends into the left-side of the page and is hopefully overlooked by most people.
baby 12y ago
I'm surprised to see this point of view upvoted so much. If you browse the web through chrome you might not notice it because you can style the scrollbar in chrome. But if you scroll the same websites in Firefox (which is my main browser), those will stand out. It's not only the scrollbar of the page, it's also any scrollbar that you can see inside a iframe or a textarea or really any divs with overflow:scroll; If you think this is silly then you must think CSS and styling page is silly
- SwellJoe 12y ago
  I think it has to do with my approach to the web, and my preferences for web design. I like minimalism, generally speaking, and I like consistency. I think Google UIs are fine. But, I don't use Chrome, so I don't know what the difference is. Maybe it would be amazing with custom-styled scrollbars. But, I'm content with them looking like my native OS scrollbars (I use Linux/Gnome 3, so they are grey, flat, and slim; quite unobtrusive on any page, whether light or dark). I also tend to find most dark web designs (which is what a lot of these comments are talking about) just plain ugly. So, that's another factor. I've never made a dark website or web UI. All of this is opinion, of course. My opinion should probably matter less than someone that really cares a lot about it. I think it's silly because I think the way so many people approach web design is silly. Standardized UI components are not a bad thing. They are a very good thing. I like it when web pages look like they belong on my computer screen.
  - baby 12y ago
    > dark web designs It's not only dark web designs. Actually if you look at any native application on your OS you will see "styled" scrollbars. And that never shocked you because they are styled according to the app. > I like it when web pages look like they belong on my computer screen. This is what "view > page style > no style" is for. CSS was created to "style" page, and the scrollbar is part of the page. That you like CSS or not it seems silly to say that the scrollbar is the limit where you can style everything BUT the scroll bar on a page.
    - DanBC 12y ago
callmevlad 12y ago
I'm the guy who offered the bounty, and for us (webflow.com) it's not about styling scrollbars on ordinary websites - it's about making sure application user interfaces are consistent across browsers. Take a look at this comparison between Chrome and Firefox: https://cloudup.com/c8K9RMqPeDn https://cloudup.com/c8K9RMqPeDn Webkit's ability to style scrollbars gives app developers a ton more control over a user interface. Some advantages of Webkit over Firefox here: * Custom styling without hacky JavaScript "fake scroll" scripts * Control over the width of a scrollbar * Better usability for certain use cases by enabling Up and Down buttons * Scrollbars actually look like they belong inside the application * Doesn't remind users that they're in a web browser In my 15+ years of building websites, I never wanted to change the color of the browser scroll bar either. But now I'm building a website that builds websites, so it's a whole 'nother ball game :)
- SwellJoe 12y ago
  "Custom styling without hacky JavaScript "fake scroll" scripts" You've convinced me. I did have someone once send me a design patch that used a JavaScript scrolly implementation, and I found it repulsive on every level, and I immediately rolled back the change and made it clear we would never ship anything like that, ever. I'm glad you're in a position to motivate someone to implement it with cold hard cash, and I hope it works out.
- popnfreshspk 12y ago
  I question the necessity of having to make scroll bars consistent across browsers. Seeing as how most people only use one browser (data collected out of thin air), wouldn't changing the native styling on a browser scrollbar be confusing for people expecting the native styling?
  - callmevlad 12y ago
    Please take a look at the screenshot I posted: https://cloudup.com/c8K9RMqPeDn https://cloudup.com/c8K9RMqPeDn Assuming you were using Firefox, what would you think about those two white scrollbars that stick out like a sore thumb in a dark interface?
DanBC 12y ago
The web today is two things: a document delivery system; and an app delivery system. Sadly the two functions have merged and so people deliver their documents in their apps. It's incredibly restrictive and a step backwards. Content that would be fine with a bit of html and css and leave the browser to display it is now wrapped up in extra css and javascript just because PHBs and bad designers insist on pixel perfect cross browser design.
- dredmorbius 12y ago
  Actually, there are at least two more functions: 1. A media interface / playback system for audio/video content. 2. A commerce platform. Arguably, a communications platform for both realtime interactive and asynchronous messaging. Some of that probably arguably does belong in the browser, though much could go elsewhere. The problems that accompany this are not just the complexity you describe, but bloat, security nightmares, stability and interactivity issues, and more. I started calling for at least a 4-way split about a year ago, and I suspect it may emerge, though through simplified tools (likely eBook readers) acquiring more web-like capabilities. https://www.reddit.com/r/dredmorbius/comments/256lxu/tabbed_browsing_a_lousy_bandaid_over_poor_browser/ https://www.reddit.com/r/dredmorbius/comments/256lxu/tabbed_... The increasing tendency of browser vendors to incorporate Readability (or similar functionality) directly into their browsers seems to be one positive sign that there's an awareness of the problem.

bhouston 12y ago

We do find it useful on http://Clara.io http://Clara.io in the editor (you have to be logged in to see them) -- we have a complex UI and the standard thick scroll bar is ugly and much too large. So we thin them down and simplify the styling so that they fit more into the overall UI. It is a very pleasing difference.

esrauch 12y ago
This is just my one experience (and you certainly know better the needs of your own product) but you are gaining "that looks nice" in exchange for "this is harder to use because the target is smaller and harder to click".
- NathanKP 12y ago
  The action of clicking the scrollbar is more of an edge case than a significant design cornerstone these days. Most people are going to be scrolling with a mouse wheel, or a two finger swipe on their touchpad, etc. Clicking and dragging a control is slower, and a fundamentally bad experience in the first place. The only practical purpose of the scrollbar in modern design is to serve as a visual indicator that an area can be scrolled, and to show location and scale. If you have a reasonably complicated web app there is a good chance you are going to need a scrolling view inside your page. You still need a scrollbar to show that the area can be scrolled, but using the default control styling looks really ugly.
  - regularfry 12y ago
    > Most people Really? Have you got any numbers for this, or are you actually saying "this is how I use it, and I presume most people are like me"? Because what you're saying simply isn't true for me. When I'm reading a long block of content, I'll often click the scroll thumb and keep it clicked, using either the mouse or trackpad (or trackball, for that matter) to seek proportionally through the page. You don't get that proportionality of motion with either the mouse wheel or the two-finger trackpad gestures which mimic it. The "most people" argument you're making is what leads to broken ideas like infinite scrolling, which appeals to one subset of the population who assume that everyone else uses their UI in precisely the same way that they do.
    - NathanKP 12y ago
      So given that you like to use the scrollbar in that matter which would you rather see: 1) A native scrollbar that is restyled to match the colors of the webpage it is in? 2) A janky web view with scrollbars hidden and then reimplemented in JS which doesn't function they way you want it to? Like it or not designers usually don't spend time on the subset of the audience that clicks and drags the scrollbar. They spend time drawing a pretty looking scrollbar. When it comes to the implementation personally I think it still better to have a scrollbar that functions the way you expect it to, even if it looks a little different, rather than ending up with many different reimplementations of the scrollbar by different programmers.

deleted 12y ago

[deleted]

thristian 12y ago

I'm not a designer either, but I can see their point of view: they're being paid to make a website internally consistent, and if they can't style scrollbars, then either they're stuck with a bland, vapid style that looks reasonable across all platforms, or they make something that's cool and awesome and makes their clients happy right up until the first scroll-bar appears, at which point it looks ridiculous (in particular, think about a <textarea> where you can style the border to match all your other form-fields, but not the scroll-bar, so you wind up with two visual styles pressed right up against one another). Being responsible for something you can't really control is frustrating for anyone, so I have a measure of sympathy for the designers who want stylable scrollbars.

dangrossman 12y ago

If you'd like to know what a custom CSS scrollbar looks like in practice, in 2015, log in to your Google Analytics account (I noticed you use it on your website) with Chrome. Not only do people want to change the scroll bar, but probably half the internet-using population sees custom scroll bars daily, since Google uses them heavily (Gmail, Docs, etc as well).

dredmorbius 12y ago
Google's screwing with scrollbars, especially, making them so damned tiny I cannot use them, is among the reasons I looked up how to style scrollbars -- so I could set my own local default style in a user stylesheet and override idiot Web designers (or their idiot clients) who think they know better than I do what I want. What I've ended up with is actually fairly close to the Mac OS X scrollbar, though I kind of got there by accident. And no, in general, I wouldn't impose this on other people on a site I built. Leave stock UI interfaces alone. http://codepen.io/dredmorbius/pen/azrmZW http://codepen.io/dredmorbius/pen/azrmZW

aptwebapps 12y ago

I don't think it's just the browser's scrollbars one the side, and sometimes the bottom, of the page. It's all scrollbars inside the page as well. They're traditionally considered part of the OS UI so are left alone. At the moment, people who really want to change the scrollbars internal to the page can replace them with js scrollbars.

vvpan 12y ago

So in 20+ years of building things you haven't worked with a designer who customized scroll-bars? It as if you haven't worked with a designer at all.

jsprogrammer 12y ago

I don't necessarily want to change the color (although, why not?), I mostly just want to change the width of the bar. Having a huge, fat, white and grey scroll-bar on an overflowed `div` right in the middle of my sleek, dark-themed site with integrated 3D (both CSS and WebGL) elements just sticks out more than a huge, swollen thumb. For now I've set `direction: rtl;` so that it blends into the left-side of the page and is hopefully overlooked by most people.

baby 12y ago

I'm surprised to see this point of view upvoted so much. If you browse the web through chrome you might not notice it because you can style the scrollbar in chrome. But if you scroll the same websites in Firefox (which is my main browser), those will stand out. It's not only the scrollbar of the page, it's also any scrollbar that you can see inside a iframe or a textarea or really any divs with overflow:scroll; If you think this is silly then you must think CSS and styling page is silly

SwellJoe 12y ago
I think it has to do with my approach to the web, and my preferences for web design. I like minimalism, generally speaking, and I like consistency. I think Google UIs are fine. But, I don't use Chrome, so I don't know what the difference is. Maybe it would be amazing with custom-styled scrollbars. But, I'm content with them looking like my native OS scrollbars (I use Linux/Gnome 3, so they are grey, flat, and slim; quite unobtrusive on any page, whether light or dark). I also tend to find most dark web designs (which is what a lot of these comments are talking about) just plain ugly. So, that's another factor. I've never made a dark website or web UI. All of this is opinion, of course. My opinion should probably matter less than someone that really cares a lot about it. I think it's silly because I think the way so many people approach web design is silly. Standardized UI components are not a bad thing. They are a very good thing. I like it when web pages look like they belong on my computer screen.
- baby 12y ago
  > dark web designs It's not only dark web designs. Actually if you look at any native application on your OS you will see "styled" scrollbars. And that never shocked you because they are styled according to the app. > I like it when web pages look like they belong on my computer screen. This is what "view > page style > no style" is for. CSS was created to "style" page, and the scrollbar is part of the page. That you like CSS or not it seems silly to say that the scrollbar is the limit where you can style everything BUT the scroll bar on a page.
  - DanBC 12y ago

callmevlad 12y ago

I'm the guy who offered the bounty, and for us (webflow.com) it's not about styling scrollbars on ordinary websites - it's about making sure application user interfaces are consistent across browsers. Take a look at this comparison between Chrome and Firefox: https://cloudup.com/c8K9RMqPeDn https://cloudup.com/c8K9RMqPeDn Webkit's ability to style scrollbars gives app developers a ton more control over a user interface. Some advantages of Webkit over Firefox here: * Custom styling without hacky JavaScript "fake scroll" scripts * Control over the width of a scrollbar * Better usability for certain use cases by enabling Up and Down buttons * Scrollbars actually look like they belong inside the application * Doesn't remind users that they're in a web browser In my 15+ years of building websites, I never wanted to change the color of the browser scroll bar either. But now I'm building a website that builds websites, so it's a whole 'nother ball game :)

SwellJoe 12y ago
"Custom styling without hacky JavaScript "fake scroll" scripts" You've convinced me. I did have someone once send me a design patch that used a JavaScript scrolly implementation, and I found it repulsive on every level, and I immediately rolled back the change and made it clear we would never ship anything like that, ever. I'm glad you're in a position to motivate someone to implement it with cold hard cash, and I hope it works out.
popnfreshspk 12y ago
I question the necessity of having to make scroll bars consistent across browsers. Seeing as how most people only use one browser (data collected out of thin air), wouldn't changing the native styling on a browser scrollbar be confusing for people expecting the native styling?
- callmevlad 12y ago
  Please take a look at the screenshot I posted: https://cloudup.com/c8K9RMqPeDn https://cloudup.com/c8K9RMqPeDn Assuming you were using Firefox, what would you think about those two white scrollbars that stick out like a sore thumb in a dark interface?

DanBC 12y ago

The web today is two things: a document delivery system; and an app delivery system. Sadly the two functions have merged and so people deliver their documents in their apps. It's incredibly restrictive and a step backwards. Content that would be fine with a bit of html and css and leave the browser to display it is now wrapped up in extra css and javascript just because PHBs and bad designers insist on pixel perfect cross browser design.

dredmorbius 12y ago
Actually, there are at least two more functions: 1. A media interface / playback system for audio/video content. 2. A commerce platform. Arguably, a communications platform for both realtime interactive and asynchronous messaging. Some of that probably arguably does belong in the browser, though much could go elsewhere. The problems that accompany this are not just the complexity you describe, but bloat, security nightmares, stability and interactivity issues, and more. I started calling for at least a 4-way split about a year ago, and I suspect it may emerge, though through simplified tools (likely eBook readers) acquiring more web-like capabilities. https://www.reddit.com/r/dredmorbius/comments/256lxu/tabbed_browsing_a_lousy_bandaid_over_poor_browser/ https://www.reddit.com/r/dredmorbius/comments/256lxu/tabbed_... The increasing tendency of browser vendors to incorporate Readability (or similar functionality) directly into their browsers seems to be one positive sign that there's an awareness of the problem.