Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Archive

Our old forums are still available as a read-only archive.

Moderators: martimiz, Sean, biapar, Willr, Ingo, simon_w

Putting Icons on Action Buttons to make them more noticable: Good idea?


Go to End
Reply

25 Posts   11292 Views

Avatar
elijahlofgren

20 June 2007 at 11:41am Google Summer of Code Hacker, 222 Posts

I've been experimenting with various ways to fix Usability Issue #13 "Important Buttons Not Noticeable Enough": http://www.elijahlofgren.com/silverstripe/important-buttons-not-noticable-enough/

Do you think I should change the buttons to look like the "Regular Buttons with icons" screen shot shown in the link above?

I think using the default button style would be more usable. However, it might not be as ascetically please. But usability is more important, right. ;)

Eagerly awaiting your feedback,

Elijah :)

Avatar
laktek

20 June 2007 at 12:05pm Google Summer of Code Hacker, 76 Posts

Can't we continue with the current style with Button Icons ? I think that would be ascetically pleased and usable too.

Avatar
Willr

20 June 2007 at 1:48pm Forum Moderator, 5511 Posts

I think the current style is what would work best. Read this article on why icons dont work for navigations (well buttons in this case) http://www.smileycat.com/miaow/archives/000603.php. - I think the idea of icons is nice but that space could be better used. If you clutter that area up with icons it might get a bit busy and reduce readability.

I would keep it the same style but add a hover effect to the background. Eg on hover instead of the gray change it to a darker grey or a color perhaps??

Avatar
elijahlofgren

20 June 2007 at 2:35pm Google Summer of Code Hacker, 222 Posts

> "I think the current style is what would work best. Read this article on why
> icons dont work for navigations (well buttons in this case)
> http://www.smileycat.com/miaow/archives/000603.php. -

Ok, after reading that. I guess adding icons was a bad idea. Live and learn.

>> I would keep it the same style but add a hover effect to the background. Eg on hover instead of the gray change it to a darker grey or a color perhaps??

Ok, I'll experiment with hover effect, and probably a push button effect through use of input.submit:active. See: http://www.themaninblue.com/writing/perspective/2004/04/28/

Thanks for the feedback,

Elijah

Avatar
Willr

20 June 2007 at 3:48pm Forum Moderator, 5511 Posts

That looks like good idea.

Avatar
Sean

20 June 2007 at 6:16pm Forum Moderator, 921 Posts

In terms of IE, it adds a lot of padding to them action buttons which looks different to Firefox...

Elijah, it would be good to get this sorted out too - if you need any help, here's a good write up on it: http://jehiah.cz/archive/button-width-in-ie-revised

Cheers,
Sean

Avatar
Markus

21 June 2007 at 2:06am Google Summer of Code Hacker, 152 Posts

I think the problem of is not look of the buttons but the position.

I was searching them myself, I didn't expect them in the top right corner where normally only the minimize, maximize, and close buttons are.
I think it is nowadays common in every type of software to put buttons in the bottom right corner (just think about dialogs).

Alternatively I would suggest creating something like a toolbar below the header (left-aligned) like in all common applications.

Avatar
elijahlofgren

21 June 2007 at 3:17am Google Summer of Code Hacker, 222 Posts

> I think the problem of is not look of the buttons but the position.

> "I was searching them myself, I didn't expect them in the top right corner where normally only the minimize, maximize, and close buttons are.
I think it is nowadays common in every type of software to put buttons in the bottom right corner (just think about dialogs)."

Indeed, maybe moving the buttons would be a more complete fix for this usability issue.

The usability report's suggestion was:

"R: Alternatively consider moving them from within the menu bar to the top right of the editable portion of the window."

Sean, willr: What do you think?

Should the buttons be moved? If so, where?

Thanks,

Elijah

Go to Top