Social Media Plugins: Tipps für schnellere Ladezeiten
Sowohl für den Internetnutzer als auch für den Seitenbetreiber bringen Social-Media-Plugins Vorteile. Der Internetnutzer kann mit nur einem Klick bestimmte Dinge bewerten und so die eigene Meinung schnell und unkompliziert zum Ausdruck bringen. Demgegenüber profitiert der Seitenbetreiber von einer schnellen Popularisierung der eigenen Webseite bzw. einzelner Inhalte.
Das Problem
Das Kernproblem von Social Media Plugins sind permanente „Requests“, die an verschiedene Server gestellt werden. Sobald ein Nutzer eine Internetseite mit Social Media Plugins besucht, werden automatisch Informationen über ihn angefordert und ein Surf-Profil erstellt. Dieser Datenaustausch mindert die Performance und hat eine längere Ladezeit der Internetseite zur Folge. Um dem entgegenzuwirken, gibt es zwei effektive Möglichkeiten.
Die Zwei-Klick-Methode
Die vom heise Verlag entwickelten 2-Click Social Media Buttons sind im Gegensatz zur „Standard-Variante“ bei Seitenaufruf zunächst inaktiv und lediglich als Grafik integriert. Das automatische Abrufen der Nutzerdaten wird somit vermieden und es wird gewährleistet, dass der Nutzer selbst bestimmt, ob und wann eigene Daten weitergeleitet werden, was auch aus Datenschutzgründen vorteilhaft ist.
Will der User nun einen Webseiteninhalt bewerten, muss er den Button zunächst mit einem ersten Klick aktivieren, danach mit einem zweiten die „Bewertung senden“. Für weitere Elemente einer Website wird der Vorgang dann erneut wiederholt. Einziger Nachteil dieser Methode ist, dass bis zur nutzergesteuerten Aktivierung der Share-Buttons keine Angaben zur aktuellen Zahl der Bewertungen angezeigt werden.
Skriptfreies Sharing
Social Media Buttons können auch ganz ohne JavaScript in die eigene Website integriert werden. Dies geschieht mit Hilfe von codierten Links, die alle Informationen über den zu teilenden Inhalt einschließen.
- TWEET BUTTON (Twitter):
<a href=“https://twitter.com/intent/tweet?text=YOUR-TITLE&url=YOUR-URL&via=TWITTER-HANDLE„>Tweet</a>
Bei Twitter ist es möglich, TEXT, URL und VIA-BENUTZER zu übertragen. Obligatorisch ist dabei nur die Eingabe des TEXT-Parameters.
- LIKE BUTTON (Facebook):
<a href=“http://www.facebook.com/sharer/sharer.php?u=YOUR-URL„>Share on Facebook</a>
Lediglich die eigene URL muss eingetragen werden, da Facebook auf alle benötigten Informationen selbstständig zugreift. Um dabei Fehlübertragungen zu vermeiden, empfiehlt es sich, spezifische Metadaten in den Head-Bereich der Webseite einzufügen.
<meta name=“title“ content=“The Title Of The Link“ />
<meta name=“description“ content=“A description of the link would go here.“ />
<link rel=“image_src“ type=“image/jpeg“ href=“http://www.domain.com/path/my_picture.jpg“ />
- +1 BUTTON (Google+):
<a href=“https://plus.google.com/share?url=YOUR-URL„>Plus on Google+</a>
Analog zum Facebook-Button genügt es hier, die eigene URL einzutragen und den Quellcode mit einigen Metadaten zu ergänzen. Beispielsweise anhand des Open-Graph-Protocolls:
<meta property=“og:title“ content=“…“ />
<meta property=“og:image“ content=“…“ />
<meta property=“og:description“ content=“…“ />
Skriptfreies Sharing lässt sich auf sämtliche Soziale Netzwerke anwenden, doch anders als bei der Zwei-Klick-Methode, ist es hier in keinem Fall möglich, den aktuellen Bewertungsstand anzeigen zu lassen. Die Frontend-Performance wird aber gleichermaßen positiv beeinflusst.
(Bild: © Schulz-Design – Fotolia )