How to do cross browser testing

You might not realise it, but right now you’re looking at a browser. A browser is the program on your computer that allows you to view the internet—yep, that thing you’re staring at this very moment as you read this sentence. There are lots of different browsers available, like Google Chrome, Firefox, Safari and Internet Explorer (if you look at the top left-hand corner of your screen, you should see the name of the browser you’re using). Not only are there different browser types, but there are also different versions of the same browser. Browsers are constantly updated and new versions are released for download. And with so many different browsers and versions, problems can arise…

The problem: browser incompatibility

Each browser is different. A different browser or even a new version of the same browser will work a little differently—that means it might view pages a little differently too. New browsers or versions can cause headaches for website owners (and website builders, like us!), because sometimes a website won’t work properly in the new browser. And this happens all the time. Just recently (October 18, 2013, to be precise) Microsoft released their latest Windows update, which included a new version of their browser, Internet Explorer (IE11). Just two days after launch, Google wasn’t working correctly with the new Internet Explorer, with some users having trouble searching for websites. So while your website might be looking great in your own browser, there may be problems when some of your customers try to view it.

What kind of problems? Well, for instance, the latest browsers allow you to put rounded corners on elements like, say, buttons on the page. It does this by using particular programming languages (specifically, HTML5 and CSS3). But older browser versions (e.g., Internet Explorer 8) don’t fully support these languages. Problems can crop up from other programming languages too (e.g., Javascript, CSS styles). The result? Pages doesn’t look quite like they’re supposed to look.

The solution: browser checking

The way to avoid these problems is by conducting browser checking. Browser checking means looking at your website with different browsers and different versions, making sure everything looks right in each one—things like: images and text in the right place, buttons functioning properly, information boxes popping up when they’re supposed to, slideshows working correctly etc.

If you’re not a Rocketspark customer

Remember, just because it looks fine in Google Chrome, doesn’t mean it looks the same in Internet Explorer. So if you haven’t done any browser checking, then now would be a good time to start. There are two ways to do so:

  1. Use a third-party provider and use their services to test it. For example, you could try using BrowserStack.


  2. Download the various different browsers and/or virtual machines (programs that allow you to switch between various operating systems without restarting your computer) to test them on your own machine, which is how we do it at Rocketspark. The advantage of doing it this way is that you don't have to pay a subscription fee. The disadvantage is that this may take some time, not to mention extra bandwidth to download and setup the browsers. If this is the method you prefer then here are the links for the main browsers you will want to check:

Google Chrome:  www.google.com/chrome

Safari:  http://support.apple.com/downl...

Mozilla Firefox:   http://www.mozilla.org/en-US/f...

Microsoft Internet Explorer (8-11*):  https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/

Over 90% of our clients use either Google Chrome, Safari, Firefox, or Internet Explorer (versions 8-11) on their computers, so we check our websites with those browsers to make sure most of the population are getting a smooth experience with our websites.

If you are a Rocketspark customer

Then you don’t need to worry! Here at Rocketspark, we take care of all the browser checking for you. For each browser checked we use virtual machines (see above for a definition). This enables us to simulate what regular visitors will get when they use various different browsers. We thoroughly browser checked each design and function before putting them in our Blastoff Website Builder & our custom-built content management system (CMS). When new browsers come out and new features get released, we check each feature and browser to ensure your website stays looking sharp. (If you’ve put in some HTML code using Source Code Mode we recommend browser checking that yourself).

You don’t need to pay anything extra—updates and browser checking are all part of your Rocketspark website subscription. And if you’re a Design Boost/Professional package customer, because of the extra styling and features we add to your site, we specifically browser check your new website just before launch to ensure it’s looking in top shape for all browsers. So you can sleep easy knowing that your website will look great regardless of what browsers your customers are using.

*You will need to download a Virtual Machine Package, and then you can use the downloads from here. All the instructions and more resources are on this page.