Page Overlay

A Page Overlay is a type of graphical window that appears over actual content of a web page while it is being displayed. Page Overlays can be used to sign up for newsletters, as banners or as an instrument in web analytics. It is common for page overlays to be used in web analytics to add more information to a website, and this information is then displayed at the same time as the existing content.

Page Overlay in Web Analytics[edit]

Web analytics tools typically display data that are not directly visible. For example, if a site is selected in Google Analytics and initial statistics are visible, that data has no apparent relation to the actual appearance of the site - the visual counterpart is missing. A page overlay can help with this, and comes with many tools already integrated. Using the page overlay, the data from the web analytics tool can be used for the graphical appearance of a website and displayed according to its source.

For example, if most users click on the first hyperlink in the main menu, a certain percentage is displayed right next to this link, based on all users of the website for the calculation. With page overlays, this happens analogous to all other links. For example, data from web analytics are given a graphic context that provides a resourceful source of site changes, such as increasing usability or conversions. Page Overlays enable a visual evaluation of website content.[1]

How it works[edit]

In order to call up a Page Overlay within web analytics software, the software has to be already connected with the website. This normally happens through a tracking code that has to be implemented. As soon as a user visits a website, the tracking code registers it and passes the data on to the software.

If the web master now wishes to display the website with a Page Overlay, they have to click on the desired function in the software. This then accesses the tracking data and begins a new session and shows information to links on the website thanks to a HTML-injection. The latter is responsible for the visualization of overlays. [2]

  • Google Analytics: The tool here is InPage-Analytics (previously: Site Overlay) and it's available in the content area in standard reports. It's important to highlight the option of dividing data into segments. That is, for example, how traffic becomes visible, when it is generated through paid ads.
  • Piwik: This is a Page Overlay function that you can access via the Action-Report. A new tab will appear on the website showing statistical information. Piwik also has a sidebar that can help you look up individual data, like for example, the period of observation - and important factors like length of stay or bounce rate.

Significance for Web Analytics[edit]

Page Overlays are used to display data from web analytics visually, but also to put them into the meaningful context of the website. This is the decisive advantage of page overlays: they enable the analysis of user behavior regarding the layout, design and content of the website. Links that are clicked more often are displayed just like ones that are barely clicked at all.

The usability of a website can be increased significantly by using Page Overlays. They can be used to arrange layout, design and content in a way that the click rates increase and users find just what they are looking for. If it's a commercial website, the same can be extrapolated for the conversions: The layout should facilitate user interactions and call to action elements should be positioned to appear above the fold in the visible part of the website. All of these aspects can be analyzed and changed in detail using page overlays.


  1. Google Analytics Page Overlay Accessed on September 16, 2014
  2. How does Google Analytics In-Page Analytics work? Accessed on September 16, 2014

Web Links[edit]