我的团队正在开发一个新网站,该网站应该是跨浏览器兼容(IE 8,Chrome,Safari,Firefox,Opera)和跨平台兼容(桌面,平板电脑,智能手机).
我们一直在研究实现这一目标的许多新方法,例如HTML 5,响应式设计,使用JS库,从用户那里抽象出很多浏览器的混乱,但是从浏览器甚至是MVVM,但是一个主要的我一直面临的问题是浏览器的变化速度有多快.由于Chrome和Firefox都使用持续交付模式,因此测试变得越来越难.从它的外观来看,其他网站也存在同样的问题(这些天似乎是关于某个网站是否可以在特定浏览器中运行)
>您或您的团队在测试新浏览器时会有什么建议？
>在开发过程中您做了哪些事情以减少浏览器更新出现时代码中断的可能性？
>您如何决定何时或将放弃对浏览器版本的支持？
你的问题
What suggestions do you or your team have for testing new browsers as they come out?
实际上,正如你所说,Chrome和Firefox正在不断提供,因此它可以简化这一过程.您拥有的最新版本通常始终是用户拥有的版本.
对于任何其他浏览器(以及Chrome和Firefox旧版本),只需选择每个浏览器的版本并充当“高通过滤器”,从您选择的版本开始测试任何版本.
How do you decide when you will or will drop support for a browser version?
看一下浏览器使用的统计数据.有许多资源,例如statcounter,w3counter,w3cschools或wikimedia.如果可能,请在页面中添加分析跟踪器,您将获得有关访问者用于访问网站的设备,平台,浏览器和版本的数据.
What things do you do during development to decrease possibility of having code break when a browser update comes out?
关键是要根据现有标准使用定义明确的方法.继续阅读以获得个人推荐.
工作流程可以简化交叉浏览
第1步：引导
最初决定：Graceful degredation versus progressive enhancement.两者都是有效的技术,但使用第一个修复现有项目和第二个用于新创建的项目是有意义的.
然后选择库到avoid typing existing code,重点关注3种语言：JavaScript,CSS和HTML. HTML5(CSS3)是当今更好的选择,但必须提供对旧版浏览器的支持.以下库可以轻松支持它们：
> modernizr用于js或css的特征检测和条件加载.
> jQuery为ajax和dom相关的任务.
> normalize.css用于规范化默认浏览器样式,而不仅仅是“重置”它们.
请注意,上面列出的所有js库都允许自定义构建,这在性能很重要时很重要.
Html5 Boilerplate提供了一个强大的模板,从中开始布局.它包括modernizr,jQuery和normalize.css. Its github repository是一个很好的资源,可以学习很多关于跨浏览技术的知识. This article on its wiki有一套很好的链接可以开始学习.
第2步：做好工作
设计应该是移动优先和响应. This article on html5rocks介绍了为什么以及如何.
在“做这项工作”的同时：
>关注the w3c standards.尽可能避免使用黑客攻击,特别是CSS黑客攻击.经常回顾HTML5 specification,因为它非常不稳定.
>编写javascript时,请注意ECMAScript 5功能.依靠库来避免因浏览器实现不足而导致的代码中断. Do not extend the DOM.
> Automate tests尽可能.布局和特殊布局抛光(包括动画)是manually tested,因为它更快,但是像表格子画面这样的UI功能可以通过自动测试进行完美测试.
>使用工具简化任务. Chrome devtools或Firefox firebug是最基本的必备用途,但有许多工具可以简化交叉浏览测试,甚至可以自动化这些测试.
附件：工具和资源
跨浏览器测试
> Browserstack真棒.允许在所有设备,浏览器和版本上进行测试.
> Browserling是browserstack的替代品.这是developed and maintained年由Peteris Krumins和James Halliday,他们都是the node.js community的知名成员和知名开发人员.他们还发布了一个自动化过程的工具,名为testling-ci,但这仅在后端使用node.js时才有意义.
> modern.ie提供了便于在Internet Explorer上进行测试的工具.该站点由Microsoft开发,通过预先安装的软件通过browserstack和可下载的虚拟机映像提供实时测试.
“响应式设计”的适应性测试
> respon.si是一个在线工具,用于测试布局的视觉外观.它允许选择分辨率,因此它对响应式布局测试很有用.请注意,选择分辨率的任何其他工具都可以轻松地执行相同操作.
