Illustration einer Produktseite einer Website in Labvanced mit einem grün umrandeten verfolgten Bereich, Blick-Hitzekartenpunkten, einem Cursor und Scroll-Icons, neben dem Titel Website-Blickverfolgung und Verhaltensverfolgung

Website-Blickverfolgung & Verhaltensverfolgung

Labvanced Web Bridge ist eine kostenlose Chrome-Erweiterung für Website-Blickverfolgung und Verhaltensverfolgung. Sie bettet eine Live-Website in eine Labvanced-Studie ein und zeichnet auf, wo die Teilnehmer schauen, klicken und scrollen, unter Verwendung von Labvanceds Webcam-Blickverfolgung, die in einer von Experten begutachteten Studie (Kaduk et al., 2024) gegen ein EyeLink 1000 validiert wurde.

Inhaltsverzeichnis

Was ist Labvanced Web Bridge?
Was kann Labvanced Web Bridge tun?
Wie sich Web Bridge unterscheidet
Forschung, die Sie mit Labvanced Web Bridge durchführen können
Gesammelte Daten
Genauigkeit der Benchmarking
Wie Labvanced Web Bridge eine echte Website verfolgt
Wie sich Website-Verfolgungsdaten verhalten
Einrichten von Labvanced Web Bridge
Einschränkungen
Häufig gestellte Fragen

Was ist Labvanced Web Bridge?

Labvanced Web Bridge ist eine kostenlose Chrome-Erweiterung, die Labvanced mit echten, externen Websites verbindet. Normalerweise kann eine Forschungsplattform den Teilnehmern nur innerhalb ihrer selbst erstellte Stimuli zeigen, wie Bilder, Videos, Formulare und benutzerdefinierte Seiten. Web Bridge ändert das: Es ermöglicht einem Forscher, eine tatsächliche, live Website, wie eine Produktseite, eine Nachrichtenseite oder eine Web-App, direkt in eine Studie zu bringen und dann zu messen, wie sich die Teilnehmer darauf verhalten.

Es ist besonders nützlich für kontrollierte UX- und Verhaltensforschung, bei der es wichtiger ist, wie jemand auf das Echte reagiert, als auf eine Nachbildung. Es ist nicht darauf beschränkt.

Was kann Labvanced Web Bridge tun?

Web Bridge ist Teil der vollständigen Experimentplattform von Labvanced, sodass dieselbe Studie zufällig bestimmen kann, welche Version einer Seite ein Teilnehmer sieht, Website-Verfolgung mit anderen Messungen von Labvanced kombinieren kann und alles in einem konsistenten Format exportiert.

Echte Websites, keine Mockups

Teilnehmer interagieren mit Ihrer echten Website, live, innerhalb der Studie. Was verfolgt wird, ist die echte Seite, die Ihre Benutzer tatsächlich sehen werden.

Alles an einem Ort

Blick, Klicks, Hover und Scrollen werden alle am selben verfolgten Element erfasst, sodass jedes Signal ohne zusätzliche Arbeit übereinstimmt.

Verfolgt Elemente, nicht Bildschirmpositionen

Markieren Sie etwas einmal. Die Verfolgung folgt es korrekt durch Scrollen, Ändern der Größe und sogar Pop-ups oder Menüs, die nur nach einem Klick erscheinen.

Wie sich Web Bridge unterscheidet

Andere Möglichkeiten, eine echte Website zu testen, unterscheiden sich darin, was sie von der Seite benötigen und was sie darauf aufzeichnen können.

