Más de 40 botones sociales creados con CSS

Más de 40 botones sociales creados con CSS

Escrito por: Redacción    30 enero 2012     Comentario     1 minuto

Una buena manera de conseguir aligerar la carga de nuestra web se consigue suprimiendo imágenes innecesarias. Desde hace bastante tiempo existen muchas soluciones gratuitas en CSS para poder prescindir de bonotes que ocupen espacio y poder aprovechar la potencia que ofrecen los sprites de las hojas de estilo. Con la llegada de las redes sociales […]

Una buena manera de conseguir aligerar la carga de nuestra web se consigue suprimiendo imágenes innecesarias. Desde hace bastante tiempo existen muchas soluciones gratuitas en CSS para poder prescindir de bonotes que ocupen espacio y poder aprovechar la potencia que ofrecen los sprites de las hojas de estilo.

Con la llegada de las redes sociales toda la blogosfera se ha llenado de los conocidos botones sociales. Estos ofrecen una relación entre tu web y la red social favorita de tus visitantes. Desde botones de “Me gusta”, “+1” o “Twittear”, hasta los conocidos sistemas para iniciar sesión con una cuenta de una red social en nuestro blog. Esto supone no solo más JavaScript, sino también más imágenes que ralentizan la carga.

Gracias a Zocial podremos utilizar CSS para mostrar tanto iconos como botones con texto con el estilo de los servicios más populares. Google+, Facebook, Twitter, Paypal, Skype, Dropbox, LinkedIn, y así hasta más de 40 opciones distintas. Todas estas adaptadas al detalle, y lo que es más importante, con los archivos fuente para que podamos modificarlas a nuestro gusto y usarlas en nuestra web.

Por último, y no menos importante, todos los botonos son totalmente vectoriales gracias a la propiedad @font-face. Se trata de una función que existe desde CSS2, para embeber una tipografía personalizada con símbolos para así generar los íconos. O sea, todas las imágenes que necesitamos para nuestros íconos deberían ser convertidos a una tipografía, y hecho ésto no hay límites a las posibilidades de estilo que podemos aplicar a cada icono.

Más información | Web oficial
Vía | WRD


Deja un comentario

Parece que tienes habilitado AdBlock.

Te pedimos que lo deshabilites para
seguir disfrutando de contenido sin coste.