Speed Up Your Website With Google Tag Manager

Among the many benefits of Google Tag Manager, you’ve most likely heard about how easy it is to implement all kinds of great tracking to your website. Or maybe, you’ve heard about how it makes it easy to manage your complicated tagging across your website or websites, with great features like version control or the new workspaces.

Many of these features replace existing technical methods for tracking interactions on a site or publishing changes. But if you’re outside the Analytics industry or not a developer, you might be left wondering what the fuss is about. I’m looking at you Digital Marketers!

Let’s talk about an immediate, tangible benefit of implementing Google Tag Manager. Site Speed. Yup, that’s right – implementing Google Tag Manager can decrease the amount of time it takes your website to load. Got your attention yet?

Fast Site Speed Is No Longer Optional

We, Bounteous, as well as the collective web industry, have been talking about site speed for years. Site speed is one of those things that touches everything – User Experience, Organic Rankings, Paid Search Performance, and most importantly, it affects our overall conversion rate.

Every industry event I’ve attended for the past 3 years has talked about this new “mobile” thing that is changing everything. Generic takeaways aside, the truth is that mobile HAS changed the way we do… everything. We use the internet in different ways, we search differently, we browse differently. Because of all of this, we now build our websites differently.

Google came out with a tool this year to help us test our websites for mobile friendliness and site speed. From their results page, we get factoids like this one: “Nearly half of all visitors will leave a mobile site if the pages don’t load within 3 seconds.” Let that one sink in for a minute.

Need more convincing? KissMetrics claims that “A 1-second delay in page response can result in a 7% reduction in conversions.” Let me put that more plainly. A slow website can cause you to lose money.

So, Where Does Google Tag Manager Fit In?

Back to the good stuff, let’s talk about why Google Tag Manager (GTM) plays a role in all of this. No surprises here, we’re not the first to write about this subject and we won’t be the last. But unlike some sites, we do this type of stuff literally every day with our clients, so you’re getting this info on pretty good authority.

There are two main reasons why GTM will speed up your website:

Code Consolidation
and CleanupAsynchronous
Loading

If those concepts mean nothing to you, no worries! Buckle-up and get ready for the basics.

Code Consolidation and Cleanup

People tend not to touch something until it’s broken, or even then until they have the time/budget/motivation. Take Google Analytics for example. Universal Analytics launched years ago, with amazing new features and better everything, and I still constantly see people that are using the previous versions. I can’t believe how many time’s I’ve had to say this at my trainings: “Your website analytics tracking is over 7 years out of date.”

Google Tag Manager is one of those intentional changes. You need to decide to use Google Tag Manager. And you can dip your toes in and throw on something like tracking File Download Links or you can really embrace the concept and cannonball off the high dive.

It’s the latter that will experience the benefits from this section.

Spring Cleaning – Audit Your Tags!

Ok, we’ll start with the easiest. When you start migrating to Google Tag Manager, you’re forced to make the tough decisions. Why did we put this tag on our website in the first place? Is it still needed? Are we even still paying for that vendor?!

You have to make the decision to add new tags to Google Tag Manager, so hopefully, this comes with a healthy dose of self-reflection and cost-benefit analysis.

Reduce the tags that load on your website and, surprise, it goes faster!

Granular Trigger Capabilities – Rule Them All!

Every website is different. The technology underlying your website might be completely different than mine. Think about your current setup and how easy/difficult it is for you to fire a specific tag on a specific page or after a specific action.

Google Tag Manager absolutely kills it in this space. It makes it stupid simple to set certain tags to fire on specific pages. With a little bit of extra setup, you can easily block certain tags from firing on mobile/desktop, logged-in users/new users, and more.

We’re back to the same outcome – with the ease of setting up these custom triggers, you’re only firing tags when you need to, which means less time spent loading third-party resources.

Consolidating Important Information – Optimize 4 Lyfe

The tags we set up often need us to fill in extra pieces of information to make them work correctly. For instance, consider a product recommendation vendor. We might need to pass them the SKU of the product page that loads as well as a customer ID.

