27 个首页的 viewport：12 种写法，两个还在关手势缩放
viewport 那一行决定手机上你的页面按多宽排版。27 个首页全写了，去重只有 12 种写法，13 个站用的是同一串；两个站还在发 maximum-scale=1，而 iOS 10 以后默认就忽略它。
实测 · 2026-08-24 · 27 个首页 · 单次抓取 · 只读 head
样本 / 口径：2026-08-15 以来一直在用的那批 30 个站，2026-08-24 当天每个首页抓一次，浏览器 UA。只读服务端下发的 HTML，把每个 <meta name="viewport"> 的 content 串原样记下来。不渲染，不发第二次请求。
这一行是手机上你的页面按多宽排版的唯一开关。27 个能读到的首页全都写了 viewport，去重之后只有 12 种写法，其中 13 个站用的是同一串。26 个写了 width=device-width；还有两个在发 maximum-scale=1，而 MDN 明写 iOS 10 以后默认忽略这个键。
怎么测的
每站一次请求，不渲染、不重试。纳入规则跑数前写死：状态 200、响应体不小于 10,000 字节、含 <body。30 个里 3 个没过 —— stackoverflow.com 与 medium.com 返回 403，www.reddit.com 返回 8,393 字节空壳 —— 剩 27 个，与前九批被剔的是同样三个。
要说清楚的是，我们量的是一句声明，不是一次排版。脚本在页面加载后插进去的标签不会出现在这份计数里，这些数字也说不了任何一个页面在真机上到底长什么样。
27 个首页全写了 viewport，12 种写法就覆盖完了
这里没有什么分歧可讲：27 个全写了，没有一个站写两遍。13 个站用的是同一串 width=device-width, initial-scale=1。
| content 串 | 站数 |
|---|---|
width=device-width, initial-scale=1 | 13 |
width=device-width（只有这一段） | 3 |
width=device-width, initial-scale=1.0 | 2 |
width=device-width,initial-scale=1（无空格） | 1 |
另加 viewport-fit=cover | 3 |
另加 maximum-scale 或 user-scalable | 2 |
另加 shrink-to-fit=no | 1 |
另加 interactive-widget=resizes-content | 1 |
整串没有 width | 1 |
唯一那个没写 width 的是 www.wikipedia.org 的门户页，它发的是 initial-scale=1,user-scalable=yes。整个样本里只有它把布局视口宽度交给浏览器默认值 —— 窄屏上那个默认值一般是 980 个 CSS 像素，不是设备宽度。
两个站还在试图关掉手势缩放
vercel.com 发的是 width=device-width, initial-scale=1, maximum-scale=1，substack.com 更进一步，还带 user-scalable=0。两家都想拦住读者放大页面，而在当前 iOS 上两家都拦不住。
MDN 的 viewport 参考页（2026-08-24 读）在 maximum-scale、minimum-scale、user-scalable 三个条目下写的是同一句：「Browser settings can ignore this rule, and iOS10+ ignores it by default.」同一页还有一段警告：「Disabling zooming capabilities by setting user-scalable to a value of no prevents people experiencing low vision conditions from being able to read and understand page content. Additionally, WCAG requires a minimum of 2× scaling; however, the best practice is to enable a 5× zoom.」
禁缩放那一段现在已经不是设置了，它只是一份「当年有人想这么干」的记录。
三个站只写到 width=device-width 就停了
github.com、www.framer.com、www.netlify.com 只声明宽度，后面什么都没有。这件事比看上去小：initial-scale 管的是首次绘制时的缩放级别，而浏览器既然已经拿到布局宽度，基本没有再去缩放的理由，所以现代手机上的实际效果通常和写了 initial-scale=1 一样。
这一条我们没测。要确认得上真机截图，而这次是每站一次 HTML 抓取。
少见的那几个键，和一个文档里已经查不到的
四个站另加了 viewport-fit=cover：stripe.com、linear.app、www.cloudflare.com、substack.com。它管的是页面能不能画进刘海周围那圈区域。linear.app 是唯一还写 height=device-height 的，www.canva.com 是唯一写 interactive-widget=resizes-content 的 —— 那句话告诉浏览器，虚拟键盘弹出来的时候连布局一起改，而不是只改可视区域。
www.theverge.com 发的是 shrink-to-fit=no。MDN 现在这份参考页里根本没有这个键的条目，我们 2026-08-24 全文搜了一遍，页面上唯一的 shrink 出现在描述窄屏虚拟视口的行文里。它是早年 iOS 的一个补丁，留着也不花钱，大概就是这么留下来的。
这对你意味着什么
Google 拿手机版的页面做收录和排名，所以决定「手机版长什么样」的这一行值得花三十秒。Google 的移动优先索引文档（2026-08-24 读）第一句就是：「Google uses the mobile version of a site's content, crawled with the smartphone agent, for indexing and ranking.」
- 发
width=device-width, initial-scale=1，写完就停 —— 27 个站里 13 个就是这么写的。 - 只有真要画进刘海区域时才加
viewport-fit=cover。 - 别写
maximum-scale=1或user-scalable=no。当前 iOS 会盖掉它，而 WCAG 要求至少 2 倍缩放。 - 别漏掉
width。整串里只有这一段真的改布局视口。
动手改之前，先看一眼爬虫从你的 <head> 里实际拿到了什么 —— 查一下 AI 爬虫能不能读到你的页面，一个抓都抓不到的页面，viewport 写得再对也没用。
常见问题
你们是怎么测的
2026-08-24 当天每个首页一次请求，浏览器 UA，不执行 JavaScript。把下发 HTML 里每个 <meta name="viewport"> 的 content 属性记下来，逐字比对，空格也算差异。
viewport 会直接影响 SEO 吗
没有任何一份文档能指出它是排名输入。它要紧是因为收录发生在手机端渲染上，一个在手机上按 980 像素排版的页面，就是比同一个页面按设备宽度排版更差的手机页。这是一条间接路径，我们宁可直说，也不想把它包装成因果。
user-scalable=no 有能用的场合吗
地图、画布这类自己实现了双指手势的页面，有真的理由。一页文字没有，而且无障碍那边的代价是写在文档里的，收益不是。
为什么少了三个站
两个对我们的 UA 返回 403，一个返回 8,393 字节的空壳。纳入规则是跑数之前定的，这三个站在这块面板的每一批里都被剔掉。AI 爬虫实际读到了什么 讲的是 200 能证明和不能证明什么；27 个首页的 html lang 声明 是同一块面板上另一处 head 声明，结论形状也一样。
