Tackling the Cross Browser Dragonbeast: A Roundup of some Useful Cross-Browser testing tools
12 Feb
Adobe Browser Lab:
Fast tool to see a screenshot of a webpage in many browsers. it has a nice side-by-side feature for seeing your sites next to one another in various browsers. I like this tool cause its faster then using a Virtual Machine but its not a feasible tool for testing things like rollovers and functionality. However as a “screenshot” snapshot tool its quite awesome.
Cost: Free
Browser Cam:
This service lets you use Browsercam’s farm of virtual machines to quickly test your Websites and Web Applications inside a browser, email, or on a device. I haven’t tried this one yet but i’ve heard some pretty good reviews on it. I keep meaning to test the Free Trial and consider bringing this into our studio for 2010. They also are featuring a device capture system for Iphone, Android, Blackberry and Windows Mobile.
Cost: Plans starting at $39.95/month
Browsrcamp:
I haven’t tested out the paid version but if the folks over at Browsrcamp wanted to offer me a trial i’d be happy to test them out. they offer all major Webkit and Gecko based browsers but being that it is a VNC server session there is no way (to my knowledge) to test the dreaded IE. Now if you are a PC user you can easily use Super Preview and Browsrcamp if you don’t have a mac. See for me I abandoned Windows after they stopped supporting XP and i realized how big of a piece of shit Windows Vista and 7 were. This is not me being an Apple fanboy or going for the Mac versus PC debate just a little rant.
Cost: Prices range from $3 to $99 based on the subscription but their one year subscription is only $99
Cross Browser Testing:
This tool I especially enjoy due to the ability to actually login and test a site in addition to screenshots and seeing it. They offer VNC sessions and the ability to pick an operating system, the browser of choice and then experience it in the form of screenshots or an actual “live test”
Cost: plans ranging from 19.95 to 199.95 per month
IPhony:
Looking for a down and dirty way to visualize a website inside of the Iphone? This Free tool is great for seeing how your webkit based website will look. Its a Mac only program and not a great way to test for anything other then sizing and aesthetics because its basically just calling Safari inside an iphone wrapper. Therefore if you goto a site using Flash or other non iPhone supported content you will see it rendered just how safari would render it as opposed to seeing the blue X.
Cost: FREE
Litmus:
This hosted service lets you test your designs on all browsers and offers precise bug tracking so you can find out the incompatibilities of some things performed on the site. their Free version limits you to 50 tests/month and only offers support for MSIE7 and Firefox2 on the browsers and Outlook 2003 and Gmail for email.
They offer a series of very affordable plans ranging from around $39 for a 14-day pass all the way up to $199/month for a team unlimited subscription. I’ve used this and have had nice luck with it.
Cost: FREE and Paid programs ranging from $39 and up.
Super Preview:
a Microsoft tool thats actually worth half a shit. This tool lets you visualize a site in various Internet Explorer versions.
Cost: FREE
DIY Solutions:
Running Virtual Machines is a Do it yourself solution. This route you would install a program like VMWare or Windows Virtual PC and then you can install multiple copies of an operating system on a server or your local machine. In essence that is what most of the above services are doing. Some automate taking screenshots and some actually give you a virtual session using something like VNC or a browser based version of this and you can pay for “minutes” or “processing” time. Currently at my company we are using a combination of the above tools depending on the needs of the project.
I personally use VMWare fusion quite a bit on my mac when testing IE7 and IE8. I used to use it for all versions of internet explorer but recently dropped IE6 from the dreaded lineup of Microsoft Browsers we support. Now our solution for IE6 is to put a “blocker” script in place that throws up a jquery modal window telling the user to upgrade. I borrowed and modified this from our friends at CSS-Tricks
Found this Helpful?
I’m a pretty busy guy but when I discover a set of great tools that helped improve our productivity and effectiveness I like to share. I remember the days when I would try to ask google for help and it didn’t help me. So if you enjoyed reading this, have something to add please Comment and Share this.
