3 ms·

> For designers accustomed to Mac environments but designing multi-platform web experiences, trying to make everyone happy in a way that doesn’t place a lot of

by alxlaz 7y ago

> For designers accustomed to Mac environments but designing multi-platform web experiences, trying to make everyone happy in a way that doesn’t place a lot of performance burden on the end user can be tricky. Well here's a recipe that, since the dawn of the GUI more than 30 years ago, has guaranteed the success of this endeavour: don't override anything that's provided by the platform. It's extremely easy to do in a web page, it requires absolutely no coding whatsoever. You don't need to do anything, and the result looks exactly as each users expects on their platform. It also places no performance burden. And it's guaranteed to make everyone happy -- except for people who are already unhappy with their platform, which you can't really help anyway. Can we please, please, PLEASE put an end to this endless, user-hostile masquerade? > Minimize the real estate that a scrollbar can occupy. Windows scrollbars are obtrusive and very wide by default. Wide and obtrusive? I'm not twenty anymore and my eyes definitely don't work as well as when I was twenty. I find them not wide at all, and definitely not obtrusive. So do many people my age or older. You know what sucks? Thin, subtly-colored, automatically-hidden scrollbars that obscure how much is left from the current page, are hard to see when they do pop up, are hard to find and click (you don't know where the scrollbar is going to pop up when you move your mouse to the edge of the window). * Points finger at GTK and shudders * > Respect changes to user preferences. If a user has selected non-default options for scrollbar behavior, respect those preferences when possible. Why "when possible"? Why not all the time? If a user has gone through the trouble of configuring a non-default setting for the scrollbars, an UI element that's taken for granted to the extent that many computer users don't even know its name, does anyone honestly think it's a good idea to override these settings sometimes? Why? What kind of information do you think you could present for the user, were it not for that pesky scrollbar?

phponpcp 7y ago
The point that they didn't raise is that scrollbars effect the size and position of things in the browser. Try setting 100vw on an element when you have obtrusive scrollbars, the result will be a page which now has horizontal scrolling, leading to terrible UX.
- chrismorgan 7y ago
  That’s because the vw and vh units are obtuse, being the full viewport dimensions inclusive of document element scrollbars, and there’s no workaround for that. (There used to be in Firefox, but when the dust settled and all the browsers decided to iron out their inconsistencies, they dropped Firefox’s behaviour as potentially surprising, despite it being the only sane thing out there, and haven’t talked much about making a unit that’s actually useful for this effect.) The effect of this is that the vw and vh units are pretty close to never the right thing. I have before used CSS Custom Properties to achieve a sane result, putting `:root { --scrollbar-width: 17px }` into the document based on a JavaScript calculation, with `--vw: calc(1vw - 0.01 * var(--scrollbar-width))`, so that then you can do `calc(50 * var(--vw))` and it’s like 50vw but sane. But this technique requires JavaScript, so I don’t consider it acceptable in all places.

by alxlaz 7y ago

phponpcp 7y ago

The point that they didn't raise is that scrollbars effect the size and position of things in the browser. Try setting 100vw on an element when you have obtrusive scrollbars, the result will be a page which now has horizontal scrolling, leading to terrible UX.

chrismorgan 7y ago
That’s because the vw and vh units are obtuse, being the full viewport dimensions inclusive of document element scrollbars, and there’s no workaround for that. (There used to be in Firefox, but when the dust settled and all the browsers decided to iron out their inconsistencies, they dropped Firefox’s behaviour as potentially surprising, despite it being the only sane thing out there, and haven’t talked much about making a unit that’s actually useful for this effect.) The effect of this is that the vw and vh units are pretty close to never the right thing. I have before used CSS Custom Properties to achieve a sane result, putting `:root { --scrollbar-width: 17px }` into the document based on a JavaScript calculation, with `--vw: calc(1vw - 0.01 * var(--scrollbar-width))`, so that then you can do `calc(50 * var(--vw))` and it’s like 50vw but sane. But this technique requires JavaScript, so I don’t consider it acceptable in all places.