This information might already be available on the page, but accessing it may require a JavaScript variable or jQuery lookup.

Enter the concept of a data layer. Think of the data layer as the SparkNotes/CliffNotes for your page. We pull out all the important information and put it in one easy-to-access location. Your tags don’t have to read the whole page to find what they need, they can all use the same information that’s been consolidated on the data layer.

Google published a case study with Fashion retailer Dafiti published about this concept, and claimed a huge boost in site speed through the code consolidation and cleanup that went into implementing Google Tag Manager.

In the area of performance, Google Tag Manager’s ability to eliminate redundancy has had a clear impact. “A data layer proved to be very useful to send the same value over different tags,” Mise explains. The outcome for the user? Dafiti reports that the site is 25% faster since implementation.

Removing Excess Code from the Page – Bye Bye Old Code

Remember that line about people having trouble changing? The way that we track on-page interactions has fundamentally changed over the years. Someday, you’ll tell your grandchildren of the era when you had to manually include a bit of JavaScript on every link that you wanted to track. Of course, by then we’ll be able to track users thinking about words on the page, but the scary story is real.

If you still have individually tagged links on your website, I have some big news.

Kidding aside, I actually still see this setup way more than I would expect, so this benefit can be really be significant. I’ve been there, I used to tag my links this way.

Instead of manually adding an extra bit of code on every link, we can use global functions that target all the links on the page that we want to target. You may have heard about jQuery, which came out over ten years ago, or you may be a JavaScript purist.

If you still tag links individually, like PDF downloads, migrating to Google Tag Manager means you can use a single trigger/tag setup to track all PDF downloads on your site. This can literally mean removing hundreds or thousands of lines of code from your site.

Your setup will be more efficient and way easier to maintain. Oh, and, less code on your site means your site will load faster.

Asynchronous Loading

Lastly, let’s talk about the concept of “asynchronous.” Again, this is not a new concept. Google Analytics came out with an asynchronous script version in 2009 and many third-party tags also use the same approach.

This topic deals with how the pieces of our pages load and the impact that has on users. Typically, the parts of the page load in order, waiting for each component to load before moving on to the next component. This is called synchronous.

When certain elements are set to load asynchronously, they branch out and begin to load simultaneously. The page continues to load things in order while the asynchronous components load separately.

Think about going to the grocery store with a list of items and multiple people. There are two prevailing schools of thought. One, you may walk the aisles together, collecting items from the list one after another. The other idea is to break the list into pieces, sending members of your party throughout the store gathering items and then reconvening with a completed list. For now, let’s just skip over my wife’s complaints that I can never find the right peanut butter or take time to read the labels.

By splitting up and gathering the items simultaneously, we’re speeding up the process. If we get stuck on one particular item, it’s not holding up the rest of the list from completing. Surprise, this is my favorite way to shop!

By moving tags into Google Tag Manager, these tags will now automatically attempt to load asynchronously, which can mean a big benefit for your page speed. Depending on the tags and how you add them in GTM, some tags will still slow down your page and may still load synchronously, but the majority will see improvements.

Another Google case study, this one with Rails Europe, talks about consolidation and cleanup but also talks about how this concept helped speed up page load time.

Another huge benefit is that all tags now load asynchronously, so they don’t slow down the sites or get in each other’s way. Each tag fires immediately, calling to Google Tag Manager, while the page simply keeps loading. This has had a direct impact on page load speed – site pages load 20% faster today than they did before implementation.

Final Thoughts

If you’ve been on the fence about Google Tag Manager or just wondering what the hype is all about, it’s time to get started. There are many, many benefits to using any tag management system and especially Google Tag Manager. While not everyone on your team will get excited about version control, live debugging, and other technical items – site speed is something everyone can and should care about.

Lastly, consider talking to a professional to help with your implementation. A lot of the speed benefits come from that consolidation and cleanup phase. On one hand, this tells us that a smarter implementation can result in a faster website. On the other hand, this warns us about how redundancy and implementation without a strategy can have real-world, negative effects on our user experience, our rankings, our performance, and most importantly, our conversions.