Cross-Browser Testing: Expert Website Improvement Tools You Can Use
A common, incorrect assumption businesses make when they view their websites on their computers (or phones or tablets) goes something like this:
"The way our website looks as we see it right now is exactly how our website looks to all of our website's visitors."
Very, very wrong.
Your website isn't a book
When a new edition of a book is printed, every copy is identical. Everyone who picks up a copy of that book sees the exact same final product as everyone else who picks up a copy of that book.
Not true with websites.
When people visit your website, there are a tremendous number of variables involved that impact what your website looks like to them.
Some of these variables include:
- Platform (Mac or PC?)
- Browser (Internet Explorer? Chrome? Safari? Firefox?)
- Browser Version
- Screen size
- Whether the latest version of Flash is installed
Because of these variables and the nearly endless number of variable combinations, true professional web developers will always test new websites across various browsers, browser versions, and screen sizes.
Over time, businesses begin to neglect their sites.
In the meantime, time moves forward and new browser versions are released.
Phones with new screen sizes are released.
The web world continuously changes, yet too many businesses don't feel the need to have experts maintain their sites once they're launched. This is a shame and comes with serious implications, but it's a topic for a different blog post altogether.
Seeing what your website visitors see
Because no website looks identical to all visitors, it's important to be confident that the majority of your website's visitors can see and use your website as intended.
Pixel-perfection and insistence that everything lines up exactly the same for every single visitor is a waste of time, effort, and money. Again, no website can appear exactly the same for every single visitor.
Keep the big picture in mind:
Can the majority of your most important website visitors easily accomplish what they want to accomplish on your site, based on how the site looks to them?
If you're not sure how to answer that question, it's either time to:
- talk with your web design company and ask them to review how your site currently looks across browsers, or
- use a service yourself to see what your website looks like for different visitors. (If there are problems, talk to your web design company and find out if it's possible and worth it to fix them.)
A real-life example of what happens when you ignore cross browser testing
A food-industry client we worked with last year initially came to us frustrated they weren't seeing more online sales for their newest product.
Upon reviewing their analytics and testing their website across different browsers, we made two critical discoveries:
- The VAST majority of their website visitors arrived on mobile devices.
- Because of the way in which their website was designed, it was exceptionally difficult for mobile visitors to complete a purchase.
I bet you can guess what our recommendation to the client was. (Answer: Boost your online sales by reworking your site's layout so it's easily viewed and used by mobile visitors!)
An expert, paid option: BrowserStack
A popular, powerful online service that allows web developers to see how their websites appear to different visitors using different browsers and platforms is BrowserStack.
BrowserStack offers live, web-based testing with instant access to all desktop and mobile browsers. The service is extremely fast and uses a cloud-based setup.
The downside: BrowserStack pricing plans start at $19/month—and their smallest plan doesn't allow you to see what your website looks like in mobile browsers. The next plan up runs $39/month.
Though BrowserStack provides exceptional value for web development companies, for businesses not interested in this type of testing on an ongoing basis, a premium service like BrowserStack is likely not the best fit.
A free alternative: Browsershots
An alternative to Browserstack used by individual web developers, small web development companies, students, and DIYers is the one and only BrowserShots.org.
Why is it used by so many people interested in seeing how visitors see their websites?
You guessed it. It's a free service.
You don't need to pay money to use Browsershots, BUT...
- You don't get your results immediately. Your request is placed in a queue and you have to wait until your request is processed. (I just ran a quick test and Browsershots told me my results would be processed and completed in 4 minutes, 32 seconds.)
- You have to deal with advertisements. Lots and lots and lots and lots of ads everywhere. It's distracting.
- You have to be careful about checking boxes, unchecking boxes, and scrolling past what you see when you first arrive. When you arrive on the Browsershots homepage, you see a massive list of browser types and versions. Every box is checked. In NO case do you EVER need to see what your website looks like in EVERY browser on EVERY platform in EVERY browser version at EVERY screen size. When you arrive. remember to scroll down the page to choose your desired screen size, as the option probably isn't available to you on the screen you see when you first arrive. Important! -> Also, keep in mind you'll need to scroll lower on the page to be able to click the link that unchecks all the boxes that are checked when you first arrive—so you can then go back and check the ones you're actually interested in.
Not sure where to start?
Trying to play around with this on your own? Start with your Google Analytics account.
You can look up which platforms, browsers, and screen sizes most of your visitors are using. Take the most popular platforms, browsers, and screen sizes and test them using BrowserStack or Browsershots.org to start seeing what visitors to your website see.
Worth a discussion
At the end of the day, how your website looks to your website visitors is a topic you should bring up with your website development company—especially with the pace at which the web world is evolving.
The last thing you want to learn is that your site's design is preventing some visitors from being able to use your site, or that a large percentage of your most important visitors can't do what you're hoping they'll do. See the real-life example of our food-industry client above if you skipped that section on the way down here...
Ideally, you have an ongoing relationship with your web agency that's focused on strategic, continual improvement. And ideally, that relationship is setup to encourage check-ins and discussions about the state and effectiveness of your site. Hopefully, you have this type of relationship with your web agency. If not, that might be the first thing to discuss with them.