1005222 - reorder all items on the find toolbar

Status: NEW

(Toolkit :: Find Toolbar, defect, P5)

Description

[Peter van der Woude [:Peter6]]

Attachment: shot.png

the latest version of Find Toolbar needs reordering of items to improve usability

from left to right:
[X] (close) - bug 998364
[Highlight All]
[Match Case]
[input with prev-next arrow]
[n of n matches / Phrase not found]

see screenshot

[n of n matches / Phrase not found] needs to have same fontcolor as the other items (if needed I can file another bug for it)

Comment 1

[Sören Hentzschel]

I don't thin the buttons [Highlight All] and [Match All] should be to the left oft the search field, that looks weird and it's not a usability improvement (just my opinion).

Comment 2

[Sören Hentzschel]

Sorry, "I don't think…". Bugzilla needs an edit function.

Comment 3

[Peter van der Woude [:Peter6]]

(In reply to Sören Hentzschel from comment #1)
> I don't think the buttons [Highlight All] and [Match Case] should be to the
> left oft the search field, that looks weird and it's not a usability
> improvement (just my opinion).

I'll explain why.
[X] to the far left
- because it's pointless to have is that far away from the input.
- It requires unnecessary mouse/finger movement if you wish to close the Find Toolbar

[Highlight All] & [Match Case] to the right of [X]
- because the [X] is left it's logical to keep the [Highlight All] & [Match Case] there aswell,
- buttons should be grouped as everywhere in the firefox UI.

[input with prev-next arrow] to the right of the previous 3
- no need to explain, you have to leave it somewhere

[n of n matches / Phrase not found] to the right of the previous 4
- it's logic to have a result next to the query and it shouldn't require much eye movement to notice.
- there shouldn't be anything else but the result next to the query because otherwise you have to look
- for it amongst other items, which "costs to much time".
- the width of the phrase varies so you don't want anything floating right of it, if you would do that 
- these items would move with the changing length of [n of n matches / Phrase not found] which would
- look horrible

I'd prefer the the [Highlight All] & [Match Case] buttons to be replaced by icons to make it even sleeker, but that would be another bug.
e.g. 
underscored " A " in a greyed out colored box (the same color as used for the highlight itself) for  Highlight All
underscored " cC " in a greyed out box for Match Case
or whatever letters are to be used for the keyboard shortcuts. (see new mockup)

I haven't taken RTL in consideration, I'll leave that to the experts.

Comment 4

[Peter van der Woude [:Peter6]]

Attachment: mockup with icons.png

mockup with icons for buttons

Comment 5

[Luís Miguel [:quicksaver] (not reading bugmail)]

Personally, I would just revert bug 935519.

That bug didn't take into consideration that the find bar now has a results counter, I agree that these should be right next to the textbox (after the small next/previous arrows of course, but I'm counting these as part of the textbox).

I also think that the textbox should be all the way to the left. Of course that, for an experienced user of the find bar, its position doesn't really matter much, but here's what (I think) your reordered mockup says to a new user just discovering the find bar: "Ok, so to find something in this page, I need to set all these options first?" and he may spend a few unnecessary clicks until he figures out that wasn't needed at all; while with the textbox all the way to the left it says "So I just have to type here what I want to find? Cool. Oh and look, it has options, I probably don't need those though." (which is typically true).

Taking into account the new results counter, I'd revert 935519 and leave it at that, that way it seems just... more intuitive:
- Basic usage element: first thing in the bar (basic browser usage - type something in the location bar - placed first thing on the left by default)
- Directly relevant information: right next to it
- Occasionally needed options: grouped together
- Close button: on the far right, mimics OS and is grouped with the other "options" (except for OS X, and this is probably the only element I would - consider - moving to the left of the textbox at all)

In RTL I'd do the same but from the right rather than from the left.

And as for icons instead of text in the buttons, I disagree, although that's probably more of a personal taste than anything (shapes/colors in the find bar on the bottom, meh... I'd rather have it "cleaner"), plus there are add-ons for that.

Btw, CC'ing Tom because I'm "badmouthing" his work in bug 935519 and I think he should be able to defend himself. :)

Comment 6

[Mike de Boer [:mikedeboer]]

Comment on attachment 8416876 [details]
mockup with icons.png

Stephen, what do you think of this reordering? If you think the proposed order is not good enough yet, how do you think it should look like?

Comment 7

[Peter van der Woude [:Peter6]]

another option would be to have everything float-right
from left te right in the order
[n of n matches / Phrase not found] - [input with prev-next arrow] - [Highlight All] - [Match Case] - [X]

in which case I would guess the findbar could even be overlayed at the top of the page i/o at the bottom.

Comment 8

[Stephen Horlander [:shorlander]]

Comment on attachment 8416876 [details]
mockup with icons.png

This isn't something that we would want to do. We should keep the primary UI (finding things) left most and the secondary options after.