干了十五年建站，我见过太多新手站长抓狂。明明自己代码写得没问题，测试机上也跑得好好的，一上线，用户反馈页面乱码、按钮点不动，甚至白屏。这时候，90%的情况不是代码错了，而是“浏览器”在作怪。
很多人问我，怎么看网站的浏览器？其实这个问题问得有点模糊。你是想知道“用什么浏览器看网站”，还是“怎么看当前访问网站的浏览器是什么版本”？作为过来人，我直接告诉你，后者才是解决兼容性的关键。
先说个真事儿。去年有个做电商的朋友找我，说他的购物车在安卓手机上总是失效。我让他截图，他发过来一张图，我看了一眼，好家伙，他用的是一款不知名的国产定制浏览器，内核还是几年前的旧版本。这种浏览器为了省电，经常砍掉一些现代网页特性，导致JS脚本执行失败。
所以，学会“看”浏览器，比盲目改代码重要得多。
第一步，最简单的方法，直接问用户。
别觉得这很傻。很多小白站长遇到兼容性问题，第一反应是查文档、改CSS。其实，你可以直接在客服对话框里问一句：“亲，您现在是用手机还是电脑？用的什么浏览器？”
这一步虽然笨，但能帮你快速定位问题。如果是Safari，那是苹果特有的坑；如果是微信内置浏览器，那是腾讯的坑；如果是UC或者QQ浏览器，那是国产定制内核的坑。
第二步，利用开发者工具自查。
这是老手必备的技能。不管你是用Chrome、Edge还是Firefox，按F12键（笔记本可能是Fn+F12），打开开发者工具。
在Console（控制台）里，你会看到红色的报错信息。别怕，那些红字就是你的敌人。
更重要的是，在Elements（元素）面板里，你可以看到当前页面的渲染情况。如果你发现某个Div层叠乱了，检查它的CSS属性。
这里有个小技巧，很多新手不知道，Chrome浏览器里有一个“Device Mode”（设备模式），点击左上角的手机图标，可以模拟各种手机和浏览器环境。你可以模拟iPhone 12，也可以模拟小米13，看看在不同“可以看网站的浏览器”环境下，页面表现如何。
第三步，查看浏览器UA（User Agent）。
UA是浏览器的身份证。在开发者工具的Console里输入navigator.userAgent，回车。
你会看到一串长长的代码。比如：
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36
这里面，Chrome/91.0.4472.124就是浏览器版本。
如果你发现用户的UA里写着“MicroMessenger”，那他就是用微信打开的。这时候，你就得针对性地调整代码，比如隐藏某些不支持的Flash插件，或者调整视频播放器的样式。
第四步，利用在线工具辅助。
有时候，用户不愿意配合，或者你只是想快速测试。你可以去一些在线的浏览器兼容性测试平台，比如BrowserStack（虽然要钱，但有免费试用）。
输入你的网址，它会生成不同浏览器的截图。
这一步能帮你发现一些隐蔽的Bug。比如，某个按钮在Chrome里好好的，但在IE11里却变形了。这时候，你就知道该去修补IE的兼容代码了。
说了这么多，其实核心就一点：不要假设所有用户都用最新的Chrome。
现实是，你的客户可能用的是十年前的电脑，或者最新的手机，或者各种奇奇怪怪的浏览器。
作为站长，我们的责任就是让这些“可以看网站的浏览器”都能正常展示你的内容。
最后，给个建议。
如果你的网站主要面向国内用户，一定要重点测试微信内置浏览器和主流国产浏览器。
如果你的用户是海外群体，那就要关注Safari和Firefox的兼容性。
别嫌麻烦，多花十分钟测试，能少接十个投诉电话。
建站是个细致活，细节决定成败。希望这篇文章能帮你少走弯路。
本文关键词：可以看网站的浏览器
