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.

We're retiring the forums!

The SilverStripe forums have passed their heyday. They'll stick around, but will be read only. We'd encourage you to get involved in the community via the following channels instead:

Archive /

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

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

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


Go to End


25 Posts   12446 Views

Avatar
elijahlofgren

Google Summer of Code Hacker, 222 Posts

20 June 2007 at 11:41am

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

Google Summer of Code Hacker, 76 Posts

20 June 2007 at 12:05pm

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

Avatar
Willr

Forum Moderator, 5523 Posts

20 June 2007 at 1:48pm

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

Google Summer of Code Hacker, 222 Posts

20 June 2007 at 2:35pm

> "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

Forum Moderator, 5523 Posts

20 June 2007 at 3:48pm

That looks like good idea.

Avatar
Sean

Forum Moderator, 922 Posts

20 June 2007 at 6:16pm

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

Google Summer of Code Hacker, 152 Posts

21 June 2007 at 2:06am

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

Google Summer of Code Hacker, 222 Posts

21 June 2007 at 3:17am

> 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