I spent the last few weeks pulling my hair out. I was working on re-designing some of my ecommerce website (more on that later) and that means dealing with browser compatibility issues. If you’re designing a website with anything remotely fancy like CSS, Javascript, etc. you’re going to run into browser compatibility headaches. Here are a few tricks I used to make sure my site looked okay for all the different browsers.

1. Download ‘Em
If you’re working on a website re-design, download as many browsers as you can. Get IE, Firefox, Safari, Google Chrome and Opera. You’ll want to view your site in all of them, so get ahold of as many as you can.

2. Get IE Tester
Internet Explorer has put out some finicky versions over the years. IE 6 and IE 7 render things quite differently (aka stupidly) than later releases. You can’t easily run various versions of IE on your computer, but you can get IE Tester. This free program will show you how your site would look in various versions of IE.

3.Visit BrowserShots
Browsershots.org is a free tool that allows you to see how your site will look on different browsers and operating systems. It takes a little time for your site to show up, but if you’re short on cash, it’s a handy resource. If you can spend a bit of money, browsercam.com is another way to view your site on different browsers/operating systems. A 3 month license if $40.00

4. Use Your Phone
If you don’t have a Mac at home, your iPhone is a great way to see how your site looks on a Mac. Mine was quite handy for debugging a pixel spacing issue I was struggling with.

Have you looked at your site on different browsers and operating systems? Even if you’re not in re-design mode, it’s still a good idea to make sure your site looks okay in different environments so that all customers have the same user experience.