When I started using GTM, I was wondering when to use DOM Ready as a trigger type.
This course is the reason why I got familiar with DOM and, by accident, got an answer to this GTM related question of mine: What does this DOM Ready trigger type mean?
Here is a short description for other beginners who are wondering the same thing.
How does a browser render a web page?
I’m not going to dig deep into this. If you are interested in details, see this video of Ryan Seddon explaining the basics of rendering a web page.
Here are the main steps in rendering the page:
Look at the first blue boxes. Parsing the HTML and CSS creates the DOM tree.
So that’s how easy it is: When HTML and CSS of your site have been parsed, that’s when your page is DOM Ready.
Which trigger type to choose in GTM?
When creating a trigger that fires in Page View, you have three options.
- DOM ready trigger fires when browser has built the skeleton of the page = parsed HTML and CSS. So the page may not look that good yet, but there is something rendered to a page.
- Page View trigger fires immediately when browser starts parsing the site even though nothing would be built. Some of the page visitors might leave before the site has fully loaded but the trigger has already been fired.
- Window Loaded trigger fires when the page is fully loaded.
Hopefully you got an answer for your question!