As any web designer knows well there are so many browsers around and each has his own rendering issuse and non-standard behaviours.
Cross-browser compatibility is a must for every good design/site nowadays and one of the main problems is just checking how your web pages will be rendered on the most common browsers without having to install them all, also because some of them cannot be installed for real in the same environment or on your OS.
There are actually many ways to face this problem and many possible solutions, depending on your workflow and on the OS you are doing design/developing on.
Most graphic designers work on Mac and this is just one case in which using OSX do not helps at all since IE browsers, which are still the most used by common Internet users, cannot be installed natively under OSX.
For both PC and Mac users a good solution can be use a free web based service like BrowserShot that given a URL gives the possibility to have a look at how the page will be rendered by a number of browsers, but this is not a good way if you are still in early development phase and you have your site files only on local machine.
Windows users are lucky since a few months ago a company called Xenocode specialized in application virtualization technology released a pack with all the most famous browsers running in portable version so that no installation is needed at all, you just can go to the Xenocode Browser Sandbox and check your remote or local URL with IE6, IE7, IE8, Firefox 2, Firefox 3, Chrome, Opera and Safari.
Mac web designers can choose three main ways to solve the problem:
- boot camp
- virtualization
- hardware solution
Boot Camp is a good solution if you also plan to do more than just browser checking under Windows even if you have in this case to buy a copy of Windows and restart everytime you want to switch to it.
A more pratical solution is using products like VMware Fusion or the free and fabulous Virtual Box by SUN that we are going to review soon in one of our next articles. Using a Virtual machine you can install Windows and have it running under OSX without any need for restarting.
The last possible solution is to buy an old or low budget notebook or PC and use it.
Said that, virtualization seems to be the best way to go under Mac and has also less impact on workflow and time.
What’s your cross-browser workflow? Have a best solution? Share your experince with us.
Tags: coding, css, freelance, HowTo, html
The Author : WPstudios
WPstudios is a graphic and coding agency specialized in web design, print design, logo and branding, wordpress customization, PHP and Javascript coding, 3D graphic.
May 12th, 2009 on 17:05
Hi
A link of your useful article has been submitted to http://www.webmasterclip.com/
May 17th, 2009 on 15:23
I found your blog on google and read a few of your other posts. I just added you to my Google News Reader. Keep up the good work. Look forward to reading more from you in the future.
June 4th, 2009 on 09:49
We’re also working on a related product to Browsershots, but ours goes one step further. Instead of just giving screenshots to the user, we actually use algorithms to validate that the layouts are the same across browsers. And, we’ve got an integrated crawler so you can test many pages at once. With our system, you only need to review pages that actually have meaningful differences instead of going one by one. We’re currently in beta, you can check it out at http://www.xbdiff.com
June 23rd, 2009 on 07:39
I keep BrowserShots in my toolbar bookmarks for fast access
July 10th, 2009 on 19:53
Thanks for that post, excellent info. Working on a Mac we decided the best way for us is to bite the bullet, buy a copy of Windows and go the VM route. Using Bootcamp and having to restart every time we want to test a design in IE6/7/8, Chrome, and FF/WIN would be too much of an interruption. Our VM is Parallels Desktop, so far we’ve been happy with that.
-B
August 3rd, 2009 on 17:54
Cloud Testing offer a functional website testing tool that allows you to test your websites from the cloud. Enterprise users can download an agent which allows access to your local resources, i.e. inside your firewall/network.
It is based on Selenium, and allows you to capture scripts in the Selenium IDE plugin for Firefox, and then upload onto our servers for running.
We currently support the following browsers:
Firefox 2, 3 & 3.5
Internet Explorer 6,7 & 8
Safari 3.2 & 4.0
Chrome 2 and 3
Opera 9.6 and 10.0
With all of the above we capture full screenshots (i.e. of the browser window, not just the OS window), store the HTML and details of components on each page, along with timings and HTTP request and response headers.
A free 7 day trial is available.
October 1st, 2009 on 14:34
I am a cofounder @ crossbrowsertesting.com. Crossbrowsertesting.com lets you test your websites against lots of browser/OS combinations. And it is not just screenshots, it is live VNC access so you can test ajax also. We have screenshots that are linked to live testing, so if you have a screenshot that does not look right you can click a link and be live testing that browser and OS right there.
Check us out!
tony
June 24th, 2010 on 15:29
You should TOTALLY check out Adobe BroswerLab
https://browserlab.adobe.com/en-us/index.html
It’s like BrowserShot but 300% more awesome. I only found it last week but it saved a tonne of time. They’ve got virtual machines ready to render any page you like. Not quite real time but pretty darned good.
July 9th, 2010 on 02:36
It’s like BrowserShot but 300% more awesome. I only found it last week but it saved a tonne of time. They’ve got virtual machines ready to render any page you like. Not quite real time but pretty darned good.
July 17th, 2010 on 23:19
I never knew all these existed. I use IE tester for the moment by I am changing to Mac because we had it with Windows and I really need a program that will work on mac.