Social Media Tags … Part of working as an agile tester in a News environment is taking care, that the features, which impacts the spread and reach of the news articles are working, so as not to lose out on readers and followers.
So whenever we have a new article type or sharing feature, I check the visual appearance on other social media like Facebook or Twitter.
If the visuals are missing or look weird, I check the source code of the news article and check, if the needed meta tags are present.
Here is an example where the different tags are set.
We posts testing news, interesting blog posts, conference CfP, etc.
As with other social media outlets, we use a preview of the news to show it upfront to the user. This teaser is an important trigger for users to click on an article.
This preview is generated by social media tags included in the page source of a website.
Quite often I come across blogs, which don’t include these, which results in a preview like this.
Here is an example of the visual difference:
And even in the image on the right side I could have done a better job and choose a better preview image. 🙂
The less attractive and informative an information is (sic!), the less likely it is, that users will click on it and get to the valuable information.
Different social media outlets use different tags and formats, so to have a good reach, the writer needs to consider them.
Twitter is using their own tags (twitter cards), while Facebook and other media use the OpenGraph tags (there might be others, but so far these seems the most common ones).
Twitter: “With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website.”
Facebook: “We want all websites– and in particular news sites, magazines, blogs, and other media sites– to easily reach their existing fans and grow their fan base.”
XING : (Technical information)
Use the social media tags which is used by the social media, where your audience is most likely to be found.
Depending on the tool you use to write, there might be different ways to include them.
For example, on WordPress there are plugins, from “Yeast SEO” and “Open Graph” to dedicated “Twitter”, which all provide the functionality.
What if you have a blog post, where there is no image?
You can set a default image, maybe from your start page or somewhere different.
Back to Testing
Now that you know some more background of these meta tags, you can also use that knowledge to test them in your products, when you are sharing to social media.
There are even tools outside, which can give you a quick insight, without the need to crawl through the page source.
OpenGraph: Just paste the URL of the article into OpenGraphCheck to see, which tags are present.
Twitter Card: Just paste the URL of the article into Card Validator to see, which tags are present.
Facbeook: Just paste the URL of the article into Dev Tool to see, which tags are present.
og, social media tag, twitter card