almost identical to the particletree buttons from almost 4(!) years ago http://particletree.com/features/rediscovering-the-button-el...
Use Google+ to Improve Your UI
21–30 of 46 posts
Re: Use Google+ to Improve Your UI
#22One interesting difference: Google just uses for their buttons instead of tags or even . They also don't set cursor: pointer (the hand) for them. Any UI people want to comment on the best practice for cursor styles? I always figured pointer should be used for all buttons or links that have an action attached.
This is absolutely terrible for accessibility. Screen readers will not handle these buttons properly leading to a significantly more difficult experience. James Edwards actually talked about this at The Highland Fling conference a few weeks back.
Good point on accessibility. Anyone have links to making your UI accessible (including buttons)?
Re: Use Google+ to Improve Your UI
#23It looks pretty nice but the use of background gradients is inconsistent. The buttons with a background image have no gradient but the other buttons do.
Nice catch. Know of an easy workaround to this?
Nope, I don't think there are any (the CSS3 workarounds can be tricky with custom padding/margin). Google consistently uses nested elements and I think for the next few years that's the only solution that's going to work well cross-browser.
Re: Use Google+ to Improve Your UI
#24One interesting difference: Google just uses for their buttons instead of tags or even . They also don't set cursor: pointer (the hand) for them. Any UI people want to comment on the best practice for cursor styles? I always figured pointer should be used for all buttons or links that have an action attached.
Yes, use pointer. I don't know why G doesn't, but that is not good practice. There should be a visual indication that an object can be clicked, other than a highlighted border.
Re: Use Google+ to Improve Your UI
#25No, no, no! Please don't let GMail and G+'s new look become a new fad. The white space around every element is very wasteful and obnoxious. Not everyone has huge resolutions and those that do don't appreciate having to scroll several times just to see past the first 4 or 5 entries in a list view.
Okay, thanks. I was just about to write the exact same thing (although I may have been more dramatic complaining about the huge amount of unnecessary white space that fills my small netbook screen).
The new buttons however are quite nice and simple. There should be a hint of 3D though, to make them feel more "press-able". Other than that, I am okay with them becoming wide spread on the web, just don't surround them with so much wasted space.
Re: Use Google+ to Improve Your UI
#26These look good to me (apart from the previously mentioned issue of not actually using tags or similar), but where's the license on these? Neither the site nor the download includes any license information.
Re: Use Google+ to Improve Your UI
#27No, no, no! Please don't let GMail and G+'s new look become a new fad. The white space around every element is very wasteful and obnoxious. Not everyone has huge resolutions and those that do don't appreciate having to scroll several times just to see past the first 4 or 5 entries in a list view.
Okay, thanks. I was just about to write the exact same thing (although I may have been more dramatic complaining about the huge amount of unnecessary white space that fills my small netbook screen). The new buttons however are quite nice and simple. There should be a hint of 3D though, to make them feel more "press-able". Other than that, I am okay with them becoming wide spread on the web, just don't surround them w…
I wrote a userscript that dials down the whitespace, if anyone's interested: http://userscripts.org/scripts/show/105891
Re: Use Google+ to Improve Your UI
#28Is it me, or does this theme look similar to jQueryUI?
In what way? The sites don't look similar, and neither do their buttons.
Re: Use Google+ to Improve Your UI
#29One interesting difference: Google just uses for their buttons instead of tags or even . They also don't set cursor: pointer (the hand) for them. Any UI people want to comment on the best practice for cursor styles? I always figured pointer should be used for all buttons or links that have an action attached.
This is absolutely terrible for accessibility. Screen readers will not handle these buttons properly leading to a significantly more difficult experience. James Edwards actually talked about this at The Highland Fling conference a few weeks back.
The Google buttons do use the ARIA role="button" attribute, which should let them work in screen readers.
Re: Use Google+ to Improve Your UI
#30Well done. Backpacking an existing fad to get visibility from early adopters on your project. Case study in excellent blog-marketing.
Thanks for the buttons too~