Designsor

浏览器兼容，浏览器兼容，这个词越来越多被摆上了会议，招聘，HR的嘴里，前端的嘴里，页面仔的嘴里，还有一些老板的嘴里。

可是，到底我们是在兼容什么，兼容什么东西，什么浏览器，是什么东西让我们的页面在不同终端显示不一样呢？

看上图，简单的了解下。这是张小爝制作的9款浏览器的分类表，和他们各自的“内核”。“内核”只是一个通俗的说法，其英文名称为“Layout engine”，翻译过来就是“排版引擎”，也被称为“页面渲染引擎”。

百度百科的解释：Rendering Engine

　　浏览器最重要或者说核心的部分是“Rendering Engine”，可大概译为“解释引擎”，不过我们一般习惯将之称为“浏览器内核”。负责对网页语法的解释（如HTML、JavaScript）并渲染（显示）网页。
　　所以，通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同，这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。

看过上面的词条解释应该有个大概的了解了吧，通过开始的图谱，我们知道，目前主流的这几款浏览是基于以下4个内核开发的：Trident，Gecko，Presto，Webkit。（如图分类）

所以最开始的浏览器兼容，多版本兼容其实兼容的不是所谓的什么牌子的浏览器，而是要兼容这4种不同的页面渲染解释器与其自身的不同版本产品。

这样就思路很清晰了，我们为什么做出的页面不兼容，我们到底有没有一种好的制作页面的方法可以避免这种不兼容，可以尽量的做到开发的简单轻便快速敏捷。

答案是肯定是的有，至少总结可以得出一下几点：

1，区分内核而不是区分浏览器。如果你按照浏览器来调试页面肯定工作量是*9而不是*4，鉴于他们的标准日渐趋于通化，这种灰色技术会越来越褪色。比如，你调试的FF页面良好，那么你的NS肯定也是不会变形的，如果你调试的是IE，那么你的TT,遨游等肯定也是稳定的，如果在Safari下良好，那么谷歌基本也就稳定了。opear的比较单独，但是他的内核也是最轻便简单的，有一部分和Webkit很像，有一部分又趋于Gecko，可opear的Presto牺牲了页面兼容的一些特点也算比较难调试的内核，速度快必然有削减其他性能。

2，从IE7调试开始，当然，有人会说从FF3.5开始调起，毕竟IE7没有任何可视化工具和插件可提供，而FF的插件帮助你在开发时显著提高可视化。但其实，你错了，正是那种可视化害了你的兼容性。IE7是一半偏向标准一半不标准的CSS兼容（我深有体会），基本如果做到IE7的完全正常，那么IE6基本会很少出现异常，如果稍微有点经验，因为IE下的CSS开发无可视，所以你脑子中的可视化概念一定要很强，这样避免“内核”中不一样的标准你就会自动绕着走或者第一遍就写好了hack代码。而事实证明IE7正常，FF下的几个显著兼容问题只要提前做好功课，变形几率也会降低很多很多，而且调试的时候辅助FBUG，速度会特别快。而基于其他的几款浏览器同理了。

3,仔细阅读不同内核对不同CSS样式表的渲染方式，然后尽量避免，即可最小限度的简化CSS代码量和hack量。不要走死脑筋。

近期会整理一些css的兼容性方面知识放在BLOG上，关于js由于不同版本的自身内核关系，影响不大基本就是一些DOM API和标准的方法有所不同，那又是另外一个层面的兼容问题了，因为有的内核提供了一些机制有的则没有而提供的另外的机制，这也就是JS中不同浏览器会有不同表现写法的原因了。
知道其本质才可以解决实际问题，我也是给自己总结份思路，以便以后查询。等待我的表格插件写完就会开始制作关于兼容性的表格。
：）