免费工具 文本代码比检测：网页里的代码到底是什么
粘贴网页源码，看看全部字节里有多少是访客能读到的文字，其余又是什么：标签和属性、内联 JavaScript、内联 CSS、注释、空白。这里不给「文本代码比要大于多少」的标准——Google 从没公布过这样的数字；拆开来看的价值在于找出页面体积藏在哪里。
- 比例加完整构成
- 脚本、样式、SVG、Base64
- 本地计算
计算文本代码比
粘贴服务器返回的源码（Ctrl+U 查看源代码 → 全选 → 复制）。大小按 UTF-8 字节、压缩前计算，和 Googlebot 计算抓取上限的口径一致。
整页效果更准。<head>、<script>、<style>、<template>、<noscript> 里的文字不算可见文字。
文本代码比
30.1%
可见文字字节 ÷ HTML 总字节。
可见文字（字节）
968
正文文字，多余空白已去掉。
HTML 大小（字节）
3,218
未压缩，UTF-8。
可见文字字数
281
汉字一个算一个，其它按单词算。
HTML 由什么组成
- 可见文字30.1%
- 空白4.0%
- 标签和属性46.7%
- 内联 JavaScript8.5%
- 内联 CSS8.5%
- 其它（doctype、head 里的文字）2.3%
构成明细
前几行加起来等于总大小；「其中」几行是标签、脚本里单独拿出来看的部分。
| 部分 | 大小 | 占 HTML |
|---|---|---|
| 可见文字 | 968 B | 30.1% |
| 空白 | 129 B | 4.0% |
| 标签和属性 | 1.5 KB | 46.7% |
| 内联 JavaScript | 272 B | 8.5% |
| 内联 CSS | 272 B | 8.5% |
| 其它（doctype、head 里的文字） | 75 B | 2.3% |
| 其中：onclick 等事件属性 | 10 B | 0.3% |
| 其中：JSON-LD | 152 B | 4.7% |
说明
这个页面的事实，不是及格 / 不及格。
- 说明可见文字占这段 HTML 的 30.1%（3.1 KB 里有 968 B）。Google 没有公布这个数字的标准，适合用来比较同一页面的不同版本、或同一模板的页面。
- 通过HTML 有 3.1 KB，是 Googlebot 抓取上限 2 MB 的 0.2%。大小上没问题。
- 说明结构化数据（JSON-LD）占 152 B。这里算作代码，但它是有用的代码：富媒体搜索结果靠它描述。
版本 v1.0更新于 更新记录
为什么这里不给「合格线」
文本代码比作为 SEO 指标流传很广，常配着「要大于 15%」之类的说法。Google 的文档里没有这样的门槛，而且这个数字主要取决于模板，而不是内容本身。把它当成「构成分析」来看，仍然很有用。
比例本身
导航很大、描述很短的商品页比例会很低；模板简洁的长文章比例会很高。拿同一个页面前后对比，或同一模板的页面互相比，不要拿自己的站和别人的站比。
内联 JavaScript 和 CSS
最值得动手的部分。写在 HTML 里的代码每次打开页面都要重新下载，外部文件则能被缓存。大块内联代码通常来自建站工具、统计 / 广告代码管理器，或者框架把数据内联进页面。
Base64 图片和内联 SVG
用文字形式嵌进页面的图片和图标。几个小图标还好，大图或者整套图标每页都复制一遍，就很浪费。
Googlebot 的 2 MB
唯一一个硬数字。Googlebot 为 Google 搜索只抓 HTML 文件的前 2 MB（未压缩），只有这部分会被考虑索引。接近这个大小的页面，几乎都是被内联数据撑大的。
大小上限出自 Google 的 Googlebot 文档（Google 搜索的 HTML 为 2 MB）和抓取工具概览（Google 抓取工具默认 15 MB，部分更小）。
找出把页面撑大的东西
线上页面、模板、构建产物，任何 HTML 都能量。
-
1
复制源码
在线上页面按 Ctrl+U 查看源代码后全选复制。Vue、React 这类前端渲染的站，再从开发者工具复制一份渲染后的 HTML（Elements → 右键
<html>→ Copy outerHTML）。 -
2
粘进来
比例、大小、构成马上出来。
-
3
看代码里最大的一块
内联脚本、内联 CSS、Base64、SVG，还是普通标签。下方说明会写每一种通常意味着什么、可以怎么改。
-
4
改完再比
粘贴新版本对比。同类相比：同一页面改前改后，而不是你的页面对别人的页面。
文本代码比 = 可见文字字节 ÷ HTML 总字节
全部按你粘贴的源码的 UTF-8 字节计算，在 gzip / Brotli 压缩之前。一个汉字在文字和总量里都是 3 个字节，所以中英文页面的比例可以放在一起看。
- 可见文字：
<head>、<script>、<style>、<template>、<noscript>、<title>之外的文本，连续空白折成一个空格；&这类实体按源码原样计 - 空白：从文字里去掉的多余空格、制表符、换行，加上标签之间只有空白的部分
- 标签和属性：从
<到>的全部内容，包括属性值。图片的 alt 在这里算标签，不算可见文字 - 「其中」几行（Base64、内联 SVG、style 属性、事件属性、JSON-LD）本来就在标签或脚本里，不会重复加进总量
| 源码 | 算作 | 字节 |
|---|---|---|
<p class="lead"> | 标签和属性 | 16 |
| Hello world（两个空格） | 可见文字 11 + 空白 1 | 12 |
| & | 可见文字，按原样计 | 5 |
<script>track()</script> | 标签 17 + 内联 JavaScript 7 | 24 |
| 中文 | 可见文字 | 6 |
默认示例量出来什么
默认内容是一篇网店运营笔记的源码，带一段内联样式、一段 JSON-LD 和一小段内联脚本。
| 部分 | 字节 | 占比 |
|---|---|---|
| 可见文字 | 968 | 30.1% |
| 标签和属性 | 1,502 | 46.7% |
| 内联 JavaScript（含 152 字节 JSON-LD） | 272 | 8.5% |
| 内联 CSS | 272 | 8.5% |
| 空白 | 129 | 4.0% |
| 其它（doctype、title） | 75 | 2.3% |
文本代码比：968 ÷ 3,218 = 30.1%，可见文字 281 字。一半左右是标签，对套在网站模板里的短文来说很正常。点「单页应用外壳」示例，可以看到源码里完全没有可见文字的页面是什么样。
文本代码比常被误读的地方
大多数误区都来自把一个描述性的数字当成排名因素。
追某个百分比
为了提高比例往页面里塞凑数的文字，读者体验变差，Google 也没有任何文档说这样有用。真有代码可减，就去减代码。
拿不同模板比
电商分类页和博客文章的比例永远不会接近。和这个页面自己的旧版本比，或者和同一模板的页面比。
只量了前端渲染的外壳
React、Vue 等前端渲染的站，查看源代码只能看到一个空壳。还要量渲染后的 HTML，并确认内容不需要点击或滚动才出现。
把 HTML 大小等同于页面速度
HTML 只是众多请求之一，图片、外部脚本、字体通常更重。页面到底慢不慢，看真实访客的核心网页指标。
从页面体积到访客的真实感受
构成分析告诉你页面由什么组成；TapCub 告诉你它在真实访客那里加载多快、访客留不留下。
文本代码比是什么？
网页 HTML 里可见文字所占的比例。本工具用正文可见文字的字节数除以 HTML 总字节数。默认示例是 3,218 字节的 HTML 里有 968 字节文字，文本代码比 30.1%。
文本代码比多少合适？
没有公开的标准。「大于 15%」「25%–70%」这类数字来自各家 SEO 工具，不是来自 Google，Google 的文档里没有提到这个指标。用它比较同一页面的不同版本，用构成明细找出可以挪出去的内联代码。
文本代码比影响 SEO 吗？
它不是 Google 文档里写明的排名因素。Google 写明的是大小上限：Googlebot 为搜索只读取 HTML 文件的前 2 MB。HTML 过于臃肿也可能拖慢页面，这会体现在核心网页指标上。
怎么提高文本代码比？
把大段内联脚本和样式挪进能缓存的外部文件，不要用 Base64 嵌图片，重复的 SVG 图标改成 sprite 引用，去掉注释并压缩 HTML。代码压缩工具可以看到压缩前后的大小。
为什么我的 Vue / React 网站比例是 0%？
服务器只返回一个空壳，页面是 JavaScript 在浏览器里搭出来的。从开发者工具复制渲染后的 HTML 才能量到访客看到的内容；同时确认重要内容不依赖点击或滚动才出现。
算的是压缩前还是压缩后的大小？
你粘贴内容的未压缩 UTF-8 字节，Google 计算抓取上限也是按未压缩算。gzip、Brotli 通常能把传输大小压到几分之一，标签和空白压缩效果尤其好。
粘贴的源码会上传吗？
不会。解析和统计都在你的浏览器里完成，不会发给 TapCub，也不会保存。