Facebook: Den Social Graph nutzen

Facebooks “Like”-Button erfreut sich enormer Beliebtheit was sicherlich auch an dem tatsächlich messbaren Zuwachs an Besuchern liegt, die man durch diesen Button gewinnen kann. Einige meiner Artikel profitieren schon stark davon, dass manche Personen sie mögen. Als Blogger und Webseitenbetreiber lohnt es sich daher vielleicht auch, den nächsten Schritt zu gehen und die eigene Webseite besser mit Hilfe des Open Graph Protocol in facebook zu integrieren.

Wichtigster Schritt hier ist es zunächst die Inhalte der eigenen Seite in Graph Objekte umzuwandeln und diese mit Hilfe von meta-Tags auszuzeichnen. Facebook nutzt hierfür eingene Tags was uns dazu zwingt zwei Namensräume in unser HTML-Dokument zu integrieren. Die weiteren Tags erklären sich dann fast von selbst:

  1. <html xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">
  2. <head>
  3. <title>The Rock (1996)</title>
  4. <meta property="og:title" content="The Rock"/>
  5. <meta property="og:type" content="movie"/>
  6. <meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
  7. <meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
  8. ...
  9. </head>
  10. ...
  11. </html>

Für das Open Graph Protokoll sind fünf Elemente ausgezeichnet worden:

  • og:title – Der Titel des Objekts
  • og:type – Der Typ des Objekts, z.B. “movie”. Eine Liste aller verfügbaren Typen findet Ihr übrigens hier.
  • og:image – Eine Image-URL, der im Zusammenhang mit dem Objekt im Graph dargestellt werden soll. Das Bild muss mindestens 50×50px groß sein und darf maximal ein Verhältnis von 3:1 aufweisen.
  • og:url – Der URL als permanente ID für das Objekt im Social Graph, z.B. http://www.imdb.com/title/tt0117500/.
  • og:site_name – Ein durch Menschen lesbarer Name der Seite, z.B. “IMDb”

Um die Integration der Objekte in facebook abzuschließen empfiehlt es sich noch eine Beschreibung der Seite og:description und Adminstratoren für diese Daten auf facebook zu definieren. Dies könnte dann so aussehen:

  1. <meta property="fb:admins" content="USER_ID"/>
  2. <meta property="og:site_name" content="IMDb"/>
  3. <meta property="og:description" content="Beschreibung"/>

Die USER_ID sollte dann natürlich der ID eines Nutzers bei facebook entsprechen. Wenn Ihr eine Fan-Seite bei facebook betreibt könnt ihr natürlich auch diese als Adminstrator einrichten mit fb:app_id und einer mit Komma getrennten Liste von IDs.

Sobald ich etwas mehr Zeit habe werde ich die Integration hier auf ugotit.de ebenfalls vornehmen und dann auch darüber bloggen, wie man facebook und WordPress bequem verbinden kann. Idealerweise natürlich ohne ein weiteres zusätzliches Plugin.

4 Kommentare zu “Facebook: Den Social Graph nutzen”

  1. Christoph:

    Ich find ja, das ist die Seuche des Internets, aber geschmackssache….

  2. Daniel:

    Was genau meinst Du? Facebook oder die semantische Verknüpfung der Daten oder beides? Facebook sehe ich auch skeptisch und sehe den Artikel hier eher als ein Beispiel für etwas was geht.

    Aber die Idee den Daten mehr “Sinn” / Semantik zu geben finde ich grundsätzlich gut.

  3. Christoph:

    Ich verknüpfung von Blogs mit dem Socialkrams. Wirklich nutzen tut das ja niemand.

  4. Daniel:

    Naja es bringt schon Besucher also daher nützt es mir schon. Was ich viel interessanter finde ist die Tatsache das man mit den Meta-Elementen den Sinn dieser Seite erklären kann. (Typ des Inhaltes, Überschrift,…) Diese semantische Verknüpfung kann halt die Art und Weise wie man das Netz nutzt deutlich verändern.