Firefox scrollbar doesn't use the "infinite size" usability effect

Bug #125734 reported by AleksanderAdamowski
8
Affects Status Importance Assigned to Milestone
firefox (Ubuntu)
Invalid
Undecided
Unassigned
gtk+2.0 (Ubuntu)
Invalid
Low
Ubuntu Desktop Bugs

Bug Description

Note that this is a regression - I'm pretty sure that previous versions of Ubuntu and/or Firefox had this right.

Description of the problem:

In user interface design (unfortunately not among mist Open Source developers ) it's a wide known fact that objects that are located at a screen edge are easier to target with the mouse - this is the main reason that MacOS menus are always at the top of the screen.

That's because you can simply slam the mouse pointer in the general direction of an edge or corner of the screen and it will stop at the edge - then you can interact with the object by clicking dragging and so on.

Locating UI objects at the edges of the screen is therefore a desired practice for most commonly used objects , so interacting with them takes less effort - it's a significant usability gain.

In firefox's vertical scrollbar context it means one can easily target the scrollbar and scroll the page without precisely targeting the scrollbar - one simply moves the mouse far to the right and it's on the scollbar then.

This hase definitely worked before. Now it doesn't - when I reach the screen edge, I have to retract the mouse at least one pixel back to the left to be able to drag the scollbar. It takes much more effort now and gives an uncomfortable feeling when I use Firefox. To be fair, Konqueror did never do this right, but there's a bug in their Bugzilla: https://bugs.kde.org/show_bug.cgi?id=96727

This effect is known as "mile high menu bar" or "infinite size widget". To quote some experts:

http://www.asktog.com/columns/022DesignedToGiveFitts.html

"Remember that Fitts' Law states that access time is a function of distance and target size. If the target size is larger, then the time is reduced. It is reduced for a simple reason: the user need not slow down when approaching the target for fear of overshooting.

Now consider the screen edge. How deep is the target? If it were really only the one pixel it appears, it would be very hard to hit. However, the screen edge is, for all practical purposes, infinitely deep. It doesn't matter how fast that mouse is going when it hits the screen edge, that pointer absolutely will not overshoot. Having to hit a pixel two pixels in from the screen edge takes much longer than hitting the edge itself. Use that edge. It is your friend."

http://www.joelonsoftware.com/uibook/chapters/fog0000000063.html