Die Frage	Andere Ansätze	Web Bridge
Muss die Website geändert werden?	RealEye, ein Webcam-Blickverfolgungsdienst, benötigt sein JavaScript-SDK auf der Seite und ein `data-re-aoi-name`-Attribut auf jedem verfolgten Element für seinen eingebetteten Website-Test. Microsoft Clarity, ein Heatmap- und Sitzungsaufzeichnungstool, benötigt seinen Tracking-Code, der auf der Seite installiert ist.	Nein. Sie fügen die URL der Website ein, die Sie testen möchten, und markieren Elemente, indem Sie sie im Labvanced-Editor anklicken.
Kann es aufzeichnen, was innerhalb einer eingebetteten Seite passiert?	Ein einfaches Einbetten einer anderen Website, wie das Labvanced `I-Frame`-Objekt, kann von der umgebenden Seite nicht gelesen werden, sodass Klicks und Scrollen darin nicht erfasst werden. Microsoft Clarity kann auch keine Drittanbieter-Iframes erfassen.	Ja. Die Erweiterung liest Klicks, Hover, Mausbewegungen und Scrollen aus der eingebetteten Seite.
Kommt es mit Scrollen und Seitenänderungen zurecht?	Der eingebettete Website-Test von RealEye analysiert einen Screenshot der Seite und unterstützt kein horizontales Scrollen.	Ja. Markierte Elemente werden durch Scrollen, Ändern der Größe, Animation und Inhalte, die nach dem Öffnen der Seite geladen werden, nachverfolgt.
Kommen die Daten von echten Teilnehmern?	Prädiktive Werkzeuge wie Attention Insight schätzen die Aufmerksamkeit mit einem KI-Modell, anstatt echte Teilnehmer aufzuzeichnen.	Ja. Es zeichnet auf, wo echte Teilnehmer schauen und klicken.
Benötigt es spezielle Hardware?	Pupil Labs, ein Hersteller von Blickverfolgern, bietet ein Web-AOI-Tool an, das seinen Neon-Blickverfolger benötigt.	Nein. Es verwendet die Webcam des Teilnehmers.

Für das, was eine KI-vorhergesagte Heatmap Ihnen sagen kann und was nicht im Vergleich zur Aufzeichnung echter Teilnehmer, siehe KI kann vorhersagen, wo Sie schauen werden. Es weiß immer noch nicht, was Sie tun werden.

Letzte Überprüfung: 2026-09-25. Die Details wurden mit RealEyes Wissensdatenbank, Microsoft Claritys Einrichtungsdokumentation, Attention Insights Wissensdatenbank, und Pupil Labs' Web-AOI-Dokumentation abgeglichen. Die Browserbeschränkung bei der Lesung eingebetteter Seiten ist in MDNs Dokumentation zur Same-Origin-Policy beschrieben.

Forschung, die Sie mit Labvanced Web Bridge durchführen können

Mock-Laufschuh-Produktseite mit einer Blick-Hitzekarte über dem Schuhfoto, Produktnamen, Preis, Farbmustern und Schaltfläche 'In den Warenkorb'

E-Commerce

Betten Sie eine echte Produktseite ein. Sehen Sie, welche Fotos die Menschen tatsächlich ansehen, welche Schaltflächen angeklickt werden und wie weit sie scrollen, bevor sie etwas in ihren Warenkorb legen.

Mock-Nachrichtenseite mit einer Blick-Hitzekarte, die sich auf die Artikelüberschrift und das Berg-Leitfoto daneben konzentriert

Nachrichten & Medien

Betten Sie einen aktuellen Nachrichtenartikel ein. Finden Sie heraus, welche Überschriften zuerst wahrgenommen werden und wie sich die Aufmerksamkeit ändert, je länger ein Artikel wird.

<div class="content-row" style="display: grid; grid-template-columns: 42% 1fr; align-items: center; gap: 24px; box-sizing: border-box; padding: 20px 20px 20px 20px; margin-bottom: 16px; border-radius: 14px; border: 1px solid #eaeaea; box-shadow: 0 2px 6px rgba(0,0,0,0.06);">
  <img src="/content_imgs/technology/website-eye-tracking/usecase_navigation_testing.webp" loading="lazy" alt="Mock-Website-Navigationsleiste mit dem geöffneten Dropdown-Menü 'Lösungen' und einem gestrichelten Pfad, der die Bewegung vom Lösungen-Menü zu den Preisen verfolgt." style="width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; align-self: center;"/>
  <div style="align-self: stretch; display: flex; flex-direction: column; justify-content: center;">
    <h3 style="margin: 0 0 6px 0; padding-top: 0;">Navigations-Test</h3>
    <p style="margin: 0; line-height: 1.4;">Binden Sie ein echtes Menü oder einen mehrseitigen Ablauf ein. Sehen Sie, ob die Leute tatsächlich finden, wonach sie suchen, und wo sie zögern.</p>
  </div>
