五招让您的网站更适应微软Edge 及其他流行浏览器

Edge 是微软件最新的网站浏览器，带有最新的页面渲染引擎 – EdgeHTML ：该引擎潜伏在操作系统的底层，随着Windows 10操作系统一起启动。由于大部分的 Windows 7, 8 以及 8.1 的用户都可以免费升级到 Windows 10, 所以您可以预期到在接下来的一或数 个月中，您的网站将会迎接大批的Edge 用户了。

Edge是微软件公司对以浏览器的一个告别，基本上相当于把以前版本的 IE 代码完全推到重新来过了，但我确信大部分的开发人员都会喜欢微软件这个做法的。把我分享的这五点记在心里，会帮助您的网站更适应当前流行的网络浏览器，同时您也可以借机测试下网站同微软的 Edge 的兼容性。

1. 更新您的 JavaScript 库文件。

通常来说， 象 Jquery 这样的脚本库都会在新版本的浏览器发布之时，为修复相应的兼容性的问题时出一版更新。只需要简单的更新下您的 JS 框架代码，就可以避免很多和 Edge兼容性的问题了。

在我们内部调查发现：在排名前两万位的网站里面约有 57%因为没有更新JS 框架代码，从而产生了很多和浏览器兼容性的问题。您可以借用工具 (site scanner) 检查一下您的网站是否也正在用已经过时了的JS 脚本库文件。

2. 避免 CSS 前缀

CSS前缀一般都是浏览器的供应商想执行或整合新的 CSS 特性到浏览器之时，而这些特性还没有 W3C的组织正式批准下来。 如果这些浏览器的供应商使用了一些 CSS的前缀时，其 CSS 的文件格式里面就会有一些代码象下面的这些例子一样（这个例字是 IE 规格说明书里面运行的关于连接线的功能，以连接那些跨越多行的文字）。

 -ms-hyphens: auto;

对于网站来说有一个很普通存在的问题，就是漏掉了开发商指定的前缀，或是特别加了开发商们指定的前缀，而这些前缀在通用的 CSS 规范中已经不需要了。于是您的网站在微软的 Edge 浏览器或是其它一些流行的浏览器里就不能被正常的渲染了。

现在浏览器的开发商们已经很少用各种前缀了，因为处理这些前缀的后期管理和维护问题太多了。对于有些浏览器，包括微软的 Edge 就根本从来没有用过带前缀的这种标签。

如果有可能的话，尽可能的不要在您的网站里面使用这种开发商们指定的前缀标签。如果迫不得已一定要用的话，记得使用相关的工具，如 Grunt PostCSS 加入到您的 CSS 文件里面一起管理您的前缀标签。

3. 避免侦测浏览器版本

有些网站利用浏览器侦测技术，根据侦测到的浏览器的版本来决定应该使用哪种页面渲染方式。我们所推荐的是根据浏览器的特征来做判断，实践才是起首要的决定性作用，如果一个浏览器或者设备是支持某个指定的特征的时候，我们就根据这个信息调用相应的代码去润色网页。

特征侦测技术相对于浏览器侦测来说绝对是个伟大的转变，当前我们主要是通过 JavaScript 的脚本库，比方说： Modernizer 来实现的，您也可以自己编写相对应的代码来实现这个功能。

特征侦测技术在当前流行的浏览器上基本都已经配置好了，对于那些比较旧并不是原生支持这技术的浏览器，我们可以通过加填充代码来实现这个功能。

我们会在后面的文章里面详细介绍，如果更好的使用 Modernizer, 帮助旧浏览器实现特征侦测技术的填充代码以及其它的一些兼容性技术，敬请期待。

4. 成为无插件网站

Edge 并不支持插件，所以对我们来说现在是一个好时候来考虑要怎么移除那些私有的插件了，象Flash或者是Silverlight.  Edge 其实是支持 Flash 的，但他并不是通过插件的架构来使用的。 Flash是随网页一起发布的，并且 Flash 组件的更新和维护是由 Edge 团队和 Adobe 一起合作完成的。

对于有些网站，移掉这些插件是相当的容易。然而对于大多数网站来说，这并非易事，特别是那些发布了很多多媒体内容的网站。Edge 团队已经在他们的博客上面发布了指导文件，告诉您如何将您这些宝贵的内容移到 HTML的页面上。

5. 确保 Edge 的渲染模式

假如您网页中漏掉了 <!DOCTYPE>指令，或者是没有按标准正确的指出文件的类型， Edge有可能无法正常显示您的网页。 有扫描工具可以做一个简单的测试看看您的网页是否都做了正确的设置。在该工具里输入您的网站域名快速查一下是否您的网站可以通过测试。如果您想了解下这个测试的基本原理，您也可以在 Github找到这个程序的原代码。

结语

这文章是微软件关于网站开发传播系列之一，主要是包括在了 JS实践操作，开源项目以及兼容性的测试项目：包括了微软的 Edge 以及新的 EdgeHTML 页面渲染机制了，我们会在后续的文章里面继续关注相关的工具介绍。

不深思则不能造于道。不深思而得者，其得易失。

名人名言- 曾国藩

• By 优联实达(译)
• 2015-10-05
• 2057
• 公司新闻，网站开发，网站设计，UI