Web Analytics for Beginners: How It Works, What to Track
Web analytics is collecting and reading data about how people find and use a website: how many visit, where they come from, which pages they view, and whether they sign up or buy. It usually works through a small JavaScript tag that sends an event to an analytics service on each page view or action. For a beginner, the practical path is: decide the 3-5 actions that matter, install one tool (Google Analytics 4 if you want everything free, Plausible if you want simple and cookie-free), track those actions as events, and review one short report every week.
How web analytics works
There are three ways to collect the data, and most tools use the first.
- Client-side tags. A script in your page's
<head>sends a request to the analytics server whenever something happens: a page view, a click, a form submit. It sees the URL, the referrer, screen size, browser and an approximate location from the IP address. - Server-side collection. Your backend sends events directly, for example GA4's Measurement Protocol after a payment webhook. Ad blockers can't stop it, but you have to send everything yourself.
- Server logs. Your web server already logs every request. Log analyzers turn that into reports without any script, but logs include bots and know nothing about clicks inside the page.
Cookies vs cookieless tracking
To tell a returning visitor from a new one, a tool needs some identifier. GA4 stores a random client ID in a first-party cookie, which is why it normally needs consent in the EU and UK. Cookieless tools avoid storage: Plausible, for example, hashes a daily rotating salt with the site domain, IP address and user agent, so a visitor can be counted for one day but not followed across days (Plausible data policy). The trade-off: cookieless tools can't tell you that someone came back next week.
Web analytics vs on-site, off-site and product analytics
| Term | What it covers | Typical tools |
|---|---|---|
| Web analytics | Traffic and behavior on your site | GA4, Plausible, Matomo, Umami |
| On-site analytics | Same thing, emphasizing behavior on your pages: clicks, scrolls, funnels, speed | GA4, Clarity, PostHog |
| Off-site analytics | Your presence elsewhere: rankings, backlinks, mentions | Google Search Console, SEO suites |
| Product analytics | What identified users do over time: activation, retention, cohorts | PostHog, Mixpanel |
On-site data tells you whether the traffic you already have turns into users. Off-site data tells you why people do or don't find you.
Web analytics metrics that matter
Most sites need five groups. The website visitor statistics guide defines each one in detail.
- Acquisition: users and sessions by source (organic search, direct, referral, social, email, paid).
- Engagement: engagement rate, views per session, and which pages people read. In GA4 a session is engaged if it lasts longer than 10 seconds, has a key event, or has two or more page views, and bounce rate is the inverse of engagement rate (Google).
- Conversions: signups, purchases, demo requests, downloads. GA4 calls these key events.
- Friction: where people rage-click or abandon a form; this is what heatmaps and session recordings show.
- Speed: Core Web Vitals measured on real visits: LCP (loading), INP (responsiveness) and CLS (visual stability). Google's thresholds for "good" at the 75th percentile are 2.5 s, 200 ms and 0.1.
Ignore metrics you won't act on. Total pageviews on their own rarely change a decision; conversion rate by landing page usually does.
Set up web analytics: a GA4 walkthrough
- Create a property and web data stream. In Google Analytics go to Admin > Data collection and modification > Data streams > Add stream > Web, enter your URL and copy the measurement ID (
G-...). - Add the tag to every page, in the
<head>:
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXXX');
</script>
- Leave Enhanced measurement on (in the stream settings). It tracks page views, scrolls, outbound clicks, site search, file downloads and video engagement without extra code.
- Raise data retention to 14 months: Admin > Data collection and modification > Data retention. The default is 2 months, which limits how far back Explorations such as funnels can look (Google).
- Exclude your own visits. In the stream's tag settings choose Define internal traffic and add your office or home IP, then activate the Internal Traffic filter under Admin > Data collection and modification > Data filters.
- Track your conversions as events and mark them as key events (Admin > Data display > Events):
// After a successful signup
gtag('event', 'sign_up', { method: 'email' });
// When checkout starts
gtag('event', 'begin_checkout', { value: 49, currency: 'USD' });
Use Google's recommended event names (sign_up, login, purchase, generate_lead) where they fit, so the matching reports fill in automatically.
- Check it works in Reports > Realtime with your ad blocker off.
The Plausible alternative: create the site in the dashboard, paste the one script tag it gives you into the <head>, and add goals for your signup or purchase pages. No consent banner is usually needed for the analytics itself, though that depends on your jurisdiction. If you're deciding between the two, see Google Analytics vs Plausible.
Add on-site behavior and speed data
Numbers tell you where people drop off; recordings show you why. Microsoft Clarity is free with no traffic limits and gives click, scroll and area heatmaps plus session recordings, filterable by rage clicks, dead clicks and quick backs. It masks sensitive input by default, but it does need consent for visitors in the EEA, UK and Switzerland. To use recordings well, filter for sessions that reached your pricing or signup page and didn't convert, watch 10-20 of them, and note every point of confusion you see more than twice.
For speed, PageSpeed Insights shows 28 days of real-user Core Web Vitals for pages with enough traffic. To measure every page, send the numbers from the web-vitals library to the tool you already have:
// npm install web-vitals
import { onCLS, onINP, onLCP } from 'web-vitals';
function sendToGoogleAnalytics({ name, delta, value, id }) {
gtag('event', name, {
value: delta,
metric_id: id, // groups the deltas from one page load
metric_value: value,
metric_delta: delta,
});
}
onCLS(sendToGoogleAnalytics);
onINP(sendToGoogleAnalytics);
onLCP(sendToGoogleAnalytics);
Web analytics reporting
Collecting data is easy; the hard part is a report someone reads. Three levels, from least to most work:
- Built-in reports. GA4's Reports section covers acquisition, engagement and monetization. Users with Editor access can customize the collections in Reports > Library so the left menu shows only what your team uses.
- Explorations. Explore builds funnels, path analyses and segment comparisons. Funnel exploration is where you find the step with the biggest drop-off.
- Dashboards. Looker Studio is free, connects to GA4 and Search Console, and can email a report on a schedule.
A one-page weekly web analytics report is enough for most teams:
| Section | Metric | Compare with |
|---|---|---|
| Traffic | Users and sessions by channel | Last week and the same week last year |
| Search | Search Console clicks, top 10 queries | Last week |
| Content | Top 10 landing pages by sessions and conversion rate | Last week |
| Conversion | Key events and conversion rate | Target |
| Speed | Share of page loads with "good" LCP and INP | Last month |
| Notes | What changed (release, campaign, outage) and what you'll do |
The last row matters most. A report without a "so what" gets ignored.
Web analytics best practices
- Write a measurement plan first: the questions you need answered, and the events that answer them.
- Use one naming convention for events, such as
object_action(signup_completed), before the first event ships. - Tag campaign links with
utm_source,utm_mediumandutm_campaign, or newsletter and social traffic shows up as "direct". - Keep one tool per job. Every script adds JavaScript; check INP after adding one.
- Respect privacy law. Use a consent banner where required, mask form fields in recordings, and don't send emails or names to analytics.
- Expect undercounting. Ad blockers and declined consent hide part of your traffic; compare trends, not totals, across tools.
When you're ready to choose a tool, the web analytics services comparison covers pricing and privacy for ten options, and analytics tools on DevHunt lists newer ones.
FAQ
What is web analytics in simple terms?
It's measuring what visitors do on your website: how many come, where from, which pages they view and whether they complete actions like signing up. A script or your server logs collect the data, and a dashboard summarizes it.
What are the main types of web analytics?
On-site analytics measures behavior on your own pages (traffic, events, funnels, speed). Off-site analytics measures your visibility elsewhere (search rankings, backlinks, mentions). Product analytics follows identified users over time.
Which web analytics tool should a beginner use?
Google Analytics 4 if you want a free, complete tool and don't mind a learning curve and a consent banner. Plausible, Umami or Cloudflare Web Analytics if you want a simple dashboard without cookies. Add Microsoft Clarity for free heatmaps and recordings.
What should a web analytics report include?
Traffic by channel, top landing pages, search clicks and queries, conversions against a target, and a short note on what changed and what you'll do next. Keep it to one page and compare each number with the previous period.
Is web analytics legal under GDPR?
Yes, if you follow the rules. Tools that set cookies or identify users, such as GA4 and Clarity, generally need consent from EU visitors. Cookieless tools reduce that burden, but you should still check what applies to your site with whoever handles your privacy compliance.