Page MenuHomePhabricator

Sharing on Twitter doesn't use the Cards format.
Open, NormalPublic

Description

Currently sharing on Facebook, Whatsapp and other social networks displays a nice image, however on Twitter nothing happens as we haven't opted in to support their service. Twitter uses og tags but requires the following tag to show we've opted in. Shall we add it?

<meta name="twitter:card" content="summary_large_image">

Details

Related Gerrit Patches:
mediawiki/extensions/PageImages : masterRevert "Add twitter meta tag for image"
mediawiki/extensions/PageImages : masterAdd twitter meta tag for image

Related Objects

Event Timeline

Shall we add it?

I'm not sure if this is rhetorical or not, but YES. :)

Change 335949 had a related patch set uploaded (by Ladsgroup):
Add twitter meta tag for image

https://gerrit.wikimedia.org/r/335949

Change 335949 merged by jenkins-bot:
Add twitter meta tag for image

https://gerrit.wikimedia.org/r/335949

Jdlrobson removed a project: Patch-For-Review.
Page fetched successfully

INFO: 9 metatags were found
INFO: twitter:card = summary_large_image tag found
ERROR: Invalid value (message: Field description failed to validate because: text expects tag property, but not found in Map().)
ERROR: Invalid value (message: Field title failed to validate because: text expects tag property, but not found in Map().)

og:title+og:description will be needed

The experiments I did for T51859#2708806 showed that the "twitter:card" meta tag alone is not accepted by Twitter. This ticket and the linked patch make me wonder. Did what I found change since then? Is it different for "summary_large_image" vs. the "summary" I played around with?

Does the last comment by @Jdlrobson mean Twitter does not accept what we want it to accept? If this is true, the added tag does not provide value. Can we please revert the patch until this is resolved?

But how to resolve, you will ask. See T51859#2708806. We would need to actually duplicate <title> and <meta description>. Given that the <head> section of MediaWiki pages on our cluster are quite clean I would oppose such a significant duplication, if the only benefiting stakeholder is a single, proprietary, commercial service.

I had an exchange with a Twitter engineer 2 years ago, and I fear now I have misunderstood him. Although Twitter cards do fallback to og tags, I'm unclear if they fall back to title/meta description tags.

A card looks like so, but you can replace twitter with og.

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@wikipedia">
<meta name="twitter:title" content="Title of content.">
<meta name="twitter:description" content="Description of content.">
<meta name="twitter:image" content="http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg">

We have plans to introduce og:description, but I guess we'd probably need og:title and og:site as well for Twitter cards to show.

If we are not willing to add those tags then we probably should revert the change and decline this task.
Alternatively, we could add og:description re-evaluate; add og:site and then re-evaluate or try again to see if we can contact them again, now we have card and og:image and see if they are willing to special case us (they are aware of our unique constraints)

Thanks for this additional information, this is very helpful!

My experiments showed that og:site is not needed, but og:description and og:title are. All details in T51859#2708806.

Note that Wikidata, in contrast to MediaWiki, already outputs <meta description> (introduced with T88475). This is mostly for much nicer search result snippets in Google etc. We would like to avoid duplication, but even if replacing <meta description> with og:description might be an option, replacing <title> with og:title is impossible because <title> is needed by the browser. This means: duplication can not be avoided if we want to support Twitter, and we could as well duplicate both title and description for maximum compatibility.

What are your criteria to decide if this is acceptable?

What are your criteria to decide if this is acceptable?

If og:title is the only contentious field, I guess it comes down to whether we believe the trade-off is worth repeating the title. If they are identical, gzipping will mostly swallow this up. Arguably adding more of a presence on Twitter should pull more users into the site and could be measured using pageviews/referrals and given we are already investing in the og tag it doesn't feel like we would be losing any of our values by including it as well. The og tags, although similar in content to the standard tags serve different purposes - they control how things are previewed in social networks, providing a snippet into a preview, rather than describe what a webpage is (This is why Google doesn't print the meta description in its search results).


(Note the preview here is not using the meta description tag but is using the title tag)

In this situation, I guess my stance is that we gain more by adding it then omitting it, but I realise I can't speak for everyone :)