</div>

<div class="content-row" style="display: grid; grid-template-columns: 42% 1fr; align-items: center; gap: 24px; box-sizing: border-box; padding: 20px 20px 20px 20px; margin-bottom: 16px; border-radius: 14px; border: 1px solid #eaeaea; box-shadow: 0 2px 6px rgba(0,0,0,0.06);">
  <img src="/content_imgs/technology/website-eye-tracking/usecase_ab_testing.webp" loading="lazy" alt="Zwei Mock-Bettungslandingpages mit den Bezeichnungen A und B, mit unterschiedlichen Überschriften und Farben der Schaltfläche 'Jetzt einkaufen', jede mit der Anmerkung des Anteils der Besucher, die geklickt haben, 42 Prozent und 67 Prozent, sowie einem Fortschrittsbalken." style="width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; align-self: center;"/>
  <div style="align-self: stretch; display: flex; flex-direction: column; justify-content: center;">
    <h3 style="margin: 0 0 6px 0; padding-top: 0;">A/B-Tests</h3>
    <p style="margin: 0; line-height: 1.4;">Binden Sie zwei Versionen derselben Seite ein, weisen Sie die Teilnehmer zufällig jeder Version mit Labvanceds integriertem Ausgleich zu und vergleichen Sie die Ergebnisse direkt.</p>
  </div>
</div>

<div class="content-row" style="display: grid; grid-template-columns: 42% 1fr; align-items: center; gap: 24px; box-sizing: border-box; padding: 20px 20px 20px 20px; margin-bottom: 16px; border-radius: 14px; border: 1px solid #eaeaea; box-shadow: 0 2px 6px rgba(0,0,0,0.06);">
  <img src="/content_imgs/technology/website-eye-tracking/usecase_developmental_psychology.webp" loading="lazy" alt="Mock-Quizseite für Kinder, die fragt, welches Tier ein Löwe ist, mit einer Löwenillustration und drei Antwortkarten (Löwe, Elefant, Zebra), und einer Wärmebildkarte, die am stärksten auf der Löwenillustration und der Löwenantwortkarte ist." style="width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; align-self: center;"/>
  <div style="align-self: stretch; display: flex; flex-direction: column; justify-content: center;">
    <h3 style="margin: 0 0 6px 0; padding-top: 0;">Entwicklungspsychologie</h3>
    <p style="margin: 0; line-height: 1.4;">Binden Sie eine echte Bildungswebsite für Kinder ein und verfolgen Sie, wie junge Teilnehmer diese navigieren. Dies ist nützlich für die Forschung zur digitalen Kompetenz und zur Entwicklung von Aufmerksamkeit im Internet.</p>
  </div>
</div>

<div class="content-row" style="display: grid; grid-template-columns: 42% 1fr; align-items: center; gap: 24px; box-sizing: border-box; padding: 20px 20px 20px 20px; margin-bottom: 16px; border-radius: 14px; border: 1px solid #eaeaea; box-shadow: 0 2px 6px rgba(0,0,0,0.06);">
  <img src="/content_imgs/technology/website-eye-tracking/usecase_media_political_psychology.webp" loading="lazy" alt="Mock-Nachrichtenseite mit der Überschrift 'Können wir den Nachrichten in einer polarisierten Welt trauen?', einem Foto von Menschen vor einem Gebäude, und einer Wärmebildkarte über der Überschrift, dem Foto und dem Autorenhinweis." style="width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; align-self: center;"/>
  <div style="align-self: stretch; display: flex; flex-direction: column; justify-content: center;">
    <h3 style="margin: 0 0 6px 0; padding-top: 0;">Medien- und Politische Psychologie</h3>
    <p style="margin: 0; line-height: 1.4;">Binden Sie einen echten Nachrichtenartikel ein und verfolgen Sie, ob die Augen der Menschen jemals den Autorenhinweis oder die Quelle erreichen, bevor sie entscheiden, ob sie ihm vertrauen.</p>
  </div>
