

CSS3 Social Sign-in Buttons - necolas
http://nicolasgallagher.com/lab/css3-social-signin-buttons/

======
rplnt
I don't think it's a good idea (I think it's opposite of that) to use not yet
closed parts of css3 specification in production. I mean, it's ok as long as
it works without it. This code is full of vendor specific prefixes. They only
add in size and many of them doesn't have reliable fallback.

Also, these buttons look close to horrible (as in unreadable) in browsers that
doesn't support all features used. I only tried quite capable Konqueror but
I'm affraid what would they look like in IE7. Another thing is that this is
16kB (uncompressed). 16kB for social sharing buttons that doesn't really stand
out that much (as opposed to css(2)-styled buttons) and add no extra
functionality to the user.

So, please, think twice before using them.

~~~
necolas
There are fallbacks in place for all the gradients. They look fine in IE7. The
compressed size of the code is more relevant than uncompressed.

~~~
rplnt
Then, I would change Yahoo one and Github - <http://i.imgur.com/HRN0f.png>
(I'm hovering over the github one). Google doesn't look so well either.

------
adamstac
These are nice, but you should also check these out as well
<https://github.com/adamstac/zocial> ... homepage here:
<http://zocialbuttons.com/> ... there are MANY
[https://github.com/adamstac/zocial/blob/master/stylesheets/p...](https://github.com/adamstac/zocial/blob/master/stylesheets/partials/_mixins.sass)

~~~
NickKampe
Thank you for sharing this, much better solution!

------
necolas
For Facebook, Twitter, GitHub, Google, Yahoo!, Windows Live ID, OpenID.

Includes icons and two sizes of button.

This code formed the basis of the sign-in buttons I used on this UK deal-
sharing website: <http://www.oodeals.co.uk/login>

~~~
alexchamberlain
I don't often tweet blogs, but have done today. These buttons are beautiful.

Not entirely sure about the Google one - doesn't look quite as good as the
others...

~~~
necolas
I was aiming to mimic any existing native sign-in or UI buttons styles for the
service in the hope of providing some visual familiarity for visitors who have
experience with any particular provider.

The Google one borrows from their new button styles and their flat-color
favicon...but it could possibly be improved. Open to design suggestions.
Thanks!

------
kevinwmerritt
These are great! I'm looking for a good foursquare button as well.

------
NickKampe
Why are they all sized differently if they have standard sizes?

