别让 JavaScript 绑架了核心体验：重构 HTML 渐进增强思维

打开一个现代网页，如果因为网络波动导致脚本加载失败，用户是否还能完成核心操作？比如提交订单、阅读内容或联系客服。很多开发团队沉迷于炫酷的交互，却忽略了最底层的容错机制。一旦客户端环境不支持新特性，或者脚本执行出错，整个页面就可能变成“白屏”。这时候，HTML 渐进增强（Progressive Enhancement）不再是多年前的老生常谈，而是保障业务可用性的最后一道防线。

渐进增强的核心逻辑并非拒绝新技术，而是坚持内容与结构优先。想象盖房子，地基是语义化的 HTML，墙体是 CSS 样式，装修和智能系统是 JavaScript。如果装修没弄好，房子依然能遮风挡雨；但如果地基塌了，再豪华的装修也无济于事。这种分层构建的策略，确保了在任何浏览器版本、任何网络条件下，用户至少能获得基础功能。

实际开发中，最典型的场景莫过于表单提交。许多开发者习惯在输入框绑定复杂的验证监听器，点击按钮后通过 AJAX 异步发送数据。这种方式体验流畅，但一旦脚本阻塞，用户连最基本的 HTTP 请求都发不出去。改进方案其实很简单：保留原生表单属性。设置 <form> 的 action 地址和 method，使用 type="submit" 定义按钮。这样即使禁用 JavaScript，服务器端也能收到标准数据，用户依然能完成任务。在此基础上，再通过 JS 拦截默认行为，实现无刷新提交的平滑过渡。

除了功能性，这种理念对 SEO 和无障碍访问同样关键。搜索引擎爬虫更倾向于解析静态语义清晰的 DOM 结构，而非等待脚本渲染后的动态内容。对于依赖屏幕阅读器的视障用户，正确的标签层级（如 <article>、<nav>、<label>）比精美的动画更能提升使用效率。编写符合语义的 HTML 代码，本身就是对用户体验最大的尊重，也是降低维护成本的最优解。

如何判断自己的项目是否做到了这一点？有一个简单的自测方法：在浏览器开发者工具中开启模拟 JS 禁用状态，同时降低网络速度至低速 3G。此时浏览页面，如果核心信息可见、关键链接可点、主要任务可完成，说明底层架构足够健壮。反之，如果页面无响应或提示“请启用脚本”，就需要回头重构基础代码了。

技术迭代越快，越容易让人产生浮躁心态。追求最新的框架固然重要，但不要忘记互联网的本质是连接与传递。当我们把精力从单纯的炫技转移到夯实基础结构上，不仅能减少线上故障率，还能让产品在老旧设备或特殊环境中保持竞争力。真正的优雅不是处处展示高级特性，而是在能力受限时，依然能稳妥地服务每一个访问者。

从今天开始，尝试重新审视那些被忽略的基础标签。与其后期花大力气修补兼容性问题，不如在初始设计时就预留出退路。这才是可持续开发的正确姿态。