Check Your Web Site Under Different Browsers


You have a great Web site for your fitness business. You spent a lot of money and probably even more time having it professionally designed, coded and hosted. You meticulously wrote every word on it to beautifully convey your brand, explain your services and hopefully increase enquiry rates. It's a masterpiece of HTML and it is an excellent addition to your business's intellectual property.

Until one of your members who happens to use Google Chrome as their Web browser looks at it....

As far as a lot of people- especially Windows users- are concerned, Microsoft Internet Explorer is the only Web browser there is. It comes pre-installed with all modern versions of Windows, and most people either don't care or don't know that there are other browsers with which they can view the Internet. But that is rapidly changing, and you must ensure your Web site- which is one of the most important portals to your brand- works properly on all of the common browsers, not just Internet Explorer.

According to StatCounter, as of the end of 2011 only around 39% of Internet users are using Internet Explorer. This is remarkable when you consider that only a few years ago it was around the 70% or more mark. This means that there's a huge portion of your members and potential members out there who are using something else. Here's what StatCounter say:

As of December 2011:

  • Internet Explorer: 38.65%
  • Google Chrome: 27.27%
  • Mozilla Firefox: 25.27%
  • Apple Safari: 6.08%
  • Opera: 1.98%
  • Other: 0.75%


So as you can imagine, it is no longer sufficient to fire up the venerable Internet Explorer on your computer, navigate to your business's home page, poke around a few screens and conclude everything is cool.
It might look great under Internet Explorer, but it may look awful under another browser.

Why is this?

Web pages are written in what's called a markup language, most often HTML. HTML is a set tags (or commands) that describe how the content on a Web page looks. For example, if you have a heading it may look something like this:

<h1>Welcome to Simply Fitness Health Club!</h1>

The <h1> is an HTML tag. Web browsers like Internet Explorer are nothing more than smart picture frames designed to interpret HTML and display it on screen.
The problem is, different browsers have slightly different interpretations of how things should look. Despite the existence of agreed-upon standards that dictate how text, pictures, layouts, etc should appear onscreen, subtle bugs and minor differences creep in and before you know it, your Web site looks different on different browsers. By way of example, have a look at the following image of Google Maps under Microsoft Internet Explorer:


Not pretty huh.
(I should point put that Microsoft has long since fixed this particular example).
This [obsolete] screenshot illustrates how differences in browser rendering can turn even the most awesome of Web sites into a jumbled mess of incoherence.

Trust me, you do NOT want this happening to your site.

To make matters worse....

OK, that's desktop browsers. What about mobile? I'm not going to rave on about how mobile is becoming so huge and important that it is widely accepted that their usage is now exceeding 'desktop computer' usage right now. Trust me, you'll be hearing a LOT about the mobile space and its importance to the fitness industry from me over time. But suffice it to say, you must, must also factor in mobile devices.
The Web browsers on mobile devices like smartphones and tablets aren't immune to this problem. Your site may look fantastic when viewed on an iPhone but terrible on an iPad or an Android-based phone.

Again, here's what StatCounter have to say about mobile-based browser usage for December 2011:

  • Safari (as used on the iPhone and iPad): 22.6%
  • Opera: 24.2%
  • Android Browser: 20.2%
  • Nokia Browser: 12.9%
  • Blackberry: 7.5%
  • Other: 12.6%

What this is showing is that your Web site can (and will) be viewed on just about anything. (At time of writing, I personally am a huge fan of Google Chrome as my browser of choice. I find it to be an outstanding product that is getting better all the time).

So what should you do?

Now that you know your site needs to be fully tested using a variety of Web browsers, what are your next steps? If your site has been professionally designed and coded by a third-party Web design company (and I would hazard a guess and say that's most of you), the obvious thing to do is to contact them and directly ask them if they've ensured rendering compatibility for all the major Web browsers. I actually recommend getting this in writing from them if possible. If there are compatibility issues found, ensure they fix them ASAP. If you're about to embark on a new Web site project, then ensure browser compatibility is included from the start in the agreement and warranty.

You can take their word for it of course, but if you want to check things out for yourself, there are two main ways of doing this. Firstly, you can download and install the major browsers yourself (if you don't already have them) and fire up your site and check. This is generally an OK method, but suffers from the hassle of having to download the browsers. Also, it's not going to help you with mobile browsers. You may own an iPhone or an Android-based phone, which is fine, but I doubt you own both. So you're going to have to find someone who owns one you don't.
Another hassle.

The alternative is to use a third-party service that does the checking for you.
There are many Web sites as well as installable applications out there that allow you to do these checks. I'm not going to go into the installable applications because unless you're going to be doing this on an ongoing basis or have a deep interest in this stuff, it's probably not worth it to install yet another software application on your computer.

Browser Shots is a fairly popular site that allows you to check how your site looks under a variety of browsers and operating systems. There's free and paid options where the paid option gives you 'queue priority', but the free version is just fine. It takes several minutes for the results to come back, but they give you screenshots of how your site looks under different browsers so you can identify any anomalies or display problems.

For checking mobile browsers, have a look at MobiReady, which tests your site against most major mobile devices.


Side note: there are countless different Web browsers out there, and I'm not advocating you certify your site against all of them. Not only is it impractical as new browsers are being released all the time, but it's also pointless- how many people do you know have even heard of the K-Mellon browser?). Instead, I recommend focusing on the following browsers.

For the desktop: For mobile:
  • iPhone/iPad
  • Android Browser
There are many more, some of which are even fairly commonly used (such as Opera), but we have to draw the line somewhere.

Conclusion

It is important that you protect all the hard work, effort and money you have invested in building your Web presence. Your Web site is a crucially important part of your brand and service. Your membership base and the pool of prospects in the market are an extremely diverse bunch and they'll be using any number of different computer types, browsers and mobile devices. And they have an expectation that your site works properly and reflects your brand regardless of how they choose to view it.

For the majority of you, this probably means not much more than perhaps shooting off a quick email to the company that looks after your Web site for you for confirmation that all is OK. But I still recommend doing some investigation yourself, just to be sure. Perhaps even take the opportunity to pull random members aside as they enter the club and ask what browser they use at home or work, and if they've noticed any issues or problems with your site.

Have fun!
Mike.Ryan


UPDATE

Reader Di made an excellent point in the comments about Adobe Flash. I was going to go into my thoughts on Flash in a later post, but Di's comment about avoiding Flash on your Web site is a valid one and one that I strongly share. My recommendation is to avoid using Adobe Flash on your site in any way. Not only will it not work at all on any Apple mobile device (iPhone and iPad), but at this stage it's looking like it also won't work on the Metro version of Internet Explorer in Windows 8 (Microsoft have announced that no plugins will be allowed under the Metro version of Internet Explorer).

But putting aside the fact that you will be locking out a good portion of your potential audience by using Flash on your Web site, there's also the 'annoyance' factor of Flash. Flash is an incredibly powerful and compelling design tool for the Web. The problem is that many designers embrace this power a little too much and create Web sites that are bloated, slow at loading, annoying and frankly can suffer from very poor user interaction models. Sure they look pretty, but at the expense of usability.

So save yourself the hassle and just don't use Flash on your Web site.


You can follow any responses to this entry through the RSS feed. You can leave a response, or trackback from your own site.

2 Comments

  1. Di says:

    You didn’t mention Flash. With so much web browsing done on portable or hand-held devices these days, web designers should avoid Flash or risk losing a lot of potential traffic.

    Reply

Leave a Reply