3

In order for a better experience when sharing a link over Facebook (and not only there) it would be nice to have the Open Graph protocol in a page.

For example for https://bicycles.stackexchange.com/:

<meta property="og:title" content="Bicycles - Stack Exchange"/>
<meta property="og:type" content="forum"/>
<meta property="og:url" content="https://bicycles.stackexchange.com/"/>
<meta property="og:image" content="http://cdn.sstatic.net/bicycles/img/logo.png?v=123"/>
<meta property="og:site_name" content="Bicycles - Stack Exchange"/>
<meta property="og:description"
      content="Q&A for people who build and repair bicycles, 
               people who train cycling, or commute on bicycles"/>
8
  • 5
    I think it's worth pointing out that Open Graph is (well, at least appears to be) an independent standard for web page metadata, not something proprietary that Facebook is trying to push on other websites.
    – David Z
    Sep 8, 2011 at 7:55
  • Is it worth making all the pages bigger and therefore slower to load for this? Every network packet has an effect to display time. Sep 8, 2011 at 8:22
  • @David Zaslavsky hence the and not only there part :) - but nevertheless, I changed the link url.
    – balexandre
    Sep 8, 2011 at 8:34
  • 2
    that's... quite a lot of extra data to have on a page considering it will be useful for maybe 0.0001% of requests....? Sep 8, 2011 at 8:35
  • @Marc Gravell it's just an example, title and image would do the trick as well, but nothing at all??
    – balexandre
    Sep 8, 2011 at 8:42
  • @MarcGravell The above metadata is 495 bytes. According to Chrome, a download of bicycles.stackexchange.com with all assets is 307k. That's only a 0.16% difference! And it would be useful to more than just facebook: any site that wants have a richer link would benefit.
    – Evil Trout
    Jun 15, 2012 at 18:27
  • @evil I think you'd need to compare a question page, not the homepage. Jun 15, 2012 at 18:41
  • @JeffAtwood I used that page because the above metadata was for it. But for example this question page is currently at 176K transfered, so it's still a tiny piece of data.
    – Evil Trout
    Jun 15, 2012 at 19:15

2 Answers 2

3

My question would be... to add what? Most of that data is already available via regular html, and it doesn't do too badly:

facebook

adding an image... well, that's interesting because we do do that for apple-touch etc:

<link rel="apple-touch-icon"
    href="/content/stackoverflowmeta/img/apple-touch-icon.png">

so it wouldn't seem reasonable to advertise the logo that we share on stackauth:

logo

(or possibly the first image in the markdown? defaulting to site logo?)

but the rest seems a bit redundant? Of course, there is a reasonable number of iOS users, where-as facebook links would be much rarer. I wonder if there is any way to detect if the caller might be interested in the open-graph data, i.e. add it when it might help (so: for facebook's servers calling us)

Edit: and here's bicycles:

enter image description here

Which could potentially have additionally the logo:

bicycles

5
  • not really Mark, at least the one I used: balexandre.com/temp/2011-09-08_1148.png It shows nothing regarding the link, that's why I started this Meta Question.
    – balexandre
    Sep 8, 2011 at 9:47
  • @balexandre then your facebook is broken; I'm adding the image I get... Sep 8, 2011 at 9:51
  • I would like to see the logo for each site. Looks much nicer. I think it's worth putting some effort in making SE Facebook links look good
    – Pekka
    Sep 8, 2011 at 10:12
  • 1
    I think it's a bad idea to expect everyone who wants to make a rich link to a SE site to code their own parser. If SE supports OG, then people can just make their linker work automatically without any effort on their part.
    – Evil Trout
    Jun 15, 2012 at 18:30
  • @Marc: My duplicate question demonstrates that FB, when it doesn't have a hint from SE, chooses inappropriate images. (It also got some more attention than this question.) In light of this change in behaviour, I'd invite you to reconsider this decision. Apr 29, 2013 at 1:27
1

I don’t know when it happened, but Stack Exchange sites now use the Open Graph vocabulary.

Previously specified in HTML5 meta tags, which was invalid, but at some time after 2014-02 via RDFa.

This very question, for example, uses RDFa in the head (I have removed the unrelated HTML5 and Microdata attributes):

<meta property="og:type" content="website" />
<meta property="og:image" content="/content/stackexchangemeta/img/[email protected]?v=c34d758b103d" />
<meta property="og:title" content="Open Graph protocol should be integrated" />
<meta property="og:description" content="In order for a better experience when sharing a link over Facebook (and not only there) it would be nice to have the open graph protocol in a page for example for http://bicycles.stackexchange.com..." />
<meta property="og:url" content="https://meta.stackexchange.com/questions/105487/open-graph-protocol-should-be-integrated"/>

As they don’t define the prefix og, the RDFa Core Initial Context gets used where og has the URI http://ogp.me/ns#, so it’s the Open Graph protocol.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .