
Website Frame
Website Frame is a third frame type, alongside Canvas Frame and Page Frame, not an element placed on top of either one. It is added to a trial group the same way: a click on its own icon among the frame-type options.
Where a Canvas or Page Frame presents stimuli built inside Labvanced, a Website Frame embeds a real, external, live website directly in the study. This is the frame type behind Labvanced's Web Bridge functionality, used for usability testing, attention studies, and eye tracking on an actual website rather than a recreation of one.
Note
If you plan to use a Website Frame, for embedding your external website or creating one in Labvanced, it is strongly recommended to isolate that frame type in its own task rather than combining it with Canvas or Page Frames in the same trial timeline.
External Website vs. Custom Website
There are two types of websites supported by this frame.
External Website
Embeds a real, live website by URL, with three checkboxes to control the embedded browser chrome: Show URL bar, Show back button, Show forward button. Requires the Web Bridge Chrome extension to be installed, see the full Labvanced Web Bridge guide for installation steps.
Custom Website
Coming soon. Builds a website from scratch inside Labvanced instead of embedding a live one. Clicking Edit Code opens a dedicated HTML, CSS, and JavaScript editor with a Variables panel to inject Labvanced variables into the code at runtime, for example a self-checkout kiosk interface built from a CSV-loaded product catalog.
Website Frame properties
A Website Frame has its own frame-level properties, separate from any element placed on it. Set in the Frame Settings panel:
Name: a label to identify the frame within your task (participants never see it)Duration: an optional fixed display time in milliseconds; if left unset, the frame stays on screen until an event or action advances itHide Mouse: hides the participant's cursor while the frame is activeMode: sets whether the frame shows an External Website or a Custom Website, described aboveResolution: a dropdown of presets, or manualWidth/Heightin pixels, sets a fixed virtual resolution that scales to fit each participant's screen, the same model a Canvas Frame uses, so every participant sees the same layout regardless of their actual screen size
For the complete workflow, installing the browser extension, adding a Website Frame, selecting Areas of Interest, and what gets tracked, see the full Labvanced Web Bridge guide or the Website Frame Eye Tracking Walkthrough for a start-to-finish task flow.
Watch the walkthrough in this video:
Further Reading
Frames
The hub for all frame types and the properties every frame shares.
Labvanced Web Bridge
The full guide: installing the extension, adding a Website Frame, selecting AOIs, and what gets tracked.
Website Frame Eye Tracking Walkthrough
A start-to-finish task flow for tracking gaze on a real embedded website.