</div>

<br>

## Gesammelte Daten

Das Einbetten einer echten Website verwandelt gewöhnliches Surfen in Forschungsdaten. Mit Web Bridge können Sie herausfinden:

- Wohin Besucher zuerst schauen und wie lange
- Welche Elemente nie angesehen werden oder ganz übersprungen werden
- Wie die Aufmerksamkeit von einem Teil einer Seite zu einem anderen wandert, bevor jemand klickt
- Ob das, was die Leute klicken, mit dem übereinstimmt, was sie zuerst angesehen haben, oder ob Aufmerksamkeit und Handlung in unterschiedliche Richtungen lenken
- Wie lange die Leute in einem Bereich verweilen, was bedeuten kann, dass sie genau lesen oder auf der Suche nach etwas feststecken

Wählen Sie einfach etwas auf der Seite aus, wie z.B. ein Produktfoto, eine Überschrift oder einen Button. Hier sind die aufgezeichneten Daten dafür:

| Sie erhalten | Was es Ihnen sagt |
|-----------|-------------|
| **Blick** | Wohin die Menschen tatsächlich schauen und wie lange |
| **Positions des Elements** | Der genaue Standort und die Größe des Elements, das Sie verfolgen, wird live aktualisiert, während die Seite scrollt |
| **Klicks** | Was die Leute klicken und genau wo |
| **Hover** | Was die Aufmerksamkeit fängt, auch ohne Klick |
| **Mausbewegung** | Wie der Cursor über die Seite bewegt |
| **Scrollen** | Wie weit die Leute scrollen, bevor sie handeln |

Jedes Ergebnis lässt sich sauber in CSV, XLSX oder TSV exportieren, bereit zur Analyse.

<!-- [SCREENSHOT: Eine echte E-Commerce- oder Nachrichtenwebsite, eingebettet über Website Frame im Labvanced-Editor, mit mehreren Website-AOIs sichtbar als farbige (grüne) Überlagerungen auf spezifischen Elementen wie einem Produktbild und einem 'In den Warenkorb'-Button] -->

<!-- [SCREENSHOT: Eine Vorschau auf echte exportierte Web Bridge-Daten, eine Datentabelle oder Exportansicht, die Blickkoordinaten, Klickereignisse und Zeitstempel zeigt, die gegen eine benannte Website-AOI aufgezeichnet wurden und den Stil des 'Vorschau der gesammelten Daten'-Bildes auf der Labvanced-Augenverfolgungstechnologieseite entsprechen] -->

<br>

## Genauigkeit Benchmarking

Web Bridge kombiniert zwei der Kernmessmaschinen von Labvanced. Blickdaten stammen aus Labvanceds Webcam-Augenverfolgung, getestet an einem professionellen Augen Tracker (dem EyeLink 1000) in einer peer-reviewten Studie: eine Gesamtgenauigkeit von 1,4° und eine Präzision von 1,1°, die sich auf 1,3° Genauigkeit und 0,9° Präzision im Zentrum des Bildschirms verbessert (Kaduk et al., 2024).

Klick-, Hover- und Cursor-Daten stammen aus Labvanceds [Mausverfolgung](/content/technology/de/mouse-tracking/) und werden auf dasselbe verfolgte Element aufgezeichnet wie die Blickdaten.

<br>

## So verfolgt Labvanced Web Bridge eine echte Website

Web Bridge ermöglicht kontrollierte Verhaltensforschung auf Live-Websites von Drittanbietern: Teilnehmer interagieren mit der echten Seite, während Labvanced ihre Augenbewegungen, Klicks, Hover und Scrollen aufzeichnet.

