ScreenshotNeo

BlogGuides

What Is a Pixel on a Website?

A website pixel is tracking technology that records visits, clicks or purchases and sends event data to analytics or advertising platforms.

By the ScreenshotNeo team1 October 20267 min read

1. What is a pixel on a website?

A website pixel is tracking technology embedded in a webpage or email. It records selected activity, such as a page visit, click, signup or purchase, and sends an event request to an analytics or advertising service.

The name comes from the original implementation: a transparent one-pixel image loaded from another server. Modern products called pixels often use JavaScript, event configuration and browser APIs instead. A TikTok Pixel or X Pixel may include code that collects several event fields; it does not have to be a visible one-pixel square.

In practical terms, a pixel answers questions such as:

  • Did someone visit this page?
  • Did they view a product, submit a form or add an item to a cart?
  • Did an advertising campaign lead to a purchase?
  • Which browser, device or traffic source was associated with the event?

2. How a website pixel works

  1. The browser loads the page and runs the installed pixel code or requests the pixel image.
  2. The implementation selects an event, such as page_view, add_to_cart or purchase.
  3. The browser sends a measurement request to the analytics or advertising destination.
  4. The destination processes the request and displays reports, audiences or campaign results.

JavaScript implementations can read event details from the page, while image pixels usually send values encoded in a request URL. A tag manager adds another layer: tags contain the code, triggers decide when tags fire, and variables provide values used by tags or triggers.

3. What can a pixel record?

There is no universal data list. The vendor, event configuration and site implementation determine what is sent. Documented examples from major platforms include:

Data or event Typical use
Page view Measure visits and landing-page traffic
Button click Measure engagement with a call to action
Product view Build product audiences or measure interest
Add to cart Measure shopping intent
Lead or signup Count completed forms or registrations
Purchase Measure conversions and campaign performance
Browser and device details Segment reports and diagnose compatibility
Traffic source Attribute visits or conversions to campaigns
Timestamp, IP address, cookies or page metadata Fields some advertising pixels document for event processing

These are examples, not a guarantee that every pixel collects every field. A pixel can also receive values supplied by your code, such as a product ID, order total or currency.

Technology What it is How it relates to a pixel
Pixel tag A tracking implementation that sends event data May be a one-pixel image, JavaScript or both
Cookie A small value stored by the browser Can help recognize a browser across requests; pixels often read or set cookies
Tag manager Software for organizing tags, triggers and variables Controls when pixel code runs and which values it receives

A cookie stores data in the browser. A pixel sends a measurement request. A tag manager helps operate one or many pixels. They are related, but they are not interchangeable terms.

5. Why websites use pixels

  • Traffic measurement: count visits and understand acquisition sources.
  • Conversion measurement: record leads, purchases and other outcomes.
  • Campaign evaluation: compare advertising or referral performance.
  • Audience building: create groups such as people who viewed a product but did not purchase.
  • Campaign optimization: provide conversion signals to an advertising platform.
  • Product analytics: measure clicks, scrolls and other interactions.

Event design should follow the customer journey. A commerce flow might measure product detail views, cart additions and purchases rather than treating every page load as a conversion.

6. Simple pixel implementations

One-pixel image beacon

This is the classic pattern. The image is transparent and has no visual purpose; loading it creates a request.

<img
  src="https://analytics.example/pixel.gif?event=page_view&page={{PAGE_URL}}"
  width="1"
  height="1"
  alt=""
  aria-hidden="true"
>

Replace the example host with the endpoint supplied by your analytics provider. Do not place sensitive values in a URL unless the provider explicitly supports them and your privacy review allows it.

JavaScript event pixel

<button id="buy">Buy now</button>
<script>
  function track(eventName, data = {}) {
    const payload = JSON.stringify({
      event: eventName,
      page: location.href,
      ...data
    });

    if (navigator.sendBeacon) {
      navigator.sendBeacon(
        'https://analytics.example/collect',
        new Blob([payload], { type: 'application/json' })
      );
    } else {
      fetch('https://analytics.example/collect', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: payload,
        keepalive: true
      });
    }
  }

  track('page_view');
  document.querySelector('#buy').addEventListener('click', () => {
    track('purchase_intent', { product_id: 'SKU-123' });
  });
</script>

The endpoint, event names and accepted fields are provider-specific. Use the provider’s documented SDK or tag when one is available.

Adding a pixel through a tag manager

  1. Create a tag containing the vendor’s base code.
  2. Create triggers for page views or selected events.
  3. Pass values through variables rather than hard-coding order or product data.
  4. Use preview mode to confirm that the tag fires once at the intended time.
  5. Publish only after checking consent behavior and outgoing requests.

