How to Use Multiple Browsers on a Single Machine To Check Your Site for Cross-Browser Compatibility

How to Check Your Website with Multiple Browsers on a Single Machine (Cross-Browser Compatibility Checking)

by Christopher Heng, thesitewizard.com

We all know the importance of checking our web pages with multiple browsers, especially when we are designing a new layout for a website. This is the case even if we are writing validated standards-compliant code. This article suggests some ways for you to run multiple browsers (and if you wish, even multiple versions of each) on one computer.

Mozilla Firefox

The Mozilla Firefox browser has an auto-update facility that automatically keeps it up-to-date, so in most cases, it is enough for you to test your site with the latest version, to know how it will appear for most Firefox users.

However, if you want to be thorough, there is also an ESR (short for Extended Support Release) version of the browser, with a slightly earlier rendition of its engine, which Mozilla maintains for the sake of big companies that don't want to keep chasing new versions of browsers that update every few months.

I tend to ignore the ESR version in the testing of my sites, but if you feel you need to check yours with multiple versions of Firefox, you can easily do so, since they can co-exist with each other (with a little help from you).

To do this, install them into separate directories and create a different profile for each browser you install. (The browser allows you to create different profiles so that you can store different settings for different situations.) To create a profile, start the browser with the following command line:

"c:\Program Files\Mozilla Firefox\firefox" -ProfileManager

(The above assumes that this particular version of the browser was installed in "c:\Program Files\Mozilla Firefox\". Adjust it accordingly for each different version.)

Once you've finished creating profiles, you will want to create shortcuts to run the different versions of the browser. It will make life easier for you since you can then just click the appropriate icon, and it will load using the correct profile. To specify which profile the browser is to use, put the profile name after a "-P" option.

For example, if you have created a profile named "currentfirefox", your command line will look something like this:

"C:\Program Files\Mozilla Firefox\firefox.exe" -P currentfirefox

Similarly, your command to run a different version of Firefox with a profile called "oldversion" may look like this:

"c:\Program Files\Old Firefox Version\firefox" -P oldversion

And so on.

Anyway, as I said earlier, you may not need to keep different versions around to test. I suppose it's useful if your site uses bleeding-edge features that are only implemented in the latest browsers. For most people, simply installing and testing with the latest version will probably be adequate.

Chrome and Microsoft Edge

Google's Chrome browser, and the latest version of Microsoft Edge both use the same engine (called "Blink").

In general, you can expect that the vast majority of people who use Chrome to be using the latest released version, since that browser automatically updates itself whether you want it to or not.

Although the version of Microsoft Edge that uses the Blink engine has been released, and can be manually downloaded from Microsoft's site, it will only be automatically rolled out to all Windows 10 machines in the May 2020 Windows 10 feature update (or so I assume). Don't be deceived by the "May 2020" designation. That is just the release name. Feature updates are staggered, presumably to avoid problems, so not everybody will receive it in May 2020. That said, once this latest version of Edge is installed, it will automatically be kept up-to-date by Windows.

Since these browsers are automatically updated to the latest versions, I merely test my sites with whatever is currently available. In addition, they use the same engine, so you don't really need both. If a site works with one, it will probably work with the other.

Internet Explorer and Legacy Microsoft Edge

Internet Explorer ("IE" for short) used to be the majority browser in its heyday, though it has long been dethroned. And since Microsoft has already replaced it with its newer Microsoft Edge browser, it is also no longer updated.

If you feel that you need to test your site with that browser, the main version to try is IE 11, since earlier ones have been discontinued. If you don't have a version of Windows that has IE 11, or if you don't use Windows at all, the easiest way is to install a virtual machine. It is not only that it is officially Microsoft-sanctioned method, but they even provide the necessary virtual machines for you to use. You can also use this method to test your site with what Microsoft calls "Legacy Microsoft Edge", that is, Edge running the older EdgeHTML engine.

Loosely speaking, virtual machine software allow you to run another copy of Windows within your existing system, be it Windows, macOS, Linux, FreeBSD or whatever. The virtual machine software pretends to be a new computer, running in a window within your existing system.

Microsoft provides pre-activated copies of Windows with IE 11 and Edge in virtual machines free of charge to web developers who need to test their sites with these browsers. The pre-activated Windows expires periodically, so you will need to download a fresh copy from time to time.

You will also need to install one of the supported virtual machine software. For Windows users, this is either one of the free software found on the Free PC Virtual Machines page (eg VirtualBox or VMWare Player), or VMware Workstation (commercial software). Mac users can use either VirtualBox (which is free), Parallels Desktop (a commercial program) or VMWare Fusion (also a commercial program). Linux users can use VirtualBox.

Once you've installed the software and downloaded the virtual machine from Microsoft, all you have to do is to run it. This will give you a copy of the appropriate version of Windows with a matching version of IE or Edge, which you can use to surf to your website to test it.

Safari

The macOS Safari web browser shares a lot of code in common with both Chome and Edge (the Blink version), since their engines were all originally derived from a browser called Konqueror. This similarity will diverge over time, since the engine for Safari (called "WebKit") is being developed separately from the other two.

There are no current versions of Safari for Windows, so I don't test my sites with it. Frankly, I doubt many Windows/Linux webmasters do either.

(Before you ask, although there are things such as free Mac emulators, which are software that run in Windows but pretend to be a Mac and thus can run Mac software, they are not particularly useful from a webmasters' point of view. The working Mac emulators pretend to be the old obsolete Macs, not the modern ones.)

Mobile Phone Browsers

If your site uses a straightforward responsive web design, that resizes itself according to the browser window width, in most cases, you can get away with resizing your desktop browser window to see what a mobile phone user will get when he/she visits your site. Firefox even has a "Responsive Design Mode" with preset window widths that makes it easy to do this.

For more complicated sites (eg, if yours provides an online game which your visitors can play), you will probably want to test it on a real phone. There are also such things as Android emulators, that you run on your computer to mimic an Android phone.

Conclusion

It's a good idea to test your site with multiple browsers, particularly if you plan to do anything fancy with style sheets on your site. This way, you can at least have confidence that things will appear as they should.

Copyright 2003-2020 by Christopher Heng. All rights reserved.

Get more free tips and articles like this, on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.

thesitewizard™ News Feed (RSS Site Feed)

Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.

Please Do Not Reprint This Article

This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.

Related Pages

New Articles

Popular Articles

How to Link to This Page

To link to this page from your website, simply cut and paste the following code to your web page. <a href="https://www.thesitewizard.com/webdesign/multiplebrowsers.shtml" target="_top">How to Check Your Website with Multiple Browsers on a Single Machine (Cross-Browser Compatibility Checking)</a>

It will appear on your page as:

How to Check Your Website with Multiple Browsers on a Single Machine (Cross-Browser Compatibility Checking)

Copyright © 2003-2020 by Christopher Heng. All rights reserved.

thesitewizard™, thefreecountry™ and HowToHaven™ are trademarks of Christopher Heng.

This page was last updated on 18 May 2020.