Is your content fit for social media linking?
Are you aware of how your pages look when someone shares a link to them on social media? In this article we provide some tips on making sure your content is labelled well for social link sharing.
Open Graph metadata
Most social media channels use Open Graph metadata tags to label links shared by users of their networks. Two critical tags for content are the og:title and og:description. These form the link text and description for your web pages. You can also use the og:image tag to set a feature image to display on networks that use them.
Not using open graph metadata?
Social media networks use other metadata elements to label your content if you're not using Open Graph metadata.
To demonstrate this, I created a test page. I labelled the page title, meta description and main heading so it would be obvious which parts of the page social media channels used.
The HTML <title> is the link text
When a link is shared on Facebook, Google+ or Delicious, the text from the HTML <title> becomes the link text. On bit.ly, a link-shortening tool that posts links directly to Twitter or Facebook, the <title> appears beside the shortened link. The images below show this.
LinkedIn sometimes uses the <h1> heading
LinkedIn can behave differently. Today on my test page, it used the <title> for the link, but previous experience has shown it also uses the <h1> tag, the main heading.
Pages without a <title>
If you've published a page with an empty <title> tag, Facebook uses the page address (the URL) as the link, Google+ uses the <h1> tag, LinkedIn uses the domain name, and Delicious and bit.ly leave the space blank.
The 'meta description' is the description
Facebook and LinkedIn use your meta description as the description shown under the link. You can see this in each of the examples above. Google+ used to use it, but now only uses Open Graph. Delicious leaves the description field blank, while Bit.ly doesn't use descriptions.
Pages without a meta description
Facebook and LinkedIn sometimes leave the space blank if the page has no meta description. Google+ uses the first 170 characters (or thereabouts) of text from your page, as you can see in the image below.
Don't rely on people to edit poor labels
Many people posting links to your pages won't edit poor titles and descriptions. They're not writers, after all, so they may not even think about trying to improve on what you've provided. And if they do want to change your text, they may not always be able to.
LinkedIn provides an obvious 'Edit' link, but Facebook and Google+ behave differently.
With Google+, you're stuck with the default title text. And while you can remove the description, you cannot change it.
Facebook allows people to edit the default text, but many won't realise they can. You need to hover over the title or description (which turns yellow—not the most common indicator of an editable text field) and then click before you see an edit box. And if there's no default description, to add one you need to hover and click in a very small target area below the link. Clicking anywhere else doesn't work.
Improving content for social media linking
To make sure our content is fit for social media linking, here are a few simple tips.
- Make sure your <title> is meaningful
- Clearly identify what's on the page
- Start with the topic terms to make them visible to scan-readers
- Provide enough context by adding qualifying words (for instance 'Training' is not as meaningful as 'Training for web writers')
- Always write a meta description
- Summarise or describe what's on the page
- Write concisely. 150 characters is a good rule of thumb
- Check that your <h1> is meaningful (especially if the page could be shared on LinkedIn)
- Test what you've written by showing people just the title and description. Ask if they can figure out what the page is about. Then make any changes necessary to make it clearer.
It's worth taking the time to improve your content for social media linking. You'll make it more findable on search engines too, because the terms in the <title> and <h1> influence search ranking. And your page <title> and meta description are usually displayed as the link and description on search engine results pages.
More writing tips
You might find these tips from our resources section helpful.