"When the Macintosh was new, Bruce "Tog" Tognazzini wrote a column in Apple's
developer magazine on UI. In his column, people wrote in with lots of interesting
UI design problems, which he discussed. These columns continue to this day on
his web site. They've also been collected and embellished in a couple of great
books, like Tog on Software Design, which is a lot of fun and a great introduction
to UI design. (Tog on Interface was even better, but it's out of print.)

Tog invented the concept of the mile high menu bar to explain why the menu bar
on the Macintosh, which is always glued to the top of the physical screen, is
so much easier to use than menu bars on Windows, which appear inside each application
window. When you want to point to the File menu on Windows, you have a target
about half an inch wide and a quarter of an inch high to acquire. You must move
and position the mouse fairly precisely in both the vertical and the horizontal
dimensions.

But on a Macintosh, you can slam the mouse up to the top of the screen, without
regard to how high you slam it, and it will stop at the physical edge of the
screen - the correct vertical position for using the menu. So, effectively,
you have a target that is still half an inch wide, but a mile high. Now you
only need to worry about positioning the cursor horizontally, not vertically,
so the task of clicking on a menu item is that much easier.

Based on this principle, Tog has a pop quiz: what are the five spots on the
screen that are easiest to acquire (point to) with the mouse? The answer: all
four corners of the screen (where you can literally slam the mouse over there
in one fell swoop without any pointing at all), plus, the current position of
the mouse, because it's already there."

Revision history for this message
Alexander Sack (asac) wrote :

this is not a firefox problem. Other GTK+ Application show this behaviour as well. Thus, I reassigned this bug to gtk+2.0.

Changed in firefox:
status: New → Invalid
Revision history for this message
Sebastien Bacher (seb128) wrote :

Thank you for your bug. What version of Ubuntu do you use? Are you running compiz?

Changed in gtk+2.0:
assignee: nobody → desktop-bugs
importance: Undecided → Low
status: New → Incomplete
Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

I'm running Kubuntu Feisty Fawn, without Compiz. Actually, I work in KDE.

Revision history for this message
Sebastien Bacher (seb128) wrote :

that's compiz bug #103306

Changed in gtk+2.0:
status: Incomplete → Invalid
Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

How can I test whether Compiz is enabled? I didn't enable it nor any effects.

Revision history for this message
Nick Welch (mackstann) wrote :

This has nothing to do with compiz. Firefox has an extra pixel of padding/border/whatever to the right of the scrollbar, which is the cause of the scrollbar not being right at the edge of the screen. I have never even had compiz installed and I've experienced this problem with Firefox for as long as I can remember on multiple Ubuntu machines.

Revision history for this message
Nick Welch (mackstann) wrote :

I just installed the "LittleFox" theme and the annoying 1px scrollbar padding is gone. The problem is in Firefox's default theme. This could be a dead simple CSS change for someone familiar with the chrome.

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

So this bug is neither invalid, nor a duplicate.

IMHO this is a perfectly valid issue that's fixable. Could someone please reopen it?

Revision history for this message
John Vivirito (gnomefreak) wrote :

This is not a firefox issue its a theme issue but i am unablet o reproduce this using firefox2 and 3 default themee. What version of Firefox is this on and can you please give step by step instructions on how to reproduce this? I am going to leave firefox as invalid since noone thinks its firefox except for people seeing this issue. I would like a reason to call this a firefox bug before we reopen firefox task.

Changed in firefox:
status: Invalid → Incomplete
status: Incomplete → Invalid
Revision history for this message
John Vivirito (gnomefreak) wrote :

Reopening this task since it does sound like a gtk issue.
AleksanderAdamowski,
when you say its fixible do you have a solution to this issue that will fix it or you just feel its fixable? Please feel free to help fix this issue or find out exactly what package is causing it but as for right now im gonna have to stay with gtk issue

Changed in gtk+2.0:
status: Invalid → Incomplete
Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

This seems to be an issue with the Firefox's default theme, to it should be fixable by a tweak to that theme. Probably a simple change in chrome's CSS as Nick Welch suggested.

When I install the Classic Compact theme (https://addons.mozilla.org/en-US/firefox/addon/3699) and its configurator (https://addons.mozilla.org/en-US/firefox/addon/6969), then configure Classic Compact to "Webpage window border: Disabled", then the scrollbar works fine at the edge of the screen.

This is on the current official Ubuntu Firefox 3 package for Hardy (firefox 3.0+nobinonly-0ubuntu0.8.04.1).

The Default theme shipped with this package still exhibits the problem.

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

John, it seems I was wrong and this is indeed a GTK issue.

I've unpacked chrome files shipped with firefox-3.0 Ubuntu package and tried to locate CSS border settings for main-window or browser or document, nothing significant was there.

Then I've noticed that the Firefox scrollbars correspond to the GTK theme's scrollbars, they are even updated in real time if I switch GTK styles.

So it seems that Ubuntu Firefox's default theme is closely integrated with GTK and it inherits GTK's problems. This would also explain why installing a different theme (like Nick Welch did) fixes the problem - 3rd party themes aren't integrated with GTK.

I've tried verifying it in a different GTK application or even some QT, but all apps I've tried have some ridiculous border added to the whole document area (I've tested gedit, abiword, gnumeric, gnucash, oowriter, oocalc, kedit, kword, konqueror). This is quite a problem, BTW, as this severely impacts usability of a large group of basic apps.

Do you know any well-behaving application (apart from Firefox) that doesn't create this useless border around its window that I could test with? Or maybe this is the problem with GTK itself, not those applications?

Revision history for this message
John Vivirito (gnomefreak) wrote : Re: [Bug 125734] Re: Firefox scrollbar doesn't use the "infinite size" usability effect

AleksanderAdamowski wrote:
> John, it seems I was wrong and this is indeed a GTK issue.
>
> I've unpacked chrome files shipped with firefox-3.0 Ubuntu package and
> tried to locate CSS border settings for main-window or browser or
> document, nothing significant was there.
>
> Then I've noticed that the Firefox scrollbars correspond to the GTK
> theme's scrollbars, they are even updated in real time if I switch GTK
> styles.
>
> So it seems that Ubuntu Firefox's default theme is closely integrated
> with GTK and it inherits GTK's problems. This would also explain why
> installing a different theme (like Nick Welch did) fixes the problem -
> 3rd party themes aren't integrated with GTK.
>
> I've tried verifying it in a different GTK application or even some QT,
> but all apps I've tried have some ridiculous border added to the whole
> document area (I've tested gedit, abiword, gnumeric, gnucash, oowriter,
> oocalc, kedit, kword, konqueror). This is quite a problem, BTW, as this
> severely impacts usability of a large group of basic apps.
>
kedit kword and konqueror dont use GTK. Your native desktop is kde# or
gnome or xfce?

> Do you know any well-behaving application (apart from Firefox) that
> doesn't create this useless border around its window that I could test
> with? Or maybe this is the problem with GTK itself, not those
> applications?
>
>
I cant say as i am unable to reproduce this here in gnome. However if
you see it in all those apps you may see it in any browser you use.
Ubuntu-Mozilla-Team can you please try to reproduce this, I am unable to.

--
Sincerely Yours,
    John Vivirito

https://launchpad.net/~gnomefreak
https://wiki.ubuntu.com/JohnVivirito
Linux User# 414246

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

Oops, after testing on a fresh Hardy installation I couldn't reproduce it with Ubuntu packaged Firefox 3 with default theme. It seems that something leftover in my Firefox profile is causing this.

But I've discovered that almost all GTK and QT applications suffer from this problem (yes, I've tested on my fresh installation of Hardy), which is very bad.

Should I report a new bug or change the purpose of this bug?

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

> kedit kword and konqueror dont use GTK. Your native desktop is kde# or
> gnome or xfce?

I've tested on 2 machines, one is my Kubuntu Hardy desktop which uses KDE natively, second one is a plain UbuntuHardy desktop with Gnome only.

On both of them I can see a ~2px - 3px thick border around the document area of most applications - plain text file editors, spreadsheets, etc. Both KDE and Gnome equivalents (Kword on Kubuntu - Abiword on Gnome, Kedit - Gedit, etc.).

Interesting exception - Kspread doesn't exhibit this problem, it has no border and the scrollbar can be easily grabbed by moving the pointer to the extreme right, to the edge of the screen.
Gnumeric on the other hand has the border, OOcalc too.

The style settings on Ubuntu are synchronized between KDE and Gnome so this mechanism (and one particular theme - I'm using Plastik) might be to blame on Kubuntu.

However, to my knowledge, nobody messed with the theme on the plain Ubuntu machine, which is a recently installed system shared by my cow orkers. It still exhibits this problem in GTK apps with the default Gnome theme (I suppose).

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

I think one should focus on the apps that behave correctly and see in which they differ from the rest - those apps are latest Firefox 3, KSpread, KPresenter.

Revision history for this message
AleksanderAdamowski (aadamowski) wrote :

I did a short clean room test.

On the same physical machine, I've launched Ubuntu 8.04 desktop i386 live CD and then Kubuntu 8.04 desktop i386 live CD.

On Kubuntu, after launching, I've installed Firefox using Adept since it isn't present by default.

The result is that Firefox in ordinary, Gnome-based Ubuntu doesn't have this problem and I can grab and more the vertical scrollbar's thumb after I move the mouse pointer to the extreme right side of the screen.

In Kubuntu, Firefox _has_ the problem - when I move mouse pointer to the right side, I cannot grab the scrollbar's thumb and I have to move the pointer at least one pixel to the left.

Assuming that this is the same Firefox binary (versions from both Kubuntu and Ubuntu live CDs show "Gecko/2008041514 Firefox/3.0b5"), it would indicate that Kubuntu's default theme is to blame.

But when I install and launch KSpread using Adept in Kubuntu orusing Synaptic in ordinary Ubuntu, it doesn't exhibit this problem at all! I can grab KSpread's vertical scrollbar's thumb at the edge of the screen without problems.

So maybe the problem is due to the Kubuntu's QT-GTK theme integration?

To summarize:

The same application (Firefox):
 * has the problem on Kubuntu
 * doesn't have the problem on Ubuntu

The same application (KSpread):
 * doesn't have the problem on Kubuntu
 * doesn't have the problem on Ubuntu

The only meaningful pattern I can see here is that Firefox, being a GTK app, on Kubuntu is under influence of QT-GTK theme integration mechanism which may be causing the problem.

Oh, BTW, all the other apps I've mentioned (Konqueror, Kedit, Gedit, Gnumeric, Abiword etc) seem to add the border around the document area and its scrollbars by themselves, regardless of desktop themes. So this is a widespread, but separate problem with many other desktop apps.

Revision history for this message
Nick Welch (mackstann) wrote :

Woohoo!

I've finally come up with the magic bit of CSS to work around this:

hbox#browser { margin-right: -1px !important; }

(to anyone reading this that isn't sure what to do with that, copy/paste it into ~/.mozilla/firefox/<your profile>/chrome/userChrome.css)

This may be not be the absolute most correct solution (I think some other element has a border/margin/padding of 1 where it should be 0, but I couldn't track it down), but it fixes the problem for me perfectly.

Revision history for this message
Sebastien Bacher (seb128) wrote :

that's not a gtk bug

Changed in gtk+2.0:
status: Incomplete → Invalid
Revision history for this message
Hans109h (hans109h) wrote :

Nick Welch, your soultion helped me out a lot, however I'm also having the same problem with Thunderbird. Any solution there?

To post a comment you must log in.
This report contains Public information  
Everyone can see this information.

Other bug subscribers

Remote bug watches

Bug watches keep track of this bug in other bug trackers.