Social Media sites like digg and delicious have become of great importance for the traffic of a blog. Everyone wants to be dugg so every blogger adds social media buttons to their blog. But sometimes it’s very boring, all those standard ’share this’ and ‘digg’ widgets on every page. Luckily there are some designers who melted the social media links into their design. 29 creative examples:
1. CSSGlobe
Icons for Digg, StumbleUpon, Reddit and DesignFloat. Unobtrusive and stylish.
2. Snook
These two buttons got a nice place in the article footer. The ma.gnolia icon fits great with the green colour.
3. Webdesigner Wall
The social media buttons are placed well and fit great in the design. The handdrawn ‘Digger’ makes the standard digg widget a great design element.
4. Woork
Woork has an ‘Add to delicious’ button in a nice, handwritten font combined with a speech bubble with the count. The compact digg button is more standard, but it looks good in this lay-out.
5. Ars Technica
Ars Technica uses a nice homemade digg button with counter.
6. I Can Has Cheeseburger
A few cartoony buttons in a own style. Very creative!
7. I love Typography
Four small black and white buttons with smooth rounded corners. Nonobstrusive and stylish.
8. Noupe
Noupe uses three small icons. The look good, but it bothers me a bit that they aren’t transparent.
9. Lifehacker
A few really small social icons.
10. Problogger
The icons themself are not special, but the list fits great in the columned design of the article footer.
Other Examples:
The Trend
The most common place for the social media buttons is the footer. However, some designers are experimenting with other places like the post title or first paragraph. Plain text links are getting more popular too. There are still a lot of standard buttons out there, but the small icons (16×16 pixels or a bit larger) are getting more common, which I think is a good development.
I hope you got some inspiration and if you have encountered other creative and nonobtrusive examples, leave a comment and tell it and I will add it to the article.
- Leonaut.com
- School Is In Session - 100 Design Articles To Keep You Motivated : Part 1
- 5 ways to use Social Media Effectively on a small blog | WebDevLounge | design, development, SEO and wordpress | articles, discussion and community
1
I wasn’t really sure when this post ended: Each bit looked like the end with the social buttons and comment count
2
Thanks for this collection. It’ll inspire me for the next project.
3
@Lachy, haha
Maybe I should have written some text next to the last examples too.
@Rose, thanks
4
Great list, Getting these buttons to stick out, especially in the case of WebDesignerWall, is growing increasingly important for bloggers.
5
Nice showcase …
I’ve been on the fence about adding these “buttons” to my own blog (still in development), because I believe that active users of these social media sites already have a “workflow” of their own for adding/saving posts. For example, I use Delicious all day, but I’ve never used a button on a site; I use the Delicious toolbar for Firefox.
Yet, after seeing some of these examples and how they can look clean, unobtrusive and still provide the needed visual cue, I think I will be adding them to my blog.
Thanks!
6
@Spence, thank you :). You’re right. A huge percentage of the traffic of major blogs comes from social bookmarking websites. And therefore you first need to get them to the frontpage.
@Emily, You’re definitely right about del.icio.us, but digg or designfloat is another story, if you would ask me. When I browse websites, i don’t regularly go to digg to vote for a website, but when I see a button, I’m happy to click when it is a good article. It’s about providing the user a simple way to give kudos to an article they like. I’m glad this article helped you (a bit
)
7
Wow, this is a long one but quite interesting I must say. Digg it!