按照我们前面的建站系列教程操作，应该都已经有一个线上可访问的个人网站了。为了更好的了解都有哪些用户在访问我们的网站，如何使用我们的网站，我们可以集成一些免费的工具进行统计。

本文将介绍如何接入 Google Analytics/Mirosoft Clarity/Cloudflare Web Analytics 这三个平台的代码，流程很简单，都是将平台生成的代码复制粘贴到我们网站网页代码中即可。

访客统计分析与用户行为追踪工具平台简介

免费的网站访客统计分析工具有很多，比如国内的百度统计，51LA，国外开源可自建的 Matomo，Umami 都很值得推荐。

但这里暂且只介绍 Google Analytics/Mirosoft Clarity/Cloudflare Web Analytics 的集成方法，主要是考虑到 Matomo/Umami 等平台免费额度基本不够用，自建的化又很耗机器资源（钱包不允许）。

对于特殊原因不想接入国内免费网站统计平台的用户，可能 Google Analytics/Mirosoft Clarity/Cloudflare Web Analytics 这三个是相对好的选择，但也个有缺点，比如 Google Analytics，虽然统计的信息很多，但我真的觉得看不懂，看了又好像没看，看完没任何感觉，但谷歌自家的，又是免费，接了不亏。Cloudflare 的统计比较简单，但直观，可以作为 Google Analytics 的补充。

其实我个人最喜欢、觉得最好用的是百度统计，信息很详细也很符合使用习惯，但百度统计的接入和使用不在本文讨论范围，后续单独介绍。51LA 是国内平台的次选，虽然网上对它的风评不好，但我个人没有遇到过不好的体验，免费额度足够支持月入 3 万的流量。

百度统计好用，但热力图只能免费建 3 个，使用 Mirosoft Clarity 可以很好的解决这个痛点，不仅有免费的热力图统计，还有用户的行为视频录制，可以看到用户在自己的网站上是如何操作的，这对优化网站页面和用户体验来说可以说是必接。

接下来正式进入本文主题。

Google Analytics 4（GA4）接入网站图文教程

本结教程将手把手教你如何创建 Google Analytics 跟踪 ID 并接入你的网站，用于统计用户访问数据。

什么是 Google Analytics？

Google Analytics（简称 GA）是 Google 提供的一款免费（基础版本）的网站流量分析工具，通过 嵌入一段 JS 跟踪代码 到你网站上工作，用于收集、分析访问你网站的用户行为数据。它帮助你了解：

• 实时数据查看当前有多少人在线、他们来自哪里、正在访问哪些页面
• 访客是谁（地区、设备、语言、访问来源）
• 访客从哪里来（自然搜索、广告、社交媒体等）
• 他们在你网站上做了什么（浏览了哪些页面、停留了多久、是否完成了目标）
• 是否完成了你设定的“转化”目标（例如购买、注册、填写表单等）

如何使用 Google Analytics？

1. 创建 Google Analytics（GA） 账户与媒体资源（Property）

打开 Google Analytics 官网：https://analytics.google.com/

使用你的 Google 账号登录，打开【管理】界面

在左下角点击齿轮图标 「管理」，进入设置页。

2. 创建账户

在左侧 「账户」 区域点击「创建账号」，输入账号名称（可随意填写，如 MyWebsite），然后点击「下一步」。

💡 一个 Google Analytics 账户可以管理多个网站。

3. 创建媒体资源（Property）

• 输入媒体资源名称（推荐填写你的网站名称）
• 设置时区和货币（建议按你目标用户所在地区设置）
• 点击「下一步」

4. 填写公司信息

• 行业类别：随便选（如“互联网和电信”）
• 公司规模：随便选
• 点击「下一步」

5. 选择业务目标

这里会问你想通过 Google Analytics 实现什么目标。可任意选择

点击「创建」后，同意服务条款并勾选 ✅ 接受。

6. 接受后进入设置数据流（Data Stream）

数据平台选择 “网站”（Web），进入数据流设置界面。

填写你的网站网址，和数据流名称（可以随便填），然后点击右上角「创建并继续」，成功后会弹出「Google 代码网页标签安装」界面。

7. 获取并安装跟踪代码

页面上自动展示一段 JavaScript 代码，形如：

<!-- Google tag (gtag.js) -->
<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>

复制该代码集成到你的网页代码中，凡是需要统计的页面都需要包含这段代码，比如在模板文件中统一引入。

8. 验证安装情况

代码集成完成后点击右上角「测试安装情况」，显示成功即可，需要等待一段时间才能有数据。

如果配置成功，回到主页你将看到如下界面

打开你的网站页面，刷新一次，你将能在「报告」-「实时概览」中看到访问数据

其他数据（如访客来源、页面浏览量、跳出率等）将在几小时内陆续出现，到这里 Google Analytics 的集成就完整了，简单吧！

Microsoft Clarity 使用教程：如何为网站集成 Clarity 用户行为追踪工具

