Every browser is different.* Ask any web designer about their craft and you’ll eventually get them talking passionately about these differences. How Internet Explorer 6 renders CSS pseudo-elements (badly) and handles padding and spaces (randomly). How IE7 ignores CSS drop shadows. How floating divs never seem to work the same way in any of the browsers. These peculiarities have driven many a developer to strong drink.
When it comes to testing new webpage designs in Google Website Optimizer, speed can be essential. You want to get the experiment out the door as soon as possible so you can get preliminary data. Sometimes this means that things slip through QA. Browser testing is exceptionally finicky and time consuming. Not every office has a spare Mac sitting around, and with three different versions of Internet Explorer still in wide use—and no easy way to install all three versions on a single PC—it’s no small feat to make your page variations all work perfectly in every popular browser.
With just a few Google Analytics Advanced Segments in your arsenal, however, you’ll be able to see whether or not your new pages are functioning fine in all the right browsers. Hit the jump for details.
First, you’ll need to create a new Advanced Segment for each landing page in your experiment. Check out Segment 1 and Segment 2 for more detail.
Next, apply both segments to your reports and head to the Browsers reports. This report defaults to the pie chart, but I like to switch back to the data table:
Now check out each browser and pay attention to the Bounce Rate column for each Landing Page segment. If one particular browser has a Bounce Rate that seems particularly out of whack, drill down and check out the versions. Then, using your findings, test the page live (if you can) or use a site like Browsershots.
What other browser testing tips or tricks do you have to help ensure that your site is fit for all visitors? Share them in the comments.
* “No two browsers are not on fire.”