Tracking can be invisible to visitors. Third-party technologies may send information to their developers and can continue tracking as a person visits other sites. Review every event and field instead of assuming a pixel only counts page views.

  • Explain tracking in your privacy notice using plain language.
  • Obtain consent where applicable before setting non-essential tracking technologies.
  • Do not send passwords, authentication tokens, payment-card data or unnecessary personal information.
  • Use the provider’s debugging or helper tool to inspect the actual requests.
  • Limit event fields to what the measurement goal requires.
  • For healthcare organizations subject to HIPAA, disclosures of protected health information to tracking vendors may require a permitted disclosure and business associate agreement, or a valid HIPAA-compliant authorization where required. A general cookie banner is not automatically a HIPAA authorization.

Privacy requirements vary by jurisdiction and context. Have your legal or privacy team review the implementation when the data is sensitive or the audience is regulated.

8. Troubleshooting pixel tracking

Symptom Likely cause Fix
No event appears The script did not load, the trigger did not fire or an ad blocker blocked it Inspect the browser network panel, confirm the trigger and test with blocking disabled for diagnosis
Every page view is duplicated Both hard-coded code and a tag-manager tag are installed Keep one base implementation and remove the duplicate
Purchases are missing The event runs before the success state exists or the user leaves before the request completes Fire after the confirmed success state and use sendBeacon or the provider’s reliable conversion method
Wrong revenue or currency Values are formatted as strings, rounded incorrectly or read from the wrong page element Validate amount, currency and order ID in preview and server logs
Consent violations The pixel fires before the visitor grants permission Gate the tag behind the consent state and retest first visit, rejection and withdrawal paths
Events stop on a single page app Navigation does not trigger a full page load Send a page-view event from the router’s navigation handler
Requests are blocked by CSP The destination is not allowed in connect-src or img-src Add the provider’s domains to the appropriate policy after security review
Events appear late Network delay, batching or reporting latency Check the provider’s real-time or diagnostics view before assuming data loss

9. Performance and reliability considerations

  • Load non-critical pixel code asynchronously so it does not block rendering.
  • Keep the base script small and avoid loading several overlapping vendors.
  • Use sendBeacon or keepalive for events sent while a page is closing.
  • Deduplicate events with a stable event or order ID when the provider supports it.
  • Expect ad blockers, privacy settings, disabled JavaScript and network failures to reduce browser-side coverage.
  • Do not treat client-side pixels as the sole source of truth for billing or fulfillment.
  • Monitor request errors and compare event totals with a trusted internal system.

Pixels add network requests and code execution. The practical cost is usually request volume, page weight and operational complexity rather than the one-pixel image itself. Advertising or analytics vendors may also charge according to their own plans; check the applicable service terms.

10. Which pixel should you use?

Choose based on the destination platform and the decisions you need to make. Compare:

  • Which analytics or advertising service must receive the event.
  • Whether you need page views, ecommerce events, leads or custom interactions.
  • Supported integrations and tag-manager options.
  • What data fields the service collects and whether you can control them.
  • Consent, deletion and sensitive-data controls.
  • Available debugging tools for verifying requests.

A Google tag or Google Analytics implementation fits measurement connected to Google destinations. TikTok Pixel is designed for TikTok for Business traffic, advertising and optimization workflows. X Pixel supports X conversion tracking through base and event code. These are platform-specific choices, not interchangeable universal pixels.

11. Or skip the browser setup

If your goal is to capture how a page looks rather than measure visitor behavior, ScreenshotNeo provides a website screenshot API and MCP server. It accepts one GET request and returns a PNG, JPEG, WebP or PDF.

See the ScreenshotNeo documentation for the complete option list. A minimal request looks like this:

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
  • Cookie banners, newsletter popups and chat widgets are removed before the shot.
  • Bot checks, blank pages and failed loads are never billed.
  • An MCP server lets AI agents take screenshots with tools such as take_screenshot, get_page_info and capture_pdf.
  • 1,000 screenshots a month are free with no card; paid plans start at $5 for 3,000 shots.

Create a free ScreenshotNeo account to get started.

12. FAQ

Can a website pixel track me?

It can record the events and fields configured by the site owner and vendor. Browser privacy settings, consent controls and blockers can limit what is sent.

No. A pixel sends a measurement request; a cookie stores a value in the browser. They are often used together.

Does every pixel use a one-pixel image?

No. The term now commonly covers JavaScript and platform-specific event code as well as image beacons.

Can I see whether a pixel fired?

Usually. Use the browser’s network tools, the vendor’s helper or diagnostics view, and tag-manager preview mode.

Should purchase tracking rely only on a browser pixel?

No. Browser events can be blocked or interrupted. Reconcile them with a trusted server-side order or billing record.