遇到网站打不开、页面加载异常，很多人第一反应是检查自己的网络。但有时候问题并不出在路由器或宽带，而是目标网站本身。这时候，一个简单的网页示例就能帮上大忙。
用静态页面判断问题源头
比如你发现公司内部系统突然无法访问，提示“连接超时”。先别急着重启电脑，可以在本地创建一个最基础的 HTML 文件作为网页示例，测试浏览器是否正常工作。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>测试页</title>
</head>
<body>
<h1>能看见这行字，说明浏览器没问题</h1>
</body>
</html>把这个文件保存为 test.html，双击打开。如果能正常显示内容，说明本地浏览器和渲染功能正常，问题大概率出在网络请求环节，比如 DNS 解析失败或远程服务器宕机。
对比远程资源加载情况
有时页面能打开，但部分功能失效，比如按钮点不动、图片不显示。这时候可以做一个带外部资源引用的网页示例，模拟真实场景。
<img src="https://example.com/broken-image.jpg" onerror="console.log('图片加载失败')" />
<script src="https://cdn.example.net/lib.js"></script>通过开发者工具观察这些资源是否成功加载，能快速判断是本地防火墙拦截了某些域名，还是第三方服务本身出了问题。比如你在咖啡馆连 Wi-Fi 发现某个 JS 资源一直 404，但在家里正常，那很可能是公共网络屏蔽了该 CDN 域名。
模拟跨域与接口调用
现代网页依赖大量 API 接口。当你登录某个管理后台后数据空白，怀疑是接口被阻断，可以用一个轻量级网页示例发起请求来验证。
<script>
fetch('/api/user/profile', {
method: 'GET',
credentials: 'include'
})
.then(res => console.log('响应状态：', res.status))
.catch(err => console.error('请求失败：', err));
</script>如果这个请求在你的环境里 consistently 失败，而别人可以正常使用，那可能是你这边的网络策略或代理设置有问题。也可能是证书异常，尤其是在企业内网环境下。
临时替代方案辅助沟通
当你要向技术支持描述问题时，直接发一个可运行的网页示例比文字描述清楚得多。比如你说“表格导出功能没反应”，不如附上一个简化版页面，里面只保留导出按钮和关键脚本。对方打开就能复现，省去反复确认环境细节的时间。
这类小技巧在日常排错中特别实用。不需要懂太多前端知识，会复制粘贴几个标签就能定位一大半常见问题。下次遇到网页异常，不妨先写个几行代码的示例试试看。