Time vs. Thoroughness
With endless versions of software, operating systems, browsers and devices, it can be difficult to know where to start with browser testing.
How do you balance browser testing with budget constraints? And how do you choose which bugs to fix and which aren’t worth the effort?
This is a great article on browser testing. It suggests testing in three strategic phases to get rid of extra work. We’ve adapted this method a little and created a customizable Google spreadsheet to go along with it. You can download the spreadsheet below and use it for your own projects.
For new or redesigned websites, this 3-step approach will help catch browser/device issues without spending more time than you need to on testing.
- Google Analytics
- BrowserStack, or another browser testing platform
- Window Resizer Chrome Extension
- Google Spreadsheet (scroll down to download)
Before you start
Check Google Analytics for user data
You’ll want to look for the most popular versions of browsers, operating systems and screen resolutions. You can enter this data in the Google spreadsheet.
Use this data to create five combinations of browsers and devices. The idea is to mix the browsers, operating systems and devices so you can test the fewest combinations.
Here’s a few suggestions to get you started:
- Latest Chrome + a popular OS
- Latest Firefox + a popular OS
- Most popular version of Internet Explorer + a popular OS
- Mobile Safari on an iOS phone or tablet
- Mobile Chrome on an Android phone or tablet
We’ll use this info to help determine which browsers and devices to test at each stage. Once you enter these combinations, the spreadsheet will automatically fill in the testing checklist.
Stage 1: Testing in your own Chrome browser
For every new version or website update.
This simple testing step reveals obvious bugs that show up in even the most stable, up-to-date browsers. Use the Window Resizer extension to test responsiveness at different screen sizes.
Stage 2: Testing a couple problematic browsers
To be done mid-project.
Some browsers tend to have more bugs than others (like Internet Explorer). At this stage of testing, you want to find as many bugs as possible in the shortest amount of time. So, test the oldest, most difficult browsers first, since these are more likely to have issues. BrowserStack is a great tool that allows you to test on different devices and browsers remotely.
I’ve included a suggested list of browsers for this stage in the spreadsheet. But feel free to edit this list based on your own website’s analytics.
Stage 3: Testing more combinations of popular browsers/devices
To be done towards the end of a project.
This is the last stage of testing, and at this point you’ll need to test a wider range of browsers. Use the list of device/browser combinations you came up with at the beginning. Hopefully you’ve already found most of the bugs in Stage 2, so this stage of testing should move more quickly.
If you’d like to download the testing spreadsheet, just fill out the form below. It’s customizable and includes more detailed instructions. Please don’t hesitate to contact us if you’d like to learn more about browser testing or website design.