Lost On Safari

Posted: 03/09/10

Apple is a Bitter Fruit

I acquired a new client the other week, who wanted me to turn their PDF web site design into html code. There's nothing remarkable in that, it happens quite a lot. It's actually quite a nice task, as you can put your "arty" head away and bring your "techy" one out. You can usually guarantee that the client will like their own design.

This particular client is an Apple Mac user. There's nothing wrong with that and in fact anyone using an alternative platform to the ubiquitous Windows is to be applauded. Microsoft do not own the Internet, as much as they'd like to. It was thus more important than usual to make sure the site worked on a Mac.

Personally I think Macs are overly expensive, and the arbitrary and opaque way Apple does business keeps me well clear of them, thus I do not have a Mac to test out web pages on. Fortunately, Apple produce a version of their Safari browser for Windows, and I usually try out pages on it before delivering them to the client. Safari is not without its issues, though, as I found out.

This particular site design has a large background image that sits underneath the entire content area. The content area was divided into a header, and two columns, one for the navigation menu and the other for the "meat" of the pages. For some obscure reason, Safari didn't always render the background image under the navigation menu, preferring to show the background only where there was actually some content. It gets even more weird, because when I scrolled the window, resized the window or switched focus to another window and back to Safari, it filled in the missing background!

All the other browsers had absolutely no problem with the html and the css, which I double checked was valid. Various amounts of surfing about revealed that this isn't an unknown problem, however none of the fixes suggested (most of which involved removing jQuery, or putting the script tags at the end of the page solved the problem. It continued to show up every now and again - making it virtually impossible to resolve. Some sites even suggested this is a bug in the browser itself, which actually makes sense when you consider the nature of the problem.

With a deadline looming, I let the client have a preview having warned them that there may be an issue. It turns out that the Mac version of Safari actually seems to work properly and the client was most happy with the results.

The "fix" therefore turns out to be a pragmatic one. Safari users account for only 6% of hits. Of those, it's a fair assumption that the vast majority are Mac users. Therefore I have 0.5% or less of the audience who will be affected, and their fix is to wiggle the mouse. 0.5% is much less than those poor souls who are still using IE6, which the usual daft IE specific bodges sort out.<