Das zu ermöglichen bedeutet, um zwei separate Browserbeschränkungen zu arbeiten. Erstens setzen viele Websites einen Sicherheitsheader, `X-Frame-Options` oder `Content-Security-Policy`, um sich speziell daran zu hindern, in eine andere Seite eingebettet zu werden. Web Bridge hebt diese Einschränkung nur in Browser-Tabs auf, in denen Labvanced geöffnet ist. Andere Tabs sind nicht betroffen, und die Veränderung wird entfernt, wenn der Tab geschlossen oder Labvanced verlassen wird. Zweitens, selbst nachdem eine Seite eingebettet wurde, erlauben Browser normalerweise nicht, dass Mausaktivitäten innerhalb dieser eingebetteten Seite die Seite darum herum erreichen. Dies ist eine separate Einschränkung. Die Erweiterung von Web Bridge behandelt auch dies, indem sie Klick-, Hover- und Bewegungsereignisse direkt von innerhalb der eingebetteten Seite liest und sie in Echtzeit an die Studie zurücküberträgt.

Um es zu verwenden, fügen Forscher ein `Website Frame` zu einer Studie hinzu und weisen es auf eine echte URL. Von dort ist das Markieren, was verfolgt werden soll, eine einfache Klick-und-Auswahl-Aktion: Klicken Sie auf ein Produktfoto, eine Überschrift oder einen Button, und Labvanced fixiert sich auf dieses genaue Element, nicht auf dessen Position auf dem Bildschirm. Labvanced überwacht die Seite kontinuierlich, sodass das Tracking automatisch an das Scrollen angepasst wird, für Elemente, die nur nach einem Klick erscheinen, wie ein Pop-up oder ein Dropdown, und sogar für Animationen oder Elemente, die sich selbst ändern oder bewegen. Jedes verfolgte Gebiet ist ein einfaches Rechteck, und nichts wird automatisch verfolgt: Ein Forscher wählt genau aus, was wichtig ist, bevor eine Studie durchgeführt wird.

Eigenschaft	Speifikationen
Browser	Google Chrome
Basis	Die von Labvanced peer-reviewed Webcam-Eye-Tracking-Technologie (Kaduk et al., 2024) und das Maustracking
Was es verfolgt	Blickverhalten, Klicks, Hover und Scrollen auf jedem von Ihnen gewählten Element
Datenschutz	Funktioniert nur innerhalb von Websites, die Labvanced einbettet. Texte in Passwort- und Zahlungsfeldern werden niemals gelesen

Wie Website-Tracking-Daten sich verhalten

Für das Design einer Studie zu diesen Daten gibt es einige Verhaltensweisen, die man im Voraus kennen sollte.

Koordinatenräume unterscheiden sich je nach Interaktionstyp. Klick-, Maus-Down-, Maus-Up- und Maus-Bewegungsereignisse berichten von seitenrelativen Koordinaten, was die Position über den gesamten scrollbaren Bereich der eingebetteten Seite ist, einschließlich allem, was bereits vorbei gescrollt wurde. Hover- und Verlassensereignisse berichten stattdessen von elementrelativen Koordinaten, was die Position innerhalb des verfolgten Elements selbst ist. Beide verwenden die gleichen Koordinatenbezeichnungen in der Benutzeroberfläche, daher entscheidet man am besten im Voraus, welcher Interaktionstyp für eine Studie erforderlich ist. Die Kombination der beiden in einer exportierten Spalte mischt zwei verschiedene Koordinatensysteme ohne Vorwarnung. Die aufgezeichneten Blickdaten auf einem verfolgten Element nutzen denselben seitenrelativen Raum wie Klicks, sodass sich Blick- und Klickdaten vom selben Element direkt ohne Umrechnung einfügen.

Tracking aktualisiert kontinuierlich, nicht nur beim Scrollen. Die Position und Größe jedes verfolgten Elements wird in jedem Frame neu gemessen, was es dem Tracking ermöglicht, Animationen, CSS-Übergänge und Elemente, die dynamisch ihre Größe ändern, korrekt zu verfolgen, nicht nur beim Scrollen oder Neupositionieren.

Scrollbare Bereiche innerhalb eines verfolgten Elements erhalten ihren eigenen Koordinatenraum. Wenn ein verfolgtes Element ein internes Scrollen hat, wie z.B. ein Chat-Panel oder eine scrollbare Produktliste, wird es als scrollbares Container markiert, wodurch die eigene Scrollposition und die Inhaltsgröße dieses Bereichs separat vom allgemeinen Seiten-Scrolling angezeigt werden, sodass geschachteltes Scrollen nicht mit der äußeren Seite vermischt wird.

