[TOC] 今天的用户可以从相当大的范围中选择web浏览器，每种浏览器都提供了略微（或相当）不同的体验。作为开发者，我们的责任恰恰是选择我们创建的网页展示给用户的方式。本节描述我们是如何做出这当中的一些决定的。 ## 我们支持的浏览器  **Isobar 支持任何 [Yahoo 浏览器支持分级](http://developer.yahoo.com/yui/articles/gbs/) 中列出的A级浏览器，除了Opera之外。对此也可能会有其他的例外，基于地区市场和它们特定的指标**。 我们会努力支持任何客户指定的其他任务关键浏览器 (IE 5.5, Opera, Konqueror, Safari 3 on PC, 等等)，虽然我们不能保证所有功能都可能实现。 ## 我们的测试方式 全面的浏览器测试对于每个web项目都是必须的。必须付出大量精力进行跨浏览器和平台测试，以确保质量和一致的用户体验。配置测试环境会是一项挑战，却是值得去做的。 ### 在Microsoft Windows上的测试 #### IE 测试 由于不可能在一台PC上安装多于一个IE浏览器，IE的测试是个挑战。幸好微软最终提供了老版本IE的开发版下载。这些运行拆解版Microsoft Windows的虚拟磁盘时不时地失效（过期）。通常隔几个月就需要重新设置它们。从你的MSD版权（如果有）获取的Microsoft Windows开发版也会是一个选择，取决于你能够获取到的东西。 * [虚拟 PC](http://www.microsoft.com/windows/virtual-pc/default.aspx) - 虚拟PC必须安装在你的计算机上，如果你用的是Windows 7，你必须使用"XP 模式”。 * [Microsoft Windows VPC 映像](http://www.microsoft.com/downloads/en/details.aspx?FamilyID=21eabb90-958f-4b64-b5f1-73d0a413c8ef&displaylang=en) - 有多种虚拟磁盘映像，你可能需要安装多个以构成全面的测试环境，这取决于你的项目。 此外，其他不是那么有效的IE测试选项（通常是不推荐的）包括了 [IETester](http://www.my-debugbar.com/wiki/IETester/HomePage)，它还是好于 [Multiple_IE](http://tredosoft.com/Multiple_IE)和 [IE7 standalone](http://tredosoft.com/IE7_standalone)。 #### Firefox * [Firefox 3.6+](http://www.mozilla.com/en-US/firefox/all-older.html) 也必须安装在本地 - 以及通过 [移动应用](http://portableapps.com/) 获取的 3.0 版本。 * 如果你能胜任， [安装 Firefox 3, 3.5, 和/或 3.6 版，和 FF4 安装在一起](https://wiki.molecular.com/wiki/Install_Firefox_3)。Firefox 配置管理器允许你安装到不同的目录并 [为每个版本保持不同的配置文件](http://lifehacker.com/5481213/master-multiple-firefox-profiles-for-more-productive-browsing)。 #### PC 版 Safari * 使用 [最新的PC版Safari版本](http://www.apple.com/safari/). 它和 OSX 版的 Safari 的一致性达到 98% ，但不是完全一致，所以如果它是必需的平台就需要测试。 #### Opera * 你可以下载 [存档的旧版本](http://arc.opera.com/pub/opera/win/)。要运行多个版本，可以把它们安装到不同的文件夹中。 #### Google Chrome 和 Chrome 版本 Google Chrome 会自动更新，正常情况下绝大部分用户都会有最新版本。要是每种浏览器都这样多好啊。对于Google Chrome就不需要担心旧版本的问题了。 ### 在 Mac OS X上的测试 对于核心的Mac OSX 浏览器，Mozilla Firefox, Google Chrome和Apple Safari 提供的浏览体验基本和它们的Windows版本一样。尽管如此，某些操作系统级的差异还是会出现，网站必须在两个平台上进行测试。典型的差异是关于字体渲染，所以有时候会冒出间距问题。 #### 测试在Mac上安装的Windows环境 在 Mac OSX 上测试基于Windows的浏览器有几种选择。首先，Mac 提供了一个 "[boot camp](http://en.wikipedia.org/wiki/Boot_Camp_(software))" 分区，它允许你在Mac 上启动一个Microsoft Windows分区。这是一个复杂但完整的测试环境。一旦你用Windows启动，就可以用通常 [Windows 环境下的测试方法](http://coderlmn.github.io/code-standards/#vhds)。 其他选择包括在 Mac OSX 内部虚拟化 Windows，让你可以在Mac OS内部运行Windows。 [Microsoft 虚拟磁盘](http://coderlmn.github.io/code-standards/#vhds) 在这里的大部分选择中是可以打开或转换的，这样就能在一定程度上利用Windows 用户可以用到的那些测试方法。即使你也可以同时在Mac上测试，有些人还是会认为这样更加灵活... * [Parallels](http://www.parallels.com/products/desktop/) - Parallels 可用，而且可能已经被本公司IT部安装到你的Mac上了。 * [VMWare Fusion](http://www.vmware.com/products/fusion/overview.html) - VMWare Fusion 通过它们的 Fusion 产品提供了同一级别的 Windows 虚拟化。 #### Mozilla Firefox 正如在Windows 上一样，你可以在一台Mac 上安装和运行 Mozilla Firefox 的多个拷贝，虽然通过配置管理器设置多个配置更为复杂一些。尽管如此，你可以通过一些小技巧，[通过Automator程序创建分开的配置并顺利运行它们](http://sonnygill.net/mac/mac-multiple-firefox-profiles/)。 ## IE standalone 版会出现的bug 注意：IE6 standalone 版在某些情况下对透明度的实现是有bug的。这会导致任何应用于CSS 过滤器的透明度（例如alpha透明度或者24位PNG）失效。在这种情况下必须测试透明度，你会需要本地安装的IE6。 还有人发现安装在Vista 平台上的IE7 和Windows XP 上的IE7 确实有差异，所以，你可能会希望确保团队中的某个人也有这种配置。[IETester](http://www.my-debugbar.com/wiki/IETester/HomePage) 修复了一批这样的问题，和Xenocode 浏览器的做法类似。 ## 浏览器分辨率 除了适应各种浏览器，开发者还必须持续注意用户的屏幕分辨率。随着显示器屏幕越来越大，分辨率的广度也随之增加。下面是关于分辨率的一些工作准则。 **1024px 分辨率** * 估算的折叠位置在 570px 处。 * 优化宽度： 960px - 在两侧留出合适的内边距，960可以被很多数字整除，而且能够很好地配合[IAB 广告的标准宽度](http://www.iab.net/iab_products_and_industry_services/1421/1443/1452) * 增大宽度： 970px - 在大部分浏览器中还会留出一些内边距。 这个数字和 [黄金比例](http://en.wikipedia.org/wiki/Golden_ratio) 吻合得比较好 * 最大宽度： 996px - 在主流浏览器中还不会产生水平滚动条。 [基于此处的研究](http://www.nealgrosskopf.com/tech/thread.php?pid=43) ，如果你不希望出现水平滚动条，宽度的最大值是 1003px。 **关于窗口大小的当前统计** * [真没劲 - 1024px 分辨率下的优化宽度？](http://www.cameronmoll.com/archives/001220.html) * [浏览器、操作系统和搜索引擎的市场占有率](http://marketshare.hitslink.com/report.aspx?qprid=17&qpmr=100&qpdt=1&qpct=3&qptimeframe=M) * [全球Web 统计](http://www.w3counter.com/globalstats.php) **不过，系统分辨率和浏览器尺寸并不是一样的** * [浏览器尺寸很重要 - 实际数据 | mentalized.net](http://mentalized.net/journal/2006/10/24/browser_size_does_matter_actual_numbers/) * [我需要支持什么样的尺寸 | baekdal.com](http://www.baekdal.com/reports/actual-browser-sizes/abs-sizes/) * [调查结果： 只有50.4% 的受访者会把浏览器窗口最大化](http://www.456bereastreet.com/archive/200704/poll_results_504_of_respondents_maximise_windows/) * [屏幕分辨率和页面布局](http://www.useit.com/alertbox/screen_resolution.html)