Social - Facebook, Twitter, Google+ und Co
Social Networking ist schon länger in aller Munde. Früher gab es Webseiten und Mailinglisten, dann wurde die Kommunikation mit RSS-Feeds beschleunigt. Und heute verknüpfen sich Menschen per XING, Facebook oder ersetzten SMS-Mitteilungen durch Twitter-Meldungen mit 160 Zeichen.
Lange Zeit habe ich mir das erst mal betrachtet. Man muss ja nicht jedem Trend nachlaufen aber auch meine Arbeitsweise ändert sich. Der Mailverteiler, den ich vor vielen Jahren mal eingerichtet habe, nutze ich schon länger nicht mehr und für schnelle Updates ist eine "Twitter-Welle" sogar dynamischer und erreicht mehr Personen als "nur" eingetragenen Benutzer. Zudem ändern sich Mailadressen auch, so dass diverse Mails über den Verteiler als "Unzustellbar" zurück kommen. Das war für mich dann auch der Grund zu sehen, was Twitter und Facebook für Sie als MSXFAQ-Leser bedeuten und oben links entsprechende Buttons zu addieren.

Sowohl Twitter, Facebook und alle anderen bieten "Button-Generatoren" an, die den fertigen Code ihnen bereit stellen, damit Sie diesen einfach in ihre Webseite einbinden können.
Achtung:
Diesen Code nutze ich absichtlich nicht, weil
dazu entweder IFRAME-Elemente oder JavaScript
von fremden Seiten nachgeladen wird und Sie
Anwender entweder eine Warnung bekommen oder der
Code "irgendetwas" mit der Webseite über DOM
machen kann, was ich so nicht möchte. Zudem holt
ihr Browser dann bei jedem Zugriff auf die
MSXFAQ auch ein bisschen Code von Facebook,
Twitter etc. was dort natürlich Spuren
hinterlässt
Ich habe daher statische Buttons mit
individuellen Links addiert. Erst durch den
Klick auf den Button landen Sie dann in einem
neuen Fenster bei Twitter und Co und
wissen immer genau, wo sie ihre Daten dann
eingeben.
Allerdings kann ich ihnen dann natürlich nicht via Icon schon anzeigen, ob sie mir schon folgen und wie viele andere Personen schon ein "I-Like-it" angeklickt haben. Aber ich denke das ist zu verschmerzen.
Eigentlich ist Twitter ein "Kurzmitteilungsdienst", bei dem gerade mal 160 Zeichen übermittelt werden können; quasi SMS im Internet. Aber Twitter ist dann doch etwas mehr, weil ich als Versender nicht die Empfänger aussuchen muss, sondern ich diese einfach als "msxfaq" sende und jeder andere Twitter-Anwender diesen Anwender "Abonnieren" kann. Sobald ich eine kleine Meldung sende, sehen alle "Follower" diese Information. Für die Funktion fehlt aber noch ein Baustein.
Sie müssen mir folgen: Dazu gibt es links
oben den Button
um auf
http://www.twitter.com/msxfaq zu kommen,
sich eventuell anzumelden und
dort auf "Folgen" drücken

Und schon habe ich einen "Follower" mehr und sie bekommen zeitnah Informationen, über alles, was ich als relevant ansehen. Und wenn es ihnen zu viel wird, dann können Sie einfach wieder aussteigen, indem Sie in ihrem Profil mich wieder entfernen.
Hinweis:
Leider aktiviert Twitter nicht per Default HTTPS
an allen Stellen. In ihren Accountdaten sollten
Sie daher "HTTPS" erzwingen:

