Multiple Share Cards For Your Web Page
The first — and hopefully last — experience your user has with your news story is on social networks. I’ll describe a neat trick for sharing a single web page on social networks in several ways or at several times.
Primer: the share card
Virtually all news sites get one thing right: they create a “share card” per story. A share card has an image, a headline and a description. Here’s an example on Twitter:
Social networks display share cards by fetching the web page and rendering its HTML <meta> tags. Each web page has one share card.
What if I want to share my page in several ways?
Sometimes, it’s hard to settle on a single share card for a page.
Consider this news quiz. The reader’s goal is to guess what a chart looks like. What image should readers share on social networks?
A stock photo would seem convoluted, since the page itself is visually striking. The correct answer — a striking chart — would defeat the purpose of the page, because readers will see it before they take the quiz.
Hrm … what’s a visual piece of information that compels readers on social networks to take the quiz and learn from it?
Here’s one answer: some great visuals further down the page. The story includes small-multiple charts. Each exposes enticing facts without giving away the answer to the quiz.
We’d like to make ten share cards: one per chart. We’d like all those share cards to link to the quiz page.
Here’s the secret.
The solution: “social-redirect pages”
The trick is to publish one web page per chart. Make the web page as simple as possible: basically, a giant link to the quiz.
First, the reader clicks a share card on his or her social network of choice:
That takes the reader to your “social-redirect page.” It’s a spartan page that leads readers to the story:
Readers click the link and enjoy the quiz.
How social-redirect pages can help tell your story
Bonnaroo-goers will be interested in a tweet about Bonnaroo; Coachella-goers will be interested in a tweet about Coachella; and so on. In general, different share cards engage different readers.
Perhaps even more exciting: share cards can be timely. In this example, ten music festivals happen at ten different times. That makes the story relevant at ten times — hence ten share cards.
And the drawbacks?
I can think of two issues you should consider when using social-redirect cards.
First of all, a social-redirect page hassles the reader. In this example, it costs the reader an extra click.
One can publish meta-refresh or JavaScript code on the social-redirect page to automate the click on the reader’s behalf. To the reader, it will seem like the share card went straight to the final page (with a fraction-of-a-second delay).
That raises a second issue: readers should know what they’re sharing.
Here’s an advanced example that shows the subtleties. We The Tweeple, a news story, has hundreds of thousands of social-redirect pages that automatically send the reader to the main page. A reader may see a chart like this:
When the reader clicks to share on Facebook, the chart pops up:
Unfortunately, that’s not what happens on Twitter:
When the user clicks “Tweet”, the share card will be attached to the tweet. Otherwise, the user has no way of knowing what graphic will appear.
It’s a challenge to clarify what readers will share when they post to social media.
Next steps in news
Social-redirect pages can make “tracker” websites far more engaging.
Many news sites publish stories that change every day: tracker polls, sports-league standings and incident counters spring to mind. They’re visual, but news agencies don’t tend to publish factual graphics on their share cards because the facts change over time. (The trend today is for share cards to use ambiguous illustrations.)
Social-redirect pages let news sites publish one social-redirect page per (timestamped) graphic. Bingo: readers on social media become more informed and engaged.
