May 10, 2013 in Web Designer Tips

Web Designer Tip: Browserstack for Browser Testing

It’s spring cleaning time again, which means that it is time to review my web browser testing set-up.  I once again pondered if there’s a better solution out there that can replace my current web browser testing set-up, which includes:

  • Legacy PCs
  • Virtual Machines
  • Browser Screenshot Services
  • Device Lab

Forgive me whilst I take a moment to rant about why all those above options are rubbish, and then tell you why you should use Browserstack for cross browser testing instead.

Here is a basic breakdown of what I hate about my current set-up:

Legacy PCs

Old PCs are big, bulky and look horrid in my smart office space.  Plus, I have to physically switch between different machines.

Virtual Machines

Virtual machines are better, however you have to reboot to get your operating system or a different browser set up.  For example,  my preferred developer tools are on the Mac, but I need to test IE8 on Windows, which means more rebooting than a London derby match!

Browser Screenshot Services

Web Browser screenshot services slow down my work flow virtually to a snails pace; basically it only allows you to test one web page at a time and with no interaction testing.  It’s not possible to determine through a screenshot exactly how your navigation works or how that featured slider transitions between images.  Screenshots are all very flat and dull, and not very helpful.

Device Lab

My ever growing army of tablets – that don’t see the light of day – and expanding smartphone collection – that have never made a phone call in their cellular lives – is starting to irritate me.  It’s really great to get “hands-on” with these devices being responsive design is great and mobile phone usage, but my fingers and wrists ache with swiping and refreshing to test a design.  My office is running out of sockets; I’m worried about the Health & Safety man’s annual return.

Introducing Browserstack

I’ve been keeping an eye on a promising web app and excitedly, like a fat kid in a sweet shop, upon peeling the lid open, I was happy to find it’s full of sweet stuff inside.

Last time I checked, Browserstack didn’t support IE 10 or Mobile devices, but the good news is that it does now.

Browserstack is a web app that you subscribe to, that grants you access to their servers, which have real operating systems and real web browsers for you to open up your web page and undertake tests on:

  • All major Web Browsers (IE 6 – 10, FF 3 – 20, Safari 4 – 5, chrome 14 – 27)
  • All major Operating Systems are supported with all the different web browser variants (XP , Mac OSX Lion, Mountain, Snow)
  • All major Smartphones & Tablets (Apple IOS, Google Android, Opera)

A few snippets from Browserstack FAQ’s:

Do you provide real desktop browsers for testing browser compatibility?

We provide access to real desktop browsers including all versions of Internet Explorer.  We do not use any kind of desktop browser emulators, virtualization or IE Tester.  We provide one IE per virtual machine, ensuring IE browsers do not share any DLL or settings, providing you with an original Internet Explorer experience.

Are mobile emulators good enough for testing website on mobile browsers?

BrowserStack provides access to official mobile emulators of Apple iOS, Google Android and Opera Mobile.  This is the closest that one gets to a real device.  The Android and Opera Mobile emulator behaviour is 100% similar to the real device.  The iOS emulator is more than 99% similar.  Moreover, our Android emulator has pre-installed device SDK provided by the device manufacturer, which makes it a perfect emulator.

Use Browserstack

I highly recommend everyone uses Browserstack for cross browser testing as it’s faster overall than my old approach. I’m not reliant on any one machine any more, plus  it’s priced competitively starting at just £12 USD a month subscription. I can finally stop dusting down all those legacy Windows PCs.

About Anthony

Anthony Brewitt is Design Bit, has been for years - he's an experienced WordPress Designer, and Muggle-born Marketing Philosopher. Let’s talk about your website; your marketing, blog design, and that cool new mobile web thingy. Contact Anthony

One Response to Web Designer Tip: Browserstack for Browser Testing

  1. Hi Anthony! I’ve just stumbled on your blog, You’ve got some great pieces here which are really helpful to a newbie like me. I have been working as an SEO in a full service agency but have not yet got to grips with actual elements of design which really interests me. Thanks for all the useful info!

Leave a Reply