Meine Links verweisen per Default aber auf die
HTTPS-Adresse
Nun ist es ja so, dass ein "Klick" auf den Twitter-Eintrag natürlich einen Zugriff auf die Webseite von Twitter und optional eine Anmeldung erfordert. Damit kann natürlich Twitter erkennen, wer Sie sind und woher sie kommen.
Das gleiche passiert, wenn Sie auf
klicken, nur dass hier die URL noch die
Information enthält, auf welcher Seite sie den
Button gedrückt haben
http://twitter.com/share?url=http%3A%2F%2Fwww.msxfaq.net%2Fpfad%2Fseite.htm&text=Titel+der+Seite
Ich werde in kürze die URL in der folgenden Form generieren.
<a href="http://twitter.com/share?url=urlencode(link); ?>&text=<?urlencode(title)&via=msxfaq&related=msxfaq"></a> https://twitter.com/intent/tweet?url=http%3A%2F%2Fwww.msxfaq.net%2Fpage&text=Seitentitle&via=msxfaq&related=msxfaq
- Kurze URLs
http://support.twitter.com/articles/78124-how-to-shorten-links-urls - Follow-Button
https://dev.twitter.com/docs/follow-button - Add the Tweet Button to your
Blog without JavaScript
http://www.labnol.org/internet/tweet-button-for-blog/14291/
Das hat zudem den Vorteil, dass das Layout der Seite auch "offline" ohne Internetverbindung gegeben ist und sich keine IFRAME-Inhalte dynamisch ändern oder umbauen oder über DOM ein fremdes von mir nicht kontrolliertes JavaScript die Webseiteninhalte verändert.
Auf den Einsatz der IFRAMEs, damit schon beim Laden der Seite JavaScript von Twitter ausgeführt werden, habe ich verzichtet. Genau das machen ja die "Generatoren", die für Twitter-Buttons einen Code generieren.
- Hier gibt es die Twitter-Buttons
für die eigene Seite
http://twitter.com/about/resources/buttons - Twitter Button Code
generieren
http://twitter.com/about/resources/tweetbutton
Das würde zwar zu einer besseren "Benutzererfahrung" (ich mag dieses Wort nicht wirklich) führen, und Zusatzfunktionen erlauben, aber ich möchte ihnen es frei stellen, diese Daten preiszugeben und habe daher die URLs entsprechend abgewandelt.
Allein die Anzeige der
MSXFAQ-Webseiten hinterlässt keine Spuren bei
Twitter, weil alle Daten von der MSXFAQ kommen.
Erst wenn Sie die Buttons anklicken, dann leite
ich Sie in einem neuen Fenster auf die
entsprechende Seite bei Twitter
Der zweite große Vertreter ist natürlich "Facebook". Eigentlich eine Seite, mit der man seine Freunde, angeblichen Freunde und Kontakte verwalten kann. In Deutschland ist vielleicht eher OpenBC bzw. nun "XING" bekannt. Auch diese Plattformen erlauben die Übermittlung von Nachrichten aber auch die Anzeige von Statusmeldungen. Bislang habe ich zwar noch keinen AddOn für Lync gesehen, welches meinen Lync-Status auch in Facebook setzt.
Bei Facebook gibt es zwei Funktionen, die für den Einsatz in einer Webseite sinnvoll sein können.
- Share this
Damit können Sie eine Seite über ihren eigenen Facebook-Account weiter geben. Das ist unkritisch, da der Code einfach eine URL ist, die sie beim Anklicke auf ihre Facebook-Seite verweist. Diese Funktion habe ich addiert, damit sie sehr einfach eine interessante Seite in Facebook referenzieren können. - I Like It/Gefällt
Über diese Funktion können Leser eine Seite einer Webseite quasi "bewerten". Leider geht dies technisch nur über ein IFRAME oder JavaScript, die schon beim Betrachten der MSXFAQ von der Facebook-Seite nachgeladen werden. Und das alles nur, damit neben dem Icon die Anzahl der Personen stehtn die das mögen und Facebook genau mit bekommt, wo seine Mitglieder sich rumtreiben. Auf diese Funktion haben ich lieber verzichtet.
Technisch ist auch der "Share This"-Butten wie bei Twitter ein Hyperlink auf Facebook mit passenden Parametern
http://www.facebook.com/sharer.php?u=http%3A%2F%2Fwww.msxfaq.net%2Fpfad%2Fseite.htm.htm&t=Titel+der+seite
- How To Make A Friendly
Facebook Like Button
http://dorianroy.com/blog/2010/04/how-to-make-a-friendly-facebook-like-button/
Natürlich können Sie über Facebook auch das Profil der MSXFAQ ansehen Interessant ist bei Facebook natürlich der "I Like It"-Button, den sie ebenfalls links oben finden.
- Profilseite MSXFAQ
https://www.facebook.com/msxfaq
Dies ist ein eigener Account, der die MSXFAQ repräsentiert und ist nicht mein "Persönlicher" Facebook-Account. So können Freunde und MSXFAQ-Freunde ungestört nebeneinander existieren.
Wer gerne auf seiner Webseite einen "I Like It"-Button addieren will, kann dies gerne tun. die Codegeneratoren von Facebook liefern fertigen Sourcecode zum einblenden.
- I Like it Button
https://developers.facebook.com/docs/reference/plugins/like/ - Facebook for Websites
http://developers.facebook.com/docs/guides/web/ - Statistiken
https://www.facebook.com/insights/
Hier erfolgt die Integration über aber ein IFRAME oder ein xfbml-Skript. Beide Daten kommen vom Facebook-Server der damit indirekt natürlich auch mittracken kann, dass Sie gerade meine MSXFAQ besuchen, d.h. allein die Anzeige des Buttons links oben ist schon ein "Hit" bei Facebook. Hier ein Mustercode:
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.mxsfaq.net&layout=button_count&show_faces=false&width=50&action=like&colorscheme=light&height=20" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:55px;height:20px" allowTransparency="true"></iframe>
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=234263189930231&xfbml=1"></script><fb:like href="www.msxfaq.net" send="false" width="450" show_faces="false" font=""></fb:like>
Google Plus+
Natürlich musste früher oder später auch Google das "Gefällt-mir"-Prinzip anbieten um damit natürlich auch ein "Rating" der Seiten zu erhalten. Das kann dem Suchindex natürlich gut tun, zumindest solange es keine Lücken gibt, über die Personen oder Bots diese Zahlen verfälschen.

