For anyone who has been coding in HTML for any length of time, one of the biggest challenges has always been with trying to get a website to look the same in different browsers.
There was a time when you could program your site to work with Internet Explorer, and not have to worry too much about the other browsers; though, if you wanted to be considered as a professional company, you would have to try to make it look good in Netscape, too. Those were the only two relevant browsers.
Since the mid 2000’s, however, several other browsers began to take root and have been growing ever since. While IE is still the most used browser, Firefox is now running a close second, and Mozilla browsers, Opera, and Safari are trailing quite a ways behind, but have a loyal following nonetheless.
According to the Web Browser Statistics page at SynAxiom, the breakdown is as follows:
| Internet Explorer | 58.7% |
| Firefox | 31.2% |
| Mozilla | 1.4% |
| Safari | 1.7% |
| Opera | 1.5% |
Actually, for anyone who has had a lot of experience with coding websites–and I don’t mean using Dreamweaver in design mode, but actually typing in code and understanding it–it’s actually not that difficult to get a website to look almost identical in different browsers, as long as it’s just your average site. Unfortunately, there are some designers out there who really like to push the limits with their designs, and there are times when coders like us have to try to pull off a miracle to satisfy a designer’s dream. In situations like these, when you have to do complicated code tricks, the differences in displays across browsers can be quite dramatic.
To make matters worse, when something does go wrong, often it’s on a browser you don’t have and aren’t able to test the site on. If you’ve installed Internet Explorer 8, for example, and someone is having problems on Internet Explorer 7 or even 6 (believe it or not, some people are still using that mess of a browser), you can no longer test on those browsers. Another case would be when someone has problems on a Mac, even when the same browser you have on your PC doesn’t seem to have any problems. How many developers can have all these computers and browsers available at the same time for testing?
This is where the website, Browser Shots, comes in handy. Browser Shots allows you to enter in any URL that you want to view on different browsers, and select all the browsers that you would like to view your website on. The choices include pretty well everything that is out there now. You can also choose which screen size you want to view the site on, the color depth, and you can even disable things like Javascript, Java, and Flash. What an amazing tool; and the best thing of all is it’s entirely free to use.
Anyway, so you’ve entered in your domain name, made your selections, and clicked on the submit button. What happens next? Well, all you have to do is wait. Unfortunately, that can sometimes be a big problem for this site, and it’s where it can get buggy, too. The waiting can be quite long, and your session will eventually time out after 30 minutes, though you can click on the extend button to extend it for another 30 minutes at any time. Sometimes, a few of your browser selections won’t work at all, and you’ll have to try again. So it’s not perfect, but it’s hard to complain about such a useful applications that doesn’t cost you a dime to use.
Browser Shots for my site, Dominet.ca
So there you have it. For all you developers out there, you now have a nice tool to help you with your programming tweaks in trying to get the website your working on to look as consistent as possible across a wide array of browsers. It has helped me to solve my issues many times, and I’m sure it will be useful for you to.