tracking pixel header

How Tracking Pixels Work

Read Time: 7 minutes

Tracking pixels (or web beacons) are a fact of life on the modern web. They’re on the websites you visit, they’re in the apps you use and, most likely, you’ve placed a couple yourself. But knowing about tracking pixels is different than knowing how they work and, like lots of other tools, it’s easy to get along without actually understanding how they work.

That being said, there are as many tracking pixels out there as there are grains of sand on all the planets in the universe (or there about), and I can in no way provide a detailed explanation of how they all work. What I can do, however, is give you the basics of how tracking pixels work.

What are tracking pixels?

I find when I’m trying to learn something it’s always best to start with the simplest definition possible. I try to find one that covers everything, without being too technical. So, with that in mind:

A tracking pixel is a piece of client based technology that records specific visitor information

I’m going to break down each bit of this sentence to give you the best idea of how tracking pixels work. But first, a quick explanation of the name.

You may have realized that the ‘pixel’ part of ‘tracking pixel’ doesn’t make much sense. Pixels are a unit of measurement in the computer world, and usually used in reference to images or resolutions. Tracking pixels really have nothing to do with images (see the definition above), only they actually do, kinda. They get their name because they started out as images placed on a web page. These images were 1 pixel in size (1×1), making them effectively invisible to people visiting the website. Although nowadays tracking pixels aren’t usually images, we still use this name because their purpose is the same: to record specific visitor information

Tracking pixels are client based

Our first bit of the definition is client based. Client based means the pixel runs in the application the user is using (usually a web browser) as opposed to server based. Tracking pixels are designed to collect information about your visitors, and it does so by accessing your visitor’s computer. By running in the browser, the pixel is granted limited access to information, such as what type of browser the visitor is using, their cookies, their IP, and so on. Most of this information is sent when the browser loads the tracking pixel. This is why some pixels can just be images: the information comes from the loading of the image, and nothing else.

If the user is in a different type of client (say, an app on their phone), implementation of a tracking pixel can be a bit different. Websites are a bit easier, as you typically need to paste some code into the header or footer of the web page.

Because pixels are client-based, they use the resources of the user’s computers which can slow it down if there are too many pixels. It’s important to periodically review your pixels and make sure they’re all serving a purpose, and do the same anytime you add a new pixel. If you don’t, it’s easy to go overboard and bloat up your website.

Different technologies

Although tracking pixels started out as images, it has become common for them to be script snippets. By using scripts, tracking pixels are able to manipulate and communicate more information than an image-based one can. Although both styles have the same goal (they’re both tracking pixels), script-based ones are more advanced.

There’s a caveat to script-based pixels, though. They’re usually harder to integrate, and almost always require a basic knowledge of programming to get the most out of them.

As a quick note, I’m saying “script-based” and not javascript based because in certain environments (like apps) you might be running a different type of script, like C# or PHP. It’s all the same basic idea, though.

Specific User Information

The last part of the definition is probably the trickiest, and where most people start to get confused. To recap, we’ve learned that:

  1. A tracking pixel is a piece of client-based technology that records specific visitor information.
  2. Tracking pixels run on the user’s computer, which gives them access to the information.
  3. You can use either script or image-based pixels.

Two of those three points are about communicating and accessing information, while one of them is our general definition. So, with that being said, what information are we communicating and accessing? Well, that depends on the pixel.

Let’s take Google Analytics. By default, Google Analytics will record information about your user (browser, IP, referrer, etc.), how they navigate your website (time per page, bounce rate, which pages they opened), and put it all into a nice dashboard for you to view.

But you can also customize Google Analytics, so now it’s tracking how much money people spent, or maybe how many times they hovered over the buy now button, or maybe how long they left the tab open. Each of these options requires different development and different integrations which all depend on how your website is setup. If you want a conversion ID or dollar amount, you’ll have to know how your website stores that information and how to send it to Google Analytics.

Google Analytics’ pixel is similar to Facebook’s pixel, which not only collects some similar information, but also lets you build audiences of people who resemble users visiting your website.

Still even more different, you could get a pixel from a retargeting service, which shows your ads to the user after they leave the website.

Or maybe you have pixels that record people’s actions on your website so you can watch a recording of what they did.

The list goes on and on, but it really comes down to each tracking pixel recording specific user information. All pixels track some form of user information, and while there’s overlap between most pixels, there should be at least one unique thing it does. If there isn’t, you probably shouldn’t be using that pixel.

Comment below if you feel I missed anything about tracking pixels, or if you have a question that you can’t find an answer for. I’m hoping to build this out as a good reference, so I’m always looking to add more stuff to it!

Liam Workman

Liam is an account manager and blog king at SparkLit, the SaaS company behind AdButler and FourEyes. He loves rock climbing, hiking, coding, and being your friend.