Sie finden auf verschiedenen Webseiten schon das Icon. Allerdings funktioniert das scheinbar auch erst mal nur mit JavaScript und wenn Sie schon auf meiner Webseite sind, dann ist des doch relativ egal, wie viele andere Besucher die gerade angeschaute Seite "mögen". Das addieren eines solchen Icons kann aber für Webmaster interessant sein, wenn Google diese Daten auch in das Ranking seiner Suchergebnisse mit einbezieht.
Aktuell ist diese Funktion aber noch nicht
integriert.
Ich hoffe noch, dass es es auch hier
mal eine URL-Version ohne IFRAME o.ä. gibt.
- http://www.google.com/+1/button/
- http://code.google.com/apis/+1button/#target-url
- http://www.google.com/intl/de/webmasters/+1/button/index.html
- https://plusone.google.com/
- http://manfredlakner.info/so-integrieren-sie-den-google-1-button-in-ihre-webseite/
Auch diese Icons werden als JavaScript eingebunden, d.h. bei jedem "Lesezugriff" auf die Webseite werden diese Skripte von Google nachgeladen, was die Ladezeit verzögert und natürlich Spuren hinterlässt.
Microsoft "pinned Sites"
Mit dem IE9 hat sich Microsoft was nettes einfallen lassen, um Besucher den Zugang zur Webseite einfacher zu machen. Wir kennen ja alle die neue Taskleiste von Windows Vista und höher und dann sich Anwendungen doch auch "anpinnen" lassen, d.h. die Icons bleiben dort, auch wenn das Programm beendet ist und ein Context-Menü liefert zusätzliche Optionen. Das ganze funktioniert mittlerweile auch mit Webseiten am Internet Explorer 9, wenn die Webseite die entsprechenden Codes enthalten.
- Internet Explorer 9 Pinned
Sites How-To-Guide
http://www.microsoft.com/germany/msdn/pinned-sites/default.mspx - Internet Explorer Galerie
http://www.iegallery.com/de/
Für die MSXFAQ bin ich noch nicht schlüssig, ob diese Funktion einen Mehrwert hat, die das Nachladen von Java-Skripten von anderen Webseiten rechtfertigt. Zumal ich davon ausgehe, dass viele Administratoren vielleicht auf einem Server die MSXFAQ ansurfen und dort jeder Zugriff auf andere URLs entsprechend gemeldet wird. Ich werde die Entwicklung weiter beobachten.
Hintergrund IFRAME und externe JavaScript
Ich leide hoffentlich nicht an Paranoia aber wenn ich auf eine Webseite surfe, dann erwarte ich auch nur Inhalte dieser Seite. Und das meinen auch immer mehr Browser, die Inhalte von anderen Seiten erst nach einer Warnung anzeigen. Hier der IE9 bei der Einbindung von Facebook ohne SSL.

Auch wenn es "einfach" ist, Inhalte anderer Seiten einfach auf dem Client per IFRAME oder JavaScript in die eigenen Inhalte einzubinden, so mache ich mir damit nicht nur die Inhalte der anderen Seiten zu eigen. Schlimmer ist, dass ich gar nicht weiß, was der andere Anbieter im Rahmen des IFRAME gerade "einblendet". Bei einem kleinen Facebook-Button kann das ja auch ein Schadcode sein. Es gibt keinen fehlerfreien Code und wenn genau diese Quelle bei Facebook verändert ist, dann haben alle tausende MSXFAQ-Besucher vielleicht etwas, was sie nicht wollen.
Beim Einsatz von JavaScript ist das meiner Ansicht nach noch kritischer, da ich die Funktion der eingebundenen Skript in der Regel gar nicht kontrollieren kann. Die Skripte laufen aber in ihrem Browser ab und können über das Document Object Model sogar die angezeigte HTML-Seite verändern. Da sollte man als Webautor schon sicher sein, dass man vertrauenswürdige Quellen hat und ist trotzdem nicht sicher, dass ein Hack die Quelle korrumpiert.
Wenn ich den Button per XFBML-Code einbinde, dann könnte ich als Autor sogar sehen, wer auf welcher Seite den "I Like it"-Button gedrückt hat.
Ich habe noch nicht abschließen entschieden, welche Integration ich in welcher Art betreiben möchte. Aktuell ist es eine Pilotphase und ich freue mich auf Feedback.