网站统计不仅仅是知道有多少人访问，更重要的是——他们访问了哪些页面？点击了哪里？看了多久？有没有滑动页面？

相比传统访问统计工具，Microsoft Clarity 提供了免费、无采样的用户热图、点击追踪、滚动深度、录屏回放等功能，非常适合做用户体验优化。

本结内容将手把手教你如何为你的网站集成 Clarity，无论你的网站是纯 HTML、WordPress、Vue、React 都适用。

Clarity 是什么？

Microsoft Clarity 是微软推出的一款 免费用户行为分析工具，功能类似于 Google Analytics，但更偏重于用户行为可视化，Clarity 可以让你“看到”用户在你网站上的真实操作。

免费提供了以下核心功能：

• 热力图（Heatmaps）：查看用户在页面上点击、滑动、停留的位置，可视化呈现用户注意力集中区域，支持桌面端、移动端热图对比。适合判断 CTA 按钮、广告位、内容分布是否合理
• 录屏回放（Session Recordings）：自动录制用户在你网站上的每一步操作，包括点击、滚动、停留，可以逐个回放访问记录，看到用户是如何“失败”“流失”的。适合发现用户卡顿点、退出原因、页面设计缺陷
• 漏斗分析 / 页面性能监控：统计哪些页面加载慢，哪些设备、浏览器出错多，哪个步骤流失率最高（可配合事件追踪）。适合产品经理、运营分析转化率，前端优化性能

最重要的是 —— 完全免费，无使用限制。

Clarity 与 Google Analytics 的区别？

如何在网站中接入安装 Clarity？

1. 注册 Clarity 并创建新项目

打开 Clarity 官网：https://clarity.microsoft.com/

点击右上角【Get started】

使用 Microsoft / Google / Facebook 任一账号完成注册并登录

登录成功后点击首页右上角【+ New Project】

填写如下信息：

• 名称：随便起个名字
• 网站 URL：你网站的完整网址，例如 https://example.com

完成后点击【添加新项目】

2. 获取并安装跟踪代码

创建完成后，页面会提示选择安装方式，选择「手动安装」，点击「获取跟踪代码」

请复制这段代码，同样将其粘贴到你的每一个需要统计的网页中。

到此就完成集成了，等平台收集到数据就能在项目里看到信息了，一般要几个小时。

提示：Clarity 不会与 GA 冲突，可以并存。

Cloudflare Web Analytics 接入教程

什么是 Cloudflare Web Analytics？

Cloudflare Web Analytics 是由 Cloudflare 提供的一款免费、轻量、注重隐私的网页流量统计工具，专为网站管理员设计，用来查看网站访问情况，而无需使用 cookie 或收集用户个人数据。完全免费，无付费版，不限数据量。

Cloudflare Web Analytics 能统计什么？

• 页面浏览量（Pageviews）
• 访问用户数（Unique Visitors）
• 页面路径（Page Paths）
• 访问设备类型（移动 / 桌面）
• 浏览器 / 操作系统
• 访问来源（Referers）
• 国家 / 地区（粗略地理位置）

不支持：

• 用户行为路径分析
• 转化漏斗分析
• 热力图 / 录屏
• 事件追踪（比如点击、滚动等）

如何你将自己的网站添加到 Cloudflare，集成 Web Analytics 甚至不需要代码，它可以自动给你追加统计代码。

如何接入 Cloudflare Web Analytics 进行网站访问统计

1. 注册 Cloudflare 并登录后台

打开 Cloudflare Web Analytics 官网：https://www.cloudflare.com/web-analytics/

点击右上角「登录」注册一个 Cloudflare 账号（已有账号直接登录）

登录后访问控制台（Dashboard）

2. 在 Web Analytics 中添加站点

左侧菜单栏中点击「分析和日志」-选择「Web Analytics」进入管理页面，点击右上方蓝色按钮「添加站点」

在输入框中输入您网站的主机名或从 Cloudflare 上的现有网站中选择。

选择 Cloudflare 上的现有网站可以支持自动加入统计功能不用任何代码修改，也可以选择手动添加。

不在 Cloudflare 上的现有网站则必须手动添加代码，方法和前面类似，会生成一段代码：

复制代码添加到你的网页代码中，就完成了集成。

完成后回到 Web Analytics 页面，点击你添加的域名，就能看到统计数据了：

结语

好了，到此以全部集成完毕！

无论你是刚刚搭建好个人网站，还是已经上线运营了一段时间，接入网站分析工具都是提升网站运营效率的关键一步。Google Analytics 提供全面的数据维度，Clarity 补足了用户行为的可视化分析，而 Cloudflare Web Analytics 则是一个零负担、注重隐私的简洁方案。

建议三者组合使用，互为补充：

• 用 GA 看整体趋势
• 用 Clarity 观察用户行为细节
• 用 Cloudflare 监控基础访问流量

简单几步接入，0 成本，长期受益。你花 10 分钟配置，未来可以少走很多弯路。