Browser Compatability Part 2

Today I spent most of my day trying to figure out the intricacies in browser compatabilty (especially when it comes to adding Flash into the mix). For the longest time I have known that to add Flash to a page and try to have DHTML menus hover out on top of the Flash movie that you needed to set the Flash movie wmode to either opaque or transparent. This allows the menus to appear on top of the Flash movie in the DOM.



The issues I was running into today was a user that could not get the menus to work while using Firefox 2.0.0.16 while in Ubuntu Linux. This is definitely a small section of our users but I figured I would at least look into the issue and see what was happening. The first thing I noticed was that the menus were flying out below the Flash movie. I thought this weird since I had coded the HTML to allow for them to fly out above. I did some searching and found that Linux does not support the transparent or opaque modes for Flash movies. There is suppose to be support coming with Firefox 3 and Flash 10 that will finally allow for the same compatability for Linux users.



Second issue was users on Firefox on the Mac could not see the Flash movie load at all. The interesting thing with this one was that I needed to set the wmode to window in order for the movie to show up at all. Of course this caused some funky behavior with the menus and I did not want it to do that for Firefox on Windows so I hade to use a Javascript hack to determine the OS version through the navigator.appVersion property and parsing out Mac and setting the object and embed code for that to use the window wmode and for windows users to use the regular transparent wmode.



What gets me about this is how incompatible things really are between OS's and Browsers. The same browser version will act totally different on a different OS and different browsers on the same OS will render things completely different. For having standards for many years now, you would think that things would be a little more, well standard. Some of this promises to be improved through IE8 and Firefox 3 as well as Safari 3. Firefox 3 will bring Linux into line with the standards and seems to improve having to code around Firefox on the Mac.



As a side note, I also noticed that there can be issues with Firefox on an Intel Mac. Just something else to be aware of when trying to design your site to reach the maximum amount of people.



The easiest way for now to prevent most of these incompatabilities is to not mix DHTML meuns and Flash or Text fields with flash or DHTML menus. Those are the two areas that cause the most problems.

Google Chrome

Chrome was released last week and I downloaded it right away to check and see how sites would render in it compared to other browsers. From a SharePoint point of view, the site I work on rendered fine and functioned as expected. Chrome does render some CSS styles differently which will cause headaches for web designers.

Other features of Chrome that are interesting include separate sand boxes for each tab so if one tab crashes it will not affect the other tabs.

When using the browser it tracks where you go and adds it to your browser history and search history. If you want to browse somewhere without it showing up in your history or without leaving traces (such as cookies) on your computer there is the option to use an Incognito Window.

Google Gears is built into the browser to allow you to work offline with many of the Google services including Reader and Gmail.

There is the option to create Application Shortcuts when you browse to a site. If you go to Gmail or Google Reader and then click on the icon that looks like a page and select Create Application Shortcuts, it will create a shortcut on your desktop to connect to that application.

There is only one box to enter in either your searches or URLs. You simply enter the search keywords into the box and hit enter to get search results.

There is a developer menu that includes a Javascript Console, the ability to debug Javascript, and a task manager to see how many CPU cycles each tab is using and the ability to kill a tab's process.

Chrome is also faster on loading many sites that I have tried it with and is based on WebKit. If you want to try it for yourself you can get it from the Google site.