Adobe BrowserLab:快速预览网页在不同浏览器、操作系统下的显示效果

Adobe BrowserLab 是 Adobe CS Live(包括Adobe BrowserLab、Adobe CS Review、Acrobat.com、Adobe Story和SiteCatalyst® NetAverages™)的一部分,它是一个轻型、快速的跨浏览器测试平台。利用Adobe BrowserLab可以快速检测网页在不同浏览器、操作系统下的表现情况,同时还可以对检测结果进行对比分析,这些功能对于web设计人员来说是一款非常实用的工具。

Adobe BrowserLab特性

  • 快速、广泛预览:具有多种预览模式,可以单独查看在某一个浏览器上的效果也可以分屏对比;可以预览页面在多种操作系统、浏览器上的效果,包括IE6、7、8(Windows),Firefox(Windows和Mac OS X),Safari(Mac OS X)以及Chrome(Windows);
  • 测试简便:使用Adobe BrowserLab可以精确地找出web页面的浏览器兼容性问题,并且可以轻松的发现问题之所在;
  • 省钱:不需要在多个操作系统上进行多种浏览器的测试,降低了在硬件和软件上的花销;
  • CS5 扩展:可以直接在Adobe Dreamweaver CS5中使用Adobe BrowserLab进行测试。

使用Adobe BrowserLab

在使用Adobe BrowserLab之前首先需要到这里去注册一个Adobe ID,然后到Adobe BrowserLab登陆(点击页面右上角的Sign in)。需要注意的是,注册后需要再等几分钟才可以收到来自Adobe的确认邮件,收到后按照提示点击相应的链接即可。

登陆后,点击页面顶部的“Browser Sets”选择需要测试的浏览器,目前有12个选项可供选择。

Adobe BrowserLab

选择测试浏览器

在上图所示的页面中选择完毕后,点击页面顶部的“Test”,在下图所示的地址栏中输入想要测试的页面地址,比如http://www.maizidi.com。

使用Adobe BrowserLab进行测试

使用Adobe BrowserLab进行测试

整个测试过程需要几十秒中的时间,时间长短主要取决于你选择的浏览器数量以及页面大小等因素。测试结果如下图所示:

Adobe BrowserLab测试结果

Adobe BrowserLab测试结果

测试结果默认为单屏显示,除此之外还可以选择2-up View(双屏对比显示)以及Onion Skin(重叠显示)。另外,点击下方的“Show Rulers”还可以在结果窗口显示标尺,方便查看页面尺寸。

选择结果显示方式

选择结果显示方式

在双屏显示界面,可以上下或左右拖动窗口边界上的滑块来对页面的不同位置进行对比。在结果窗口的上方,可以选择显示结果的浏览器种类。

双屏显示

双屏显示

Onion Skin是Adobe BrowserLab中特别有意思的一个功能,可以将不同浏览器的显示结果进行重叠。这样一来,就可以迅速地找到不同浏览器的显示差异。

Onion Skin

Onion Skin

版权声明:可以任意转载,转载时请务必完整保留以下版权信息(包括超链接):
转载自麦子地 本文链接地址: Adobe BrowserLab:快速预览网页在不同浏览器、操作系统下的显示效果

相关日志

文章分类:建站心得, 有用的&好玩的网络应用, 浏览器 . 标签: , . 本篇文章的永久链接地址. Trackbacks are closed, but you can post a comment.

1 条评论

  1. Posted 2010/07/02 at 01:20 | Permalink

    没有研究过。

发表评论

您的邮件地址绝不会被公开或共享。

你可以使用下列HTML 标签或属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>