But how to resolve, you will ask. See T51859#2708806. We would need to actually duplicate <title> and <meta description>. Given that the <head> section of MediaWiki pages on our cluster are quite clean I would oppose such a significant duplication, if the only benefiting stakeholder is a single, proprietary, commercial service.

What if we consider the stakeholder beneficiaries to be every user who interacts with the proprietary, commercial service? Many, many, many wiki users also use Twitter (and Facebook).

The HTML of https://en.wikipedia.org/wiki/The_Good_Terrorist already has these three tags:

<meta property="og:image" content="https://upload.wikimedia.org/wikipedia/en/d/de/GoodTerrorist.jpg"/>
<link rel="alternate" href="android-app://org.wikipedia/http/en.m.wikipedia.org/wiki/The_Good_Terrorist"/>
<link rel="apple-touch-icon" href="/static/apple-touch/wikipedia.png"/>

Do we consider the Open Graph protocol, released under http://www.openwebfoundation.org/legal/the-0-9-agreements---necessary-claims, to be sufficiently free and open source? If so, adding og:title and other properties seems fine. I'm curious what others such as @thiemowmde think about this.

Adding Twitter-specific markup wouldn't be any worse than the current Apple-specific or Android-specific markup, but that's a pretty terrible reason to do it. Twitter supports the Open Graph protocol (cf. T157145#3005793, which links to https://dev.twitter.com/cards/getting-started#opengraph, which states "When the Twitter card processor looks for tags on your page, it first checks for the Twitter property, and if not present, falls back to the supported Open Graph property."), so it seems like https://gerrit.wikimedia.org/r/335949 should indeed be pulled back.

Ladsgroup added a comment.EditedFeb 8 2017, 5:02 AM

Let's start from the begging again and examine everything. I make a to-do list on what we need to do.
Twitter says these tags are needed to make a summary card with large image: https://dev.twitter.com/cards/types/summary-large-image

  • twitter:card = summary_large_image (It's added with https://gerrit.wikimedia.org/r/335949 so nothing needs to be done)
  • <s>twitter:site = "@wikipedia" or something like this (we haven't done it). Also it doesn't have fallback (fallback to what?)</s> (not needed, only required for analytics. It's good to have it though but meh)
  • twitter:title = "Foo". We don't have it but It falls back to og:title (which we don't have either but usually, for example facebook, they fallback to <title> which we have)
  • twitter:description = "Bar". Same as above.
  • (Not required) twitter:image = "image.png" we don't have but it falls back to og:image which we have.

So There are two scenarios:

  1. Twitter doesn't fall back to <title> and <description>. In that case we either need to add both tags or abandon the idea of having twitter card and decline this task and revert https://gerrit.wikimedia.org/r/335949. I read that it's possible to have something like <meta name="twitter:description" property="og:description" content="Foo" /> according to RDF 1.1 but it's horrible in so many ways.
  2. If twitter has fall back our life would be much easier. Only we need to add og:description (for Wikipedia only, Wikidata already has it) and twitter:site (probably by adding $wgTwitterHandler)

So first, let's find out if there is such fall back and move on after that,

Ladsgroup added a comment.EditedFeb 8 2017, 5:44 AM

Okay, I made a page and played with it. There is no fallback for description and title. I tried to see if meta tags are better or not found this: http://webmasters.stackexchange.com/questions/52600/should-i-have-ogdescription-and-meta-description-together-on-every-page I suggest we go with open graph tags and duplicate it for description and title since twitter at least understands this one and it's not for twitter only.

Change 336624 had a related patch set uploaded (by Thiemo Mättig (WMDE)):
Revert "Add twitter meta tag for image"

https://gerrit.wikimedia.org/r/336624

The og tags, although similar in content to the standard tags serve different purposes

I tend to disagree. I may miss something, but from what I see the difference is of no practical relevance. The content of <title> and og:title as well as <meta description> and og:description should be identical in pretty much all cases.

This is why Google doesn't print the meta description in its search results

I'm afraid this is not correct. Google decides on a case by case basis if it wants to display a snippet from the page content, or the classic <meta description> tag. Trivial example: https://www.google.com/search?q=site%3Awikidata.org.

I suggest to proceed as follows:

  1. Continue working on https://gerrit.wikimedia.org/r/336179. Add code to the TextExtracts extension that spits out these three tags: <meta name="twitter:card" …>, <meta property="og:title" …>, <meta property="og:description" …>. This is the most minimal set to have nice Twitter cards. Note that og:image is not required for this.
  2. Together with the og:image code we already have in the PageImages extension the Twitter cards will have images.
  3. Revert the twitter:card addition to the PageImages extension because it does not belong there, see https://gerrit.wikimedia.org/r/336624.

I'm going to explicitly repeat what it's in the link I gave above:

The OG stands for Open Graph which is apart of the Open Graph protocol of which works on platforms such as Facebook.

The meta description element is for search engines such as Google, Yahoo and Bing.

Since these are two separate tags that kinda do the same thing but they are designed for different types of platforms, one for Facebook and the other for Search Engines. The reasoning behind this is that the Open Graph protocal is more rich in what content can be feed to Facebook without scrapping the full page, think rich snippets. So images, description and more information is feed to Facebook via the Open Graph.

Using both is a good idea.

Making sure I understand: We are worried about putting basically the same thing in the tags twice? I agree that is not nice but we also don't have a way around it if we want Twitter cards. I do believe Twitter cards bring us value by making links to our pages nicer and considerably more visible than if they were just text.

One detail we did not talked about: Please let's not use summary_large_image but regular summary. Reasoning: Large images are for gallery pages where the main content of a page is that photo. This is not the case in almost all cases we are talking about here. Usually the image is an illustration for a page the consists of text content. The regular summary is much more suitable for this.

Sounds like a plan. I've merged the revert and https://phabricator.wikimedia.org/T157145#3009251 sounds like a good way forward (but FWIW I still hold the view that og:title, og:description and title, description are not exactly the same just as a favicon and apple touch icon are not really the same - they serve different purposes but can be used for the same purpose.

Change 336624 merged by jenkins-bot:
Revert "Add twitter meta tag for image"

https://gerrit.wikimedia.org/r/336624

Tgr added a subscriber: Tgr.Feb 8 2017, 7:38 PM
Calexit added a subscriber: Calexit.

So is this something we expect to be resolved with MW 1.29 official release?

So is this something we expect to be resolved with MW 1.29 official release?

No.

@Calexit it's not looking likely due to the unresolved conversation above. In the meantime, https://www.mediawiki.org/wiki/Extension:TwitterCards is available for 3rd parties.

awight added a subscriber: awight.

This is still a useful feature to finish implementing, and shouldn't take more than a few lines of code once we've decided what to do. What's lacking is an adoptive parent to see it through to maturity.

I couldn't find an obvious project tag for "helps make Wikimedia content discoverable from the rest of the Internet", so I'm randomly assigning Discovery. Please add other tags if you know of something better.

This is really just blocked on T142090.

Is it really blocked, or is the best driving out the good? Would not something as simple as <meta name="twitter:card" content="title"/> be a massive improvement on the current highly suboptimal rendering - example: https://twitter.com/Tagishsimon/status/1064868689995071488

@Tagishsimon Twitter card format requires more than just that meta tag. We need to also provide a description, and unfortunately working out how to source that summary is proving problematic.

We could, of course, default to something like "Read more on Wikipedia about "Title page"" OR wiki data descriptions in the short term, which are both readily available right now, but short-term fixes have a habit of becoming permanent around here.

Tagishsimon added a comment.EditedNov 20 2018, 5:02 PM

@Jdlrobson Do we need to provide a description? Would not <meta name="twitter:card" content="title"/> provide our extant <title></title> contents to the twitter card. (I really don't know, but from first principles that seems to be what specifying content="title" would be likely to do.)

Fixes that are not done because otherissuesexist have a habit of not being done, fullstop.

This phab ticket has, for instance, been open for close on 2 years now. <meta name="twitter:card" content="title"/> is probably a 5 minute fix?

Jdlrobson added a comment.EditedNov 20 2018, 6:32 PM

Check out https://phabricator.wikimedia.org/T157145#3005543
And https://phabricator.wikimedia.org/T157145#3008190

We already tried just adding the tag and it didn't work.
https://phabricator.wikimedia.org/T157145#3009847

If you know something we don't know by all means submit a patch and we'll review!

Jheald added a subscriber: Jheald.Jun 6 2019, 10:20 AM