Link-Vorschauen

8 Tipps für die Gestaltung von Link-Vorschauen für Slack, WhatsApp & Co
Keine Kommentare

Während sich eine neue Generation von Messaging- und Produktivitätsanwendungen entwickelt, die das Web als Mikrobrowser nutzen, würden Unternehmen gerne die Macht dieser viralen Kanäle nutzen. Die Frage ist nur, „Wie?“

Wir sprechen von Messaging-Anwendungen wie Slack, WhatsApp oder WeChat als „Mikrobrowsern“, weil diese Links als Miniaturvorschauen der Websites anzeigen. Diese Link-Vorschauen  geben einen ersten Eindruck von einer Marke und spielen eine große Rolle dabei, ob ein potenzieller Kunde sich zur Unternehmenswebsite durchklicken wird. Bei Google Analytics fällt der von Mikrobrowsern generierte Webtraffic allerdings unter die Kategorie „Direkt“ und wird gerne ignoriert.

Da immer mehr Menschen Messaging-Anwendungen nutzen, nehmen Link-Vorschauen innerhalb Mikrobrowser zu. Cloudinarys 2019 State of Visual Media Report, der sich auf Daten von mehr als 700 Kunden und 200 Milliarden Transaktionen stützte, fand heraus, dass 77 Prozent der in Slack geteilten Links während der Arbeitszeit stattfanden und meist als „direkter“ Verkehr angezeigt wurde.

Die gute Nachricht ist, dass die Besucher, die von Mikrobrowsern kommen, in der Regel hoch qualifiziert und am unteren Ende des traditionellen Sales-Pipeline-Trichters zu finden sind. Egal, um was es sich handelt, Empfehlungen von Freunden aus WhatsApp-Gruppen oder Kollegen via Slack sind vertrauenswürdig. Um den größtmöglichen Nutzen aus dem Mikrobrowser-Verkehr zu ziehen, sollte dieser mit speziell für Mikrobrowser entwickelte Links unterstützt werden.

