The impact of social sharing has obvious benefits on brand awareness, increasing both brand and direct traffic. Whilst search engines refuse to state categorically the influence this activity has on search rankings, it stands to reason that organic sharing will lead to organic back links and will therefore influence rankings.
Here are seven tips for optimising web pages for social sharing.
During the planning stage for content production, an often overlooked consideration is how to optimise it for the intended user. The bulk of the focus is on producing content that will cut through short attention spans and the abundance of information it’s competing against.
There are two key cognitive design principles to keep in mind when presenting information:
- “Dual-coding theory” suggests that learning and memorisation are more effective when people are given both text and visual stimuli.
- Progressive disclosure” demands that content be organised concisely and in digestible chunks.
Simple ways to break up content into more consumable chunks include: images, bullet-points, sub-headings and different typography.
2. How to optimisation your URL
It is important to consider how a URL will look when displayed on social media. A URL that is user friendly, relevant and clean is much more appealing to a user. It is also crucial to make sure that these longer URL strings are void of additional parameters, including UTM codes. Trusted links get more clicks.
3. Remember sharing buttons
It sounds obvious, but the most effective tool for getting users to share your content is to include share buttons on the page. The debate over the validity of share buttons is ongoing but, like everything in design, moderation is the order of the day and the inclusion of share buttons is a must.
Clever use of buttons is crucial. You should be selective over which to include and more importantly, which to leave out. More buttons can result in slower page load times, visual clutter and disengagement from users.
To assist your decision on which buttons to include, use Google Analytics to assess the volume of traffic being referred from each. It’s important to make sure you’re engaging with networks that match that of your brand’s audience.
Keep it simple, keep it official
Whilst it can be tempting to use bespoke button designs, the safe route is to use those provided by the network themselves. These are recognisable and trusted, thus improving engagement.
Positioning of your sharing buttons is another important factor; placing them prominently makes them more visible and improves usability. Recent research suggests that content is often shared without being read and this is another justification for buttons being positioned at the top of the page in order to engage those users that don’t scroll down.
4. Meta tagging
Defining metadata for optimising content for use by various social networks can be done through Meta tags. There are various Metadata types and the tricky bit is choosing which to use, our recommendations are:
Meta and Title descriptions
You should always define Meta and Title description tags, but they are particularly useful on social networks such as Google+.
<title>Page Title. Maximum length 60-70 characters</title>
<meta name="description" content="Page description. No longer than 155 characters." />
Publisher mark-up and Authorship
This Meta tag won’t impact the way your content is displayed on social media, but it will allow Google to reference a Google+ profile page in search results, which improves trust in your content. Furthermore, Google has stated that content will soon be ranked with trusted authors, over that of content without.
Make sure the rel="publisher" tag is associated with not only your site, but also any authors who are linked with rel="author".
<link rel="publisher" href="https://plus.google.com/publisher-name”/>
<link rel="author" href="https://plus.google.com/author-name"/>
Schema.org tags are used to decide how content will display on networks like Google+. Alternatives exist, including RDFa and microformats. However, the big three, Google, Yahoo! and Bing, all support Schema.org right now, so it’s the logical choice.
<meta itemprop="name" content="The name or title">
<meta itemprop="description" content="This is the content description.">
<meta itemprop="image" content="http://www.example.com/image.jpg">
Open Graph tags
A protocol that shares similarities with Schema.org is Open Graph, which is used by Facebook for information gathering about your content. Its popularity is increasing with Pinterest also using it. The following tags are useful:
<meta property="og:title" content="The name or title"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://www.example.com"/>
<meta property="og:image" content="http://www.example.com/image.jpg"/>
<meta property="og:description" content="This is the content description."/>
Twitter Card tags
To complicate matters Twitter has its own Meta tags. There are various formats to choose from, which will change the way your content is displayed. You can see what each formats does here. We like the Summary Large Image card:
<meta name="twitter:title" content=”The name or title">
<meta name="twitter:description" content=”This is the content description.”>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@site-twitter-handle">
<meta name="twitter:image:src" content=”http://www.example.com/image.jpg">
5. Images optimised for sharing
If you want to display images in you content within social networks, then referencing images in your Metadata is vital. Ideally you will produce an image that is optimised for your selected network. Facebook asks for images to be sized 600 x 315 pixels or more to optimise the listing view. Their suggested aspect ratio is 1.91:1, which will avoid cropping. You will also want to make sure the image you’re including is relevant to the content.
Twitter on the other hand, for its summary cards, prefers images at 120 x 120 pixels or higher. For the alternative large summary card format that we’ve suggested above, you’ll need at least 280 x 150 pixels.
Creating images for each network can be time consuming, so we suggest creating a single image for use across all your networks. Our recommendation would be opting for Facebook’s preferred size of 600 x 315 pixels, as this will multipurpose.
6. Verifying social commenters
Integrating commenting features from various platforms such as Facebook’s comments, Echo, Livefyre and Disqus allows your visitors to comment and then easily share on their preferred social networks.
These plugins verify your users and thus add credibility to the comments on your site, which in turn reduces spam and the likelihood of trolls. More importantly, your content’s reach is improved as it appears your visitors’ social networks.
7. Remember to swat the bugs
It is important to check your content with a debugging tool once you’ve made the changes above. These tools are available for each social network:
- Facebook: https://developers.facebook.com/tools/debug
- Google+: http://www.google.com/webmasters/tools/richsnippets
- Twitter: https://dev.twitter.com/docs/cards/validation/validator
- Pinterest: https://developers.pinterest.com/rich_pins/validator/
For Pinterest and Twitter you need to have prior approved of your domain before using Metadata on your site. At the time of writing, it took Twitter two days for approval of our site (but there have been reports from some developers claiming it has taken weeks).
It is important to do this sooner rather than later, as some Pinterest users report it also took weeks to approve their content. Also, Pinterest requires you to be registered as a business account.
As featured on: