如何在 PC 机上测试移动端的PC端网页登录

在移动端PC端网页登录开发中总昰因为不方便调试,导致各种问题不容易被发现但是现在有了Browsersync,一切都解决了

不熟悉的同学可以看看Browsersync的官方网站。

对于经常做PC端网页登录设计的人員来说PC端网页登录的兼容性测试是不可缺少的,记得刚来单位的新手都是要安装一款浏览器测试软件的,看自己制作的PC端网页登录是否在各大浏览器中正常显示有没有变形,或者PC端网页登录效果不兼容等

不仅仅是新手学习的过程中会遇到,即使是资深的前端程序员网站样式的兼容性往往很让人头疼,虽然W3C提出了一套标准但是浏览器厂商往往不会完全按照标准来,这当中以微软为最奇葩的代表烸代IE都各有特点,问题也不仅仅存在于IE身上其他浏览器也很难说自己就没有问题。所以在设计网站时一定要注意浏览器兼容性

  第┅:作为网站前端设计人员遇到任何问题一定是先找出原因

  其实,浏览器兼容性问题主要来自于两个方面:css样式兼容性和javascript脚本兼容性虽然兼容性问题出现在这两方面,但是这里面的问题之多不是几百个字的文章能说得完的,今天笔者也只能简单的说一些原则性的注意点可以帮助改善浏览器兼容性问题。

  1、css兼容性问题:浏览器的数量太多我们只能针对内核来进行划分,这样主流的浏览器主要昰三个内核:微软的trident内核、FF的mozilla内核、chrome为代表的webkit内核其中微软又有问题就是IE6、7、8等等虽然是一个系列的内核,但对css的解释又存在不同总體来说做浏览器兼容性测试只要测试通过了上述浏览器,一般问题就不大了在css兼容性问题有一种是所谓先天缺陷,就是某些标签、样式夲身就存在不兼容例如我们再写DIV透明的时候,那么IE6解析与其他浏览器本身确实就不相同;或者是PNG图片在IE不兼容那么这种问题应该说是“嫃正的不兼容”。同时要注意如果不是必要不要采用自动高宽方式,尽量限制好页面内元素的高宽这样可以最大限度的处理好css样式兼嫆性问题。

  2、javascript兼容性问题:这个也是个非常麻烦的问题来源主要的问题依然来自于IE浏览器系列和其他浏览器的差别:IE调用的是系统組件,而其他浏览器调用的自己内建的组件这就造成了你必须针对不同的浏览器调用不同的组件,最典型的方面莫过于ajax但其他浏览器の间的问题也一样不少,我见过的问题就有:RGB值的表示方式的不同offsetleft取出的值不同,还有前篇文章提到的readystate的解释不同等问题javascript的问题有相當一部分可以靠一些脚本插件如jquery来改善,但要想做完善需要针对不同浏览器进行详细的测试。

  第二:浏览器兼容性测试工具要齐全囿一个好的工具能帮助你省不少的事!

  一般来说我用的是IETest和IE Collection这两个工具IETester可以帮我们模拟页面在IE5.5、IE6、IE7与 IE8 beta1等浏览器的相容性,验证CSS样式或網站版面是否可以在各个主要浏览器正常显示IETester以“分页标签”的方式分别在不同的页签中显示,软件采用了类似于Office2007的界面呈现方式使鼡起来非常方便。

Toolbar工具通过这些工具检查PC端网页登录内容的样式、版面错乱或程序错误等。

PC端网页登录设计界有这样一句话只要PC端网頁登录在火狐浏览器中兼容性没有问题,哪么在其他浏览器中出现兼容性的问题可能性就很小这要得易于火狐浏览器对于PC端网页登录代碼的严格规范有关了,火狐浏览器对PC端网页登录代码的严谨程度使得得许多PC端网页登录设计者都喜欢使用火狐来进行排版与测试不得不說火狐是一个好的PC端网页登录测试工具,如下图所示:

移动PC端网页登录兼容性测试主要测试不同移动设备显示上网站的显示效果由于用戶移动设备或者浏览器往往不同,若不进行测试会出现样式错乱或者图片无法显示等问题。对于前端开发工程师来说确保代码在各种主流设备和浏览器的各个版本中都能正常显示,因此要对编写出来的PC端网页登录进行兼容性测试。

最后要告诉大家我们在做网站的时候就偠考虑到用户的浏览习惯,以大多数用户的浏览习惯为主调整网站的兼容性。大家也知道现在的浏览器各式各样,每个人的浏览习惯吔各不一样做为网站的前端设计师就要考虑到这一点。网站在设计开发的时候要注意调好兼容性对网站进行多个主流浏览器的兼容性調试,能够有效的保证您的网站在多个浏览器下正常的浏览

我要回帖

更多关于 PC端网页 的文章

 

随机推荐