我们的方法.pdfVIP

2 第 1 章 我们的方法 第 1 章 我们的方法 在高级CSS、客户端JavaScript和Ajax ，以及Flash等浏览器插件的支持下，最新的网页技术创 新赋予了现代网站视觉吸引力和丰富的交互能力。不过它们有很大的局限性：浏览器和设备对这 些技术的支持程度参差不齐。虽然现代浏览器和最新的移动设备有能力渲染出非常复杂的界面， 但它们所占的比例还不够大。正如引言中谈到的那样，制作一个只适用于少数高端浏览器和设备 的网站或应用程序很难服务于最广大的用户。 我们想要确保客户的内容、消息和功能可以到达每一个人，不仅是那些使用现代浏览器（支 持最新网页技术）的人，而是任何有可上网设备的用户。因此，我们在几年前开始将渐进增强的 理念引入客户的项目中。 渐进增强的原理很简单：输出符合标准的纯HTML页面，使所有设备都更有可能渲染出可用 的内容。然后，只为那些能理解CSS和JavaScript的浏览器在页面上无缝叠加增强的样式和脚本。 不过，开始用这种方法构建网站并测试结果时，我们有了一个重大发现：这种方法没有考虑 到许多旧版浏览器和较新的移动浏览器仅部分支持JavaScript和CSS。此外，用户还可能会基于速 度、安全或可用性等原因有意禁用这些技术。在现实世界里，CSS和JavaScript必须协同工作才能 实现复杂的应用程序界面和组件。（在启用JavaScript但不能正常支持CSS定位的浏览器中，日历 组件或滑块肯定不能用。） 在对基于渐进增强的网站进行测试时，我们发现不少浏览器会把一个本来可用的HTML页面 “增强”为一团“乱麻”。原因就是这些浏览器并不完全支持它们运行的脚本和应用的样式。然而， 我们如何知道哪些浏览器有能力正确渲染出这些增强信息呢？ 我们意识到，要实现渐进增强方法，让每个人都有可用体验的目标，需要做三件事。 仔细检查设计，确保每一部分（即使是最新潮的Web 2.0或Ajax组件）都是基于结构清晰 的语义化HTML ，在任何完全不支持CSS或JavaScript的浏览器上，都能提供功能完整的基 本体验。 在添加增强信息之前 ，先测试某种浏览器的CSS和JavaScript支持程度，以更好判断是为 它提供基本体验，还是应该进行增强。 对那些已升级到增强体验的浏览器，要确保花大力气维护可访问性，比如提供键盘导航 支持和添加支持屏幕阅读器的功能。 本章将讨论为确定哪些浏览器应该获得增强体验而开发的浏览器能力测试模型，以及它可以 1.1 测试浏览器能力 3 测试哪些功能。然后将介绍我们在日常客户项目中使用的渐进增强方法，这个方法的第一步叫做 1 “X光透视”。这一步会分析某种复杂的界面设计，拟出能支持基本功能体验的语义化HTML ，然 后制订计划，为有能力的浏览器开发高级CSS和JavaScript ，以创造增强体验，同时保持对屏幕阅 2 读器的完整可访问性。 3 1.1 测试浏览器能力 4 我们对渐进增强的初始研究揭示出大多数开发者选择的页面增强方式是以下两者之一：向所 有启用JavaScript的浏览器传递增强信息，或通过浏览器嗅探 （检测Internet Explorer等特定用户代 5 理或WebKit这样的渲染引擎）仅对特定的一组浏览器输出增强信息。 我们从一开始就排除了浏览器嗅探，原因有下面几点。 6 有效的嗅探需要精确了解每种浏览器的行为（以及其各个版本的变化情况），这使维护脚 本成为一项巨大、复杂和永无止境的挑战。 7 根据定义，它不是向后兼容的。你只能嗅探当前存在的浏览器，如果某种能提供增强体 验的新款浏览器明天发布，它就会被拒之门外，除