back

New features and added support in
Adobe BrowserLab

by Scott Fegette

The initial preview release of Adobe BrowserLab has been incredibly successful. With more than 52,000 users and over 1.8 million screenshots generated so far, the BrowserLab community is growing quickly.

If you haven't tried or were previously unable to obtain a BrowserLab account, I have good news: The preview release is once again open to the public. I encourage you to check out our innovative solution for cross-browser web design proofing and debugging.

In this article, I am going to tell you about new features and capabilities that we recently added to BrowserLab.

Newly supported browsers

Adobe is continuing to respond to the critical browser platforms and versions that our customers are demanding. BrowserLab now supports the following browsers:

Rulers and guides

Providing speedy access to cross-browser screenshots is nice, but for truly comparing the results, BrowserLab now includes rulers and guides to help you measure relative areas and sections of your page, determine pixel offsets for CSS-based fixes, and better visualize how your layout is shifting (or ideally, staying constant) between browsers.

Rulers and guides

Custom registration

For entire pages, BrowserLab's Onion Skin mode can be helpful, but it can be confusing if you're only concentrating on a specific region of your page or application. BrowserLab now allows for custom registration to account for expected (and acceptable) shifts in your layout across browsers, and concentrate only on the relative differences of the area of a page you're truly concerned with in both the 2-up and Onion Skin modes.

Custom registration

Move and pan

Sometimes simple usability tweaks are what it takes to make a software product feel more appropriate. When you're viewing large pages or zooming in on a screenshot in BrowserLab, it can be distracting to use scrollbars to move around in your screenshot. With BrowserLab, you can now use the Command (Mac) and Control (Windows) keys to move/pan using the mouse (and not the Space key as previously implemented). This matches the functionality of many other Adobe Creative Suite applications. And of course, scrolling is still synchronized in 2-up view, so you can keep both panes in sync as you move about in one of your two screenshots.

Move and pan

Screenshot delay

Although BrowserLab is focused on troubleshooting standards-based web designs, many web designers and developers use both Flash and Ajax or JavaScript to manipulate a page after it's fully loaded. In the initial preview release of BrowserLab, you often could not see post-load content or changes because the screenshot was snapped as soon as the page finished loading. Now you can specify up to a 10-second delay between the page's final load, and the screenshot capture, which enables you to capture any Ajax data or interface animations that occur after the page loads, as well as catch FLV movies after they load for better visualization of your hybrid HTML/FLV experiences.

Screenshot delay

What's next

Cross-browser design and layout isn't necessarily getting easier as the landscape of browsers continues to expand, but the BrowserLab team is committed to doing whatever we can to help make life easier and more manageable for web designers and developers.

Adobe will keep pushing BrowserLab forward. We take our cues directly from the BrowserLab community, so your feedback is always appreciated. Let us know what you like, dislike, or hope for on the BrowserLab forums so we can ensure BrowserLab meets your needs.

> Download Adobe BrowserLab

‹ Back


Scott Fegette is the Technical Product Manager for Dreamweaver at Adobe - focusing on web standards, community outreach and developer relations. After hours, Scott is a professional musician and photographer.