Hier 8 Tipps dazu, wie sich mit Link-Vorschauen in Mikrobrowsern die größte Wirkung erzielen lässt:

  1. Nicht vergessen, der Mensch kommt zu erst. Daher sollten die Inhalte der für die Mikrobrowser erstellten Links für Menschen und nicht für Maschinen gestaltet werden. Menschen schalten bei Link-Vorschauen mit komplizierten Texten, SEO-optimierten Schlüsselwörtern oder Fachjargon schnell ab. Kurze, einfache Zusammenfassungen sind besser. Wenn es das Ziel ist, mit Hilfe der Link-Vorschau zum Verkaufsabschluss beizutragen, können diese Informationen wie Bewertungen, Preis, Verfügbarkeit, Farb- oder Modellauswahl enthalten. Reine URL-Links oder Miniaturbilder in schlechter Qualität werden hingegen seltener angeklickt. Obwohl den Empfehlungen von Freunden in der Regel Vertrauen entgegengebracht werden, entscheidet nicht selten die Qualität einer Link-Vorschau darüber, ob man sich zur empfohlenen Seite durchklickt .
  2. Nicht nur beworbenen Seiten, sondern alles auf jeder Seite des HTML-Markups mit Mikrodaten versehen. Dabei sollte jeder Link einen kurzen prägnant Titel, eine leicht lesbare kurze Beschreibung sowie ein Bild enthalten; an dieser Stelle bloß keine SEO-Optimierung. Die Informationen sollten sich an ein qualifiziertes und nicht an ein „Top-of-Funnel“ Publikum richten.
  3. Open Graph als Markup verwenden. Es gibt keinen einheitlichen, standardisierten Weg, welche Informationen die User Agents der verschiedenen Messaging-Plattformen von einer Website einsammeln. Oft geben sich die Mikrobrowser als Twitter- oder Facebook-Bots aus, um für die Link-Vorschau Mikro-Inhalte von einer Site zu holen. Da sich aber jede Plattform anders verhält und man nicht wissen kann, wer die Seite nach Informationen durchsucht, ist die Verwendung von Open Graph empfehlenswert.
  4. Spezielle Bilder für Link-Vorschauen innerhalb von Mikrobrowsern verwenden. Einer der häufigsten Fehler in diesem Kontext, ist die Verwendung von Hero-Images, oft abstrakte oder kontextlose Stockbilder, die als Teaser wenig überzeugend sind. Wer spezielle Bilder für die Link-Vorschau innerhalb von Mikrobrowsern verwendet, kann darüber hinaus zwischen Seitenaufrufen von Browsern und Seitenaufrufen von Mikrobrowsern unterscheiden. Gibt man der Bilddatei einen eindeutigen Namen, kann man zählen, wie oft diese aufgerufen wurde und Rückschlüsse darauf erhalten, wie viele neue Benutzer von einem Mikrobrowser aus gestartet sind. Dies ist eine seltene Gelegenheit, die Blackbox „Direct Traffic“ etwas transparenter zu machen.
  5. webinale – the holistic web conference

    Diversity matters – Onlinemarketing 2020

    mit Astrid Kramer (Astrid Kramer Consulting)

    Das Recht auf Privatsphäre – eine Chance für UX

    mit Lutz Schmitt (Lutz Schmitt Design & Consulting)

    The Revenge of Structured Data

    mit Stephan Cifka (Performics Germany GmbH)

    IT Security Summit 2020

    Zero Trust – why are we having this conversation?

    mit Victoria Almazova (Microsoft)

    Digitaler Ersthelfer

    mit Martin Wundram (DigiTrace GmbH)

  6. Auf alle Mikrobrowser vorbereiten. Es gibt keine Konsistenz, wenn es um die Darstellung eines Links geht. Jeder Mikrobrowser zeigt den gleichen Link anders an. Zum Beispiel verwendet WhatsApp nur das erste angegebene Bild, das es findet; iMessage sucht auch nach Video-Tags und zeigt diese an; die meisten Mikrobrowser verwenden das Favicon. Auf der Grundlage dieser Informationen kann man eine Hierarchie erstellen und sich entsprechend vorbereiten, den verschiedenen Mikrobrowsern das zu geben, wonach sie suchen.
  7. Weniger ist mehr – nur ein Favicon annotieren. Die meisten Mikrobrowser nutzen das Favicon. Zwar ist es oft üblich, 4–5 Favicons aufzulisten, aber dies führt zu Verwirrung, wenn die User-Agenten die Website nach Inhalten für die Link-Vorschau absuchen.Neben Bilder können auch kurze Video-„Nanostorys“ oder animierte GIFs für die wenigen Mikrobrowser, die derzeit Video anzeigen (hauptsächlich iMessage) genutzt werden. Kurze Video-Geschichten und animierte GIFs funktionieren besonders gut, wenn es darum geht, die Nutzer zum Klicken auf einen Link zu animieren.Nur Videos im MP4-Format werden automatisch wiedergegeben, nicht aber adaptive Videostreams im HLS- oder DASH-Format. Letztere müssen angeklickt werden. Wenn MP4-Videos automatisch abgespielt werden, sind sie standardmäßig stumm geschaltet und geloopt. Wer Videos verwendet, sollte also sicherstellen, dass diese auch ohne Ton funktionieren oder alternativ Untertitel hinzufügen. Videos sollten kurz und nicht zu groß sein (max. 720p).
  8. Performance ist nach wie vor wichtig. Obwohl Mikrobrowser keine mit Javascript oder Cookies einhergehenden Leistungsprobleme kennen, gibt es doch potenzielle Latenzprobleme. Mikrobrowser sind (noch) nicht wie normale Browser optimiert. Sie rufen die Webseite auf, führen einen Scan durch, sammeln die annotierten Informationen ein, um sie dann zu rendern. Dies geschieht jedoch nicht parallel, sondern sequenziell. Damit iMessage ein Video automatisch abspielt, holt es zuerst das Favicon, lädt es herunter und verwirft es, macht dann dasselbe mit den kommentierten Bildern, bevor es schließlich das Video erhält. Dies führt zu einer Latenzzeit bei der Anzeige der Link-Inhalte. Dauert es zu lange, stoppt der Mikrobrowser den Prozess und hinterlässt ein leeres Favicon – eine verpasste Chance.
  9. Automatisieren der Bilderzeugung und -anreicherung. Es gibt viele weitere Möglichkeiten die Links für die Mikrobrowser zu verbessern. Zum Beispiel können dynamisch Bilder erstellt werden, die den aktuellen Lagerbestand widerspiegeln, verfügbare Farben anzeigen, Preise in Echtzeit aktualisieren, zeigen, wie viele Personen einen Artikel gelesen haben und wie lange das Lesen eines Artikels dauert. Diese Stufe der Bildverwaltung kann jedoch beträchtliche Zeit und Mühe in Anspruch nehmen. Glücklicherweise gibt es kostenlose und kommerzielle Bildverwaltungstools und Digital Asset Management-Systeme, die einen Großteil der sich wiederholenden, zeitraubenden und langweiligen Aspekte dieser Aufgabe automatisieren.

Gespräche innerhalb Mikrobrowser sind privat und wir haben keinen Einblick, was in diesen Blackboxes vor sich geht. Das soll auch so bleiben. Glücklicherweise können wir die Privatsphäre der Benutzer respektieren und trotzdem dazu beitragen, die Link-Vorschauen so ansprechend wie möglich zu gestalten. Beileibe nicht vollständig, sind diese acht Tipps ein guter Ausgangspunkt dafür, gut designte Link-Vorschauen für Websites zu entwickeln.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Abonnieren
Benachrichtige mich bei
guest
0 Comments
Inline Feedbacks
View all comments
X
- Gib Deinen Standort ein -
- or -