怎样可以很好地保证网页的浏览器兼容性
一、怎样可以很好地保证网页的浏览器兼容性:
尽量使用标准的网页布局方式,也就是符合W3C的布局,再加上css的使用也符合W3C的使用,推荐firefox,chrome,这样基本上,firefox,chrome,safari,opera,IE9都能表现一致,然后再针对IE8、7、6进行修改,这样完成一个页面下来,其实很少有地方需要你针对特定的浏览器进行兼容性修正。
二、怎么去解决浏览器的兼容西问题:
在开发Web APP的时候,开发机上面最好把主流浏览器都装上,比如说:Chrome、FF、safari、IE、IE Tester... 在大多数情况下,FF和Chrome差别不是很大。
2.开发过程中要注意,每做好一个样式,都要跑一遍所有要兼容的浏览器,这样虽然开发过程时间会比较长,可是会比你开发完成后再来改效率高得多,我曾经就碰到过一个产品,开发完成后由于兼容性问题导致其发展面很窄,最后不得不重新开发。
3.如果真的碰到样式不兼容的情况,那么只能针对不同的浏览器做相应的调整。
4.一些新的特效可能在一些版本落后的浏览器里不兼容,这个时候我们的原则就是:不求效果绚丽,只求工整规范 。
5.多积累,多看看符合W3C标准规范的CSS手册和JS手册,注意积累,或者用一些开源框架,那样兼容性可以省下不少时间。
三、跨浏览器开发应该使用的一些经验:
1)一些关于跨浏览器/设备的工具
1. modernizr.js 特性检测器,有就使用原生,没有就加载polyfill
2. polyfill/shim 向后兼容的浏览器的js补丁,一般和modernizr一起用
3. jshint.js js语法检测器
4. Boilerplate 开发的最佳实践的初始模板
5. 阅读第三方库关于最低版本支持
6. 使用js单元测试,测试目标浏览器
7. Responsive Design (针对屏幕大小)
8. normalize.css 统一浏览器基本元素的风格
2) 一个策略:
把浏览器分两类:一类是历史遗留浏览器,一类是现代浏览器,然后根据这个分类开发两个版本的网站,然后自己定义那些浏览器是历史遗留版本,凡是历史遗留版本浏览器,统统使用历史遗留版界面,然后通过通告栏(信息通知系统)明确告知本版本有些功能不能使用,尽快转移到现代浏览器上。然后现代浏览器的网站版本,功能全开,提供最好的用户体验。
3)最后手段:
直接使用jReject.js这类插件,弹出有全黑蒙板的对话框,告诉用户这个网站什么版本的IE/浏览器不能用,请使用至少什么版本的IE,firefox和chrome.(这个是最后手段,以上方案都失效的情况下使用。)
4)一个提醒:
跨浏览器兼容问题,过去有,现在有,以后会更麻烦,所以这个问题在你的项目开始前,就必须确定下来最低支持的版本是什么,然后设计一个对应兼容方案。
不要等开发完毕了,才告知要必须兼容个ie6啥的,那你的项目就有得好改了。
5)面向未来:
2015年es6就要正式完成了,等es6出来后,如何把es6的javascript向后兼容呢?这里我有个概念,还没实验过:
1.使用es6编译器把代码导出成es5代码
2.使用modernzr检查浏览器是否支持es6,支持用es6代码;不支持,用编译好的es5代码并且加载es6shim。
3.使用grunt把es6编译过程完全自动化
2018-06-27 · 做真实的自己 用良心做教育