Mausereignisse bieten drei Zielmodi. Ein Mausereignis kann für ein spezifisches verfolgtes Element, für ein beliebiges verfolgtes Element ohne spezifische Auswahl oder für überall auf der eingebetteten Seite ausgelöst werden, unabhängig davon, ob es ein verfolgtes Element ist oder nicht. Dies ist nützlich, um breite Interaktionsmuster aufzufangen, ohne jedes Element im Voraus markieren zu müssen.

Einrichtung von Labvanced Web Bridge

Web Bridge ist eine kostenlose Chrome-Erweiterung. Sowohl Sie als auch Ihre Teilnehmer müssen sie installiert haben. Es dauert weniger als eine Minute, und Labvanced führt die Teilnehmer automatisch durch den Installationsprozess, wenn sie sie noch nicht haben.

Für tiefere Verweise, sobald Sie eine Studie aufbauen, siehe Auswählen und Anpassen von Website-AOIs für die vollständigen AOI-Ankersteuerungen. Für das Erstellen von Klick-, Hover- und Bewegungsereignissen siehe Tracking des Mausverhaltens auf einer Website-AOI.

Einschränkungen

Web Bridge funktioniert nur in Google Chrome, und der Forscher sowie jeder Teilnehmer müssen die kostenlose Erweiterung installiert haben. Die Verwendung eines Website Frame in einer Studie erfordert die Ultimate-Lizenz. Einige Seiten können nicht eingebettet werden: amazon.com und ebay.com sind im Editor aufgrund ihres Bot-Schutzes blockiert, und andere Seiten, die Einbettungen erkennen, funktionieren möglicherweise nicht. Web Bridge verfolgt die Elemente, die ein Forscher markiert, anstatt alles auf einer Seite.

Häufig gestellte Fragen

Verfolgt Web Bridge Personen auf anderen Websites?

Nein. Das Tracking beginnt nur innerhalb einer Website, die Labvanced selbst eingebettet hat. Auf jeder anderen Seite verlässt die Erweiterung sofort und liest nichts von der Seite. Sie überprüft nur, ob ein Browser-Tab auf labvanced.com geöffnet ist, um zu entscheiden, wann die Einbettung zulässig ist.

Müssen Teilnehmer etwas installieren?

Ja, dieselbe kostenlose Erweiterung, die Forscher verwenden. Wenn ein Teilnehmer diese noch nicht hat, führt ein Hinweis sie durch die Installation, bevor die Studie beginnt, in der Regel in weniger als einer Minute.

Wie funktioniert das Tracking weiter, wenn sich die Seite ändert?

Jedes verfolgte Element ist auf dem tatsächlichen Teil der Seite fixiert, nicht auf einer festen Bildschirmposition. Labvanced überwacht kontinuierlich die Seite, sodass, wenn ein Teilnehmer scrollt oder neuer Inhalt erscheint, wie ein Popup oder ein sich erweiterndes Menü, oder ein Element sich selbst ändert oder animiert, das Tracking es automatisch verfolgt.

Erkennt es automatisch, was zu verfolgen ist?

Nein, und das ist absichtlich. Ein Forscher markiert genau, was verfolgt werden soll, wie ein Foto, eine Überschrift oder einen Button, indem er direkt im Editor darauf klickt. Nichts wird ohne diesen manuellen Schritt geraten oder verfolgt.

Kann ich Klicks und Mausbewegungen ohne Eye Tracking verfolgen?

Ja. Das Maustracking (Klicks, Hover und Bewegungen) funktioniert unabhängig vom Eye Tracking. Sie können eines, das andere oder beides zusammen auf demselben verfolgten Element aufzeichnen.

Ist diese Daten so genau wie Labvanced's reguläres Eye Tracking?

Ja. Es ist derselbe Motor, validiert gegen ein EyeLink 1000 mit einer Gesamtkorrektheit von 1.4° und 1.3° in der Mitte des Bildschirms (Kaduk et al., 2024). Was hier anders ist, ist die Verwendung auf einer realen externen Website, nicht die zugrunde liegende Genauigkeit.