Open network inspector how to#

The network debugger, which lets you inspect and analyze outgoing HTTP requests sent from the page (or embedded frames). This is particularly useful for inspecting injected tracking scripts and custom HTML elements added by tag management solutions. The element inspector, which lets you look at the dynamic representation of the web page ( Document Object Model). The most useful tools we’ll focus on are: Note that on Safari, you’ll want to open Safari -> Preferences -> Advanced and check the button next to Show Develop menu in menu bar.Īll of the browsers above utilize a similar set of developer tools with just small differences in the UI and the chosen semantics. The image above lists the keyboard shortcuts for opening the developer tools in various browsers and operating systems. Your best friend in debugging issues with your web analytics and tag management systems in the web browser are the browsers’ own developer tools.ĭeveloper tools are a suite of utilities that you can use to investigate various different aspects of the dynamic web page the user is inspecting. Subscribe to the Simmer newsletter to get the latest news and content from Simo Ahava into your email inbox! However, the guide’s topics can be extended to any web analytics tools and tag management solutions out there, because the use cases are universal. In the guide, we’ll use Google Analytics 4 and Google Tag Manager as examples. But most of all we’re going to use browsers’ own developer tools, as they are always the best source of truth for anything that happens within the browser window.

There are plenty of excellent browser extensions for helping you debug, and we’ll discuss these in the guide, too.

Open network inspector how to#

One of the key skills for anyone working with web analytics and tag management is understanding how to identify where things went wrong, why they went wrong, and ideally how to fix them.