The Art of Social Design to Amplify Your Social Presence

Social media is one of the best distribution mediums to get your content shared at zero-cost. To get maximum social media traction, it’s very important to make your website social-friendly. Your website is your online real estate. So, you got to smartly utilize your website space and optimize your site for social sharing.

Your website design should be deeply integrated with social media to make sharing as easy as possible. Placing the social media elements anywhere on the page won’t make it user-friendly.

Here are a few design cues to boost your social media engagement to attract more social media traffic :-

Display Social Media Follow Buttons Together at a Prominent Place

Now a days, plenty of social media icons can be seen scattered on a site. Each of them has a different purpose to serve. To get the readers on board for the first time, you need to get them connected to your social media profiles. For that, its very important to place the social media account icons in a very prominent place, that too together in a group for maximum visibility. Placing one or two icons here and there will not be able to attract major attention and will be less effective.
You can place these buttons on the side bar of your blog. There are two common practices here, either place them right on the top of the panel, or place them under the subscription box or top side bar. These are the places which get maximum attention from the visitors of a site. Popular sites like SocialMediaExaminer,, Forbes, TechCrunch and many others have used the side bar to place the social follow buttons.

Many sites have used the header and footer bars to place their social media icons. These are the two panels which also manage to get a very high traction. Big publishers like Forbes & Mashable feature their social media follow icons on the header and footer right section.

It’s not necessary to integrate all the channels for the sake of increasing the list. In fact, if you are only active on Facebook and Twitter and your LinkedIn presence is not very strong and you don’t even update your LinkedIn profile regularly, then don’t include it in the list unless you become fairly active on that platform.

Design Tip: Icon designs should go with the overall theme of the blog. You can even create custom icons to suit your over all blog template design. Make sure the shape, size and color of each and every button is created and customized to best suit your site design.

TIP: Mention the Twitter handle name clearly on the Twitter follow button. It helps the users take notice and connect with your brand’s identity.

Integrate Social Login to Your System

Social login enables your users to login to your site using any of their social media IDs. The service gets access to their user authentication data and enables your website visitors to register without having to fill out a tedious form. Your visitors don’t even need to enter their mail ID, to get registered with your site.

These social login buttons should be placed in a prominent place. You can keep them on the header bar, top of the side bar or you can also place them on the login/Register page too. In fact, a login registrar page should always have the social login option along with traditional registration forms.

Add Lightbox Social Popover

You can also introduce a Lightbox login window, which will pop up whenever a user comes to your site. You can also set a delay time for this box to pop up. The Lightbox popup gives the user an option to sign in with their social media accounts. You can choose to include ‘Email subscription’ form or other social media buttons to give the user the ability to take multiple actions from one place.

Design Tip: Place the social connect right next to your ‘Sign-up’ button for maximum visibility.

Add a Social Sharing Toolbar

Social sharing is a major behavioural shift for publishers to make participation easy and increase interactions. As per the ‘Three click rule’ of web designing, it should not take more than 3 clicks for a user to take an action. The same theory is applicable for the social media integration on the website too.

If a reader likes a particular article and tries to share it on the social networks or take any other similar action, it should not require multiple clicks or moving from one tab to the other to do so. 

Place this tool bar on each and every content page of your site. These tool bars help your readers to take necessary social actions and participate in social interaction with an ease. The social sharing toolbar can also include options to share it on various bookmarking sites and even subscribe to your RSS feeds without navigating away.


These social media toolbar can be easily added at multiple locations on a page. You can place a small horizontal panel under each article featured on the home page of your blog.  Many bloggers prefer to highlight particular interactions instead of featuring a long and elaborate panel on the home page itself. For example, The Huffington Post shows the total comments count on the home page, where as Mashable shows the total share counts on each article, across all the platforms on home page as well as on top of each article page.

You can place an elaborate toolbar with multiple features on your inner pages displaying all the action counts, i.e. number of Likes and Shares on Facebook, total Google+ shares, Tweet counts, inShares, pins etc.

Now a days, embedding a floating social sharing bar is a popular choice with websites which have a responsive design.

The biggest advantage of having a floating toolbar is that it rolls with the user, enabling him to share the article at any point unlike the traditional sharing toolbars which are fixed on top of the site.

Call to Action at the Bottom of the Posts

You can place the social sharing toolbar at multiple places on a web page, but the ideal location is to place it at the end of the blog posts. The reason a call to action performs better at the bottom of a blog post is that if your reader has scrolled all the way to the end of a post, there is a very high chance that you have successfully engaged him with your content. There is a very high probability that  he would take an action like commenting on the post or tweeting it. So, make sure to have a social sharing toolbar ‘below the fold.”

Design Tip: Research says, the first place the human eye is drawn to on a website is the top right-hand corner, so the side bar is again an optimal location to place a social sharing toolbar.

Add Other Social Plugins

You can also add other social plugins to socialize your site.

Facebook Facepiles

This widget displays a Facebook Like box to show users who have liked your page, recommendations, comments and activity feed of a user and his Facebook friends who have liked the page. The widget allow visitors to share content from your site on their Facebook profile with a single click.

Design Tip: Place this plugin on the Home page at the top of the right hand side bar, preferably in the first fold to drive a user to act under peer influence.

Give Pin It Option on Images

You can propose your reader to pin the images used in your blog articles directly. You can provide them a pinning option on a mouseover, so whenever your reader will place the mouse pointer on an image, a pop up with a Pinterest icon will appear in the top right corner of the image, prompting him to ‘Pin’ it. The trend is gaining popularity as it enables users to easily share your images.

There are a number of other social media plugins to boost your social media presence. But, don’t forget to customize these plugins and personalize the settings to match your web design layout.

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment