Is using noscript tags GDPR and CCPA compliant – key considerations for website compliance according to the EU law
Are noscript tags GDPR and CCPA Compliant?
No, noscript tags are not GDPR or CCPA compliant by default. These tags are designed to function when JavaScript is disabled, meaning they bypass JavaScript-based cookie consent tools. Since you cannot control or block noscript tags without JavaScript, they run automatically, potentially without user consent, which violates privacy regulations/GDPR. To ensure your website is compliant, you should remove all noscript tags in third-party scripts, such as those in GTM, Facebook Pixels, to prevent unregulated tracking.
Difference between GTM script and noscript tags and how it affects GDPR
The GTM script tag uses JavaScript for tracking and can be controlled by cookie consent tools, ensuring GDPR compliance when users give consent.
Two common terms associated with GTM are <script>:
<!– Google Tag Manager –>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXXX‘);</script>
<!– End Google Tag Manager –>
And <noscript>:
<!– Google Tag Manager (noscript) –>
<noscript><iframe src=”https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX“
height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
<!– End Google Tag Manager (noscript) –>
In this example, replace GTM-XXXX with your actual GTM container ID. You can generate your unique GTM code directly from your Google Tag Manager Console.
Note: GTM code is always having these two parts, first <script> is inserted in the <head> (according to the instructions as high in the <head> of the page as possible – which is actually also in many cases not the best decision, as it may easily slower the website visualization/speed score), and second shorter (noscript) part in the <body>.
The <noscript> tag loads an invisible iframe that connects to Google Tag Manager, allowing it to track page views and manage tags, such as analytics or marketing scripts, without relying on JavaScript. If you omit this code, tracking may not work for users who have JavaScript disabled, leading to incomplete analytics data or missed marketing tags.
The noscript tag is basically bypassing consent mechanisms and may track data without user approval, which is not GDPR compliant solution. Properly managing noscript tags (even those third-party scripts) is essential to ensure proper data handling and compliance.
GTM script tags – what they are and how they work
A GTM script tag is a JavaScript snippet generated by Google Tag Manager that you embed into your website’s HTML. This tag acts as a container for various tracking tags (like analytics, ads, or remarketing tags), allowing easy management without directly altering the website’s source code. GTM is especially useful for managing LinkedIn Ads, Google Analytics, or Facebook Pixel, offering flexibility and real-time updates for ad tracking and data collection.
To make sure your tracking tags (e.g., for Google Analytics) capture all important data, you should place the GTM script as high as possible in your website’s HTML, typically in the <head> (but there is one big BUT – see below, what it can cause). If you place it lower, the script may load after some key user actions (like page views or clicks) have already occurred. For example, if the script loads late, you might miss tracking a user who quickly navigates away. This can result in lost data, meaning incomplete insights into how users interact with your site. But in reality, you try to find some consensus – to get as much data as possible and also not influence the website speed (and the marketing campaign outcome) in a negative way.
This particular <script> GTM code in the head is the driving force behind all the tracking processes occurring on a website. It is responsible for establishing the dataLayer, activating triggers for execution, dispatching tags, and more.
Here’s an example of a GTM script tag:
<!– Google Tag Manager –>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXXX‘);</script>
<!– End Google Tag Manager –>
Similar here – replace GTM-XXXX with your unique GTM container ID, which can be generated from your Google Tag Manager console.
However, GTM can impact website performance if not optimized, as I mentioned several times already. Improper placement or too many GTM tags in the <head> section may delay page rendering, affecting Largest Contentful Paint (LCP). To prevent this, GTM tags should be loaded asynchronously, which allows the script to load in the background while the rest of the page renders smoothly. This prevents the GTM script from blocking the display of critical content.
To ensure GTM doesn’t impact website performance, several optimization tools can help. GTmetrix, Lighthouse or PageSpeed Insights from Google can analyze your site’s performance in general, highlighting issues like delayed script loading or LCP and what to do (you will get exact recommendations for your developer/agency, on how to optimize the site). For WordPress users, I can recommend plugins like WP Rocket, which helps optimize script loading on your web pages, ensuring they don’t block the rendering of critical content. These tools make sure your site will render smoothly and maintain good performance scores while preventing the script from delaying content visibility. Also – if you do not have some programming skills, you will need to hire a web developer, as even the best plugins like WP Rocket, will still break probably some functionality (in case you have done some custom development/updated WordPress core little).
Tag bloat is another issue connected with GTM that can affect website performance. Each tag adds some “weight” to the page (a few kilobytes), and firing too many tags unnecessarily can slow down the website, also when there are setup rules or third-party tools for managing website GDPR compliance (cookie banners), where scripts again need to wait for each other (fonts, pixels, other third-party software/scripts, which populate other scripts and those other scripts…). To mitigate this, regularly audit and remove unused tags and ensure that tags fire only when necessary. For example, tags can be set to trigger based on specific user interactions (e.g., form submissions or button clicks) rather than firing on every page load. This targeted triggering helps maintain page speed and avoids unnecessary strain on performance.
While the optimization principles remain the same, the specific setup can vary depending on the website’s platform or CMS. More complex websites or those with heavy traffic may need advanced tag optimization, such as deferring non-critical tags until after the page has fully loaded. By handling tags efficiently, you can maximize the benefits of GTM without sacrificing performance.
Note regarding to the dataLayer – the dataLayer is a crucial part of Google Tag Manager (GTM) that acts as a bridge between the website and GTM itself, enabling the seamless collection of data. Essentially, it is a JavaScript object that holds and transfers information about user interactions, such as clicks, form submissions, page views, or product purchases. This data is then used to trigger specific tags for tracking purposes.
A dataLayer looks like a simple JavaScript object, structured to hold multiple pieces of data. Here’s an example:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
‘event’: ‘formSubmission’,
‘formType’: ‘newsletterSignup’,
‘userEmail’: ‘example@domain.com’
});
But dataLayer can have many different uses. For example this code sets the default consent settings to “denied” for various types of data storage, including ads, analytics, ad personalization, and ad user data. The wait_for_update parameter delays the tag firing for 2000 milliseconds, allowing time for consent to be updated. Additionally, ads data redaction is enabled to prevent the collection of certain ad-related data by default:
<script type=”text/javascript”>
// create dataLayer
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
// set “denied” as default for both ad and analytics storage, as well as ad_user_data and ad_personalization
gtag(“consent”, “default”, {
ad_user_data: “denied”,
ad_personalization: “denied”,
ad_storage: “denied”,
analytics_storage: “denied”,
wait_for_update: 2000 // milliseconds to wait for update
});
// Enable ads data redaction by default [optional]
gtag(“set”, “ads_data_redaction”, true);
</script>
Noscript tags and their role in GTM
A <noscript> tag acts as a backup for when users disable JavaScript, ensuring basic tracking like page views can still occur. Since GTM relies on JavaScript for loading and managing tags, the absence of JavaScript would typically cause tracking to fail. By including a <noscript> tag, an HTML <iframe> is loaded to maintain minimal tracking for these users. While useful, noscript tags only capture limited data and lack advanced tracking features. Additionally, they can impact GDPR compliance, and don’t support dynamic event tracking or e-commerce actions. They also add minimal load to the page, offering basic functionality without slowing down performance. Finally, noscript tags can be customized to enhance fallback behavior for specific tracking needs.
Here’s an example of a <noscript> tag:
<!– Google Tag Manager (noscript) –>
<noscript><iframe src=”https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX“
height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
<!– End Google Tag Manager (noscript) –>
Similar to the GTM script tag, you’ll need to replace GTM-XXXX with your unique GTM container ID, which can be generated from your Google Tag Manager console.
GDPR implications of GTM script and noscript tags
- Under GDPR, explicit user consent is required for collecting and processing personal data. GTM script tags can trigger various tracking tools, so integrating a consent management solution is crucial to ensure compliance.
- Noscript tags provide basic tracking when JavaScript is disabled, but advanced features may still require user consent.
- Although noscript tags can offer minimal tracking, GDPR best practices recommend focusing on script-based tracking and ensuring that only essential tags with proper user consent are deployed. This follows GDPR’s principle of data minimization, which aims to limit unnecessary data collection. Websites should prioritize only those tags that serve a specific purpose and have been approved by the user.
- Additionally, website administrators must carefully configure GTM to collect only the necessary data, reducing risk and maintaining GDPR compliance by ensuring proper consent is gathered before activating any tracking or analytics mechanisms.
Plus, there is still this note – it’s critical to regularly audit and optimize your GTM tags to ensure they do not impact the overall performance of your site. Implementing asynchronous loading, deferring unnecessary tags, and minimizing tag bloat are all essential steps in maintaining a fast, responsive website. In addition, keeping an eye on performance metrics with tools like GTmetrix and PageSpeed Insights will ensure your website remains efficient while still gathering valuable tracking data.
Was this article helpful?
Support us to keep up the good work and to provide you even better content. Your donations will be used to help students get access to quality content for free and pay our contributors’ salaries, who work hard to create this website content! Thank you for all your support!
Reaction to comment: Cancel reply