Apple releasing Windows version of Safari

[KLB]

For those of us who run windows, but would like to test our sites on Safari, Apple is now making a Windows version of Safari available at: http://www.apple.com/safari/

It is only in beta but its a start.

[Cutter]

I've found it very interesting how Apple has finally cozied up to Windows. I think they saw the light with iTunes. Hell, I use iTunes all the time now, download TV episodes and just plug the PC into the HDTV.

[Johnny Gulag]

This is an awesome turn of events, no more screenshots!

[Selkirk]

Yeah, its really a win for everyone. I'm working on a site today where the designer had no conception of what the site looked like in Safari. It was completely unusable. Now there is no excuse for that.

[KLB]

I had a chance to look at my site with Safari on OS/X a month or so back and the Windows Safari and the Mac Safari render virtually identically. The only real annoying thing for me is that Safari renders fonts with a much heavier line. Thus normal fonts look almost bold and bold looks really bold compared to other Windows browsers. I'm playing around with this, but finding no solution.

[Selkirk]

Fonts are one of the biggest differences I notice when I do happen to use a Windows computer. Maybe its just what I'm used to, but I've always found the fonts on the windows side to be ugly.

I did some cross-browser, cross-platform tests with typography a while ago. Safari pretty much rendered every combination of attributes at least decently. IE, on the other hand was nearly unreadable in some combinations as was FireFox/Win. I wonder if the Windows version of Safari will have different font rendering because of the underlying platform?

Another Mac/Windows difference that gets me is font size. Browsing on Safari, some pages designed for Windows have fonts that are just way too small when viewed on a mac. Hopefully that will change with OS X 10.5 and device independent resolution. Having to magnify font sizes is probably my biggest complaint with my MacBook. I can't just increase the default settings because I have different DPI on my laptop and my external monitor.

Another big difference is in rendering of forms. Safari does not let you change the display of form elements in the same way as IE and FireFox. For example, a checkbox in safari will always look like a Macintosh checkbox.

[KLB]

It isn't important whether or not the fonts on Windows or Macs are ugly because there are lots of different fonts pre-installed on both. It is about the proper choice of fonts for webpages. For instance, Times New Roman is not a good font for webpages as it is harder to read on-screen. The best choice for on screen display is Verdana because it is clean without serifs yet makes the 'I', 'l' and '1' look different (something Arial does not do).

What is important is that fonts render the same way on different browsers. Safari making text thicker than what all other browsers do means that a page doesn't look as the web developer intended on Safari if they developed their site using Firefox, Opera or MSIE, which render fonts the same way. Likewise a Mac developer using Safari may expect fonts to look the way Safari renders them for all users not realizing that all other browsers render fonts differently from Safari.

[Selkirk]

It seems alot of blogs and forums are talking about this today. I found some interesting information on the font issue in the comments of this post. It seems that Microsoft is using manual hinting on certain fonts. So some fonts at some sizes will look better on Windows because the pixels have been manually produced, where on the mac they are generated. On the other hand, Windows doesn't preserve the spacing between characters and words and the fine details of fonts. That's why Safari did much better in my test of typographical combinations. I also think some people try to look at the form of individual characters, while missing the readability of the text as a whole.

As far as trying to get things to look "the same," I find that way leads to madness. I think its better to have things that look good under a variety of conditions, rather than to try and make them look the same. Go with the flow.

[KLB]

As far as trying to get things to look "the same," I find that way leads to madness. I think its better to have things that look good under a variety of conditions, rather than to try and make them look the same. Go with the flow.

Except for the fact that Safari's over bolding of text makes my page look cartoonish, which isn't good for a science site. This isn't a subtle difference. There is a very significant difference in the way Safari renders fonts and the way all other browsers render fonts. A little difference would be one thing, but this difference isn't little with Safari. Of any group that appreciates this concern, the graphics design community, which heavily use Macs should be able to really appreciate this concern.

[Selkirk]

I don't think your site looks cartoonish at all under safari, although the fonts are too small and the fixed width is too narrow, making the text very crowded when enlarged.

BTW, its not just Safari, I believe FireFox/Mac renders fonts the "Mac way." Not sure about Opera/Mac.

[cameron]

The only real annoying thing for me is that Safari renders fonts with a much heavier line. Thus normal fonts look almost bold and bold looks really bold compared to other Windows browsers. I'm playing around with this, but finding no solution.

I found that IE7 is similar, as if they were ripping off Mac browsers.

[KLB]

I don't think your site looks cartoonish at all under safari, although the fonts are too small and the fixed width is too narrow, making the text very crowded when enlarged.

This is due to the very large size of your desktop compared to the size of your monitor. My site is designed to accommodate users who are still using 800x600 resolution, who make up over 11% of my user base. I can not go to a dynamic width layout as it causes other really bad side effects with my layout (especially across different browsers). Also, the font size I use isn't small compared to what is typical for sites.

Your problem with how "small" my page layout and text are the exact reason why browsers need to "properly" zoom pages the way Opera does. Someone who runs their desktop at 1280x1024 on a 14" monitor can't expect pages to be readable with large enough text when the site also has to support 800x600 resolutions. The web browser on the other hand can quite easily allow users to adjust webpage "size" if they would just zoom everything proportionately.

BTW, its not just Safari, I believe FireFox/Mac renders fonts the "Mac way." Not sure about Opera/Mac.

And this is a point where Apple needs to compromise and follow the lead of what is customary. Being different simply to be different is counterproductive. As a developer I need to be able to know that when I carefully code to W3C standards and choose generic fonts my pages will render the same across browsers.

[KLB]

I found that IE7 is similar, as if they were ripping off Mac browsers.

I run IE7 on WinXP and I don't see what you are talking about. Safari makes my text way heavier than IE7.

[Selkirk]

Ken, As I said before, one of my biggest problems with OS X is the problem of font sizing and resolution for the laptop display. I definitely think the solution to this lies on the OS X side. My problem is that if I jazz up the default font size in safari so its fine on my laptop display while I'm browsing from the coffee shop, it looks HUGE when I get home and hook up to my external monitor. To me, this is my single biggest usability complaint with OS X, something I hope 10.5 will address in October.

I'm not saying your layout is wrong, just that the choices you have made make the site hard for ME to read on MY system.

Regarding coding to W3C standards and choosing generic fonts, are you sure that you really are designing for w3c standards and not "ie standard?"

see css units and High DPI web sites.

[KLB]

Selkirk, My environmental chemistry site (which is what I really care about) validates to W3C's HTML4.01 Strict and CSS2 specifications. I'm pretty obsessive about making my code validate. I also test my site across a wide range of browsers and currently test against:

• MSIE 5.5 (spot check only now a days), 6.0 & 7.0;
• Firefox 1.5 & 2.0 (primary development browser);
• Opera 8.5 & 9.02 (been testing against Opera since v6.0);
• Safari 3.0b (as of yesterday);
• Lynx (spot check only).

I also spot check pages with CSS and JavaScript turned off to make sure my pages are accessible and logical for users of non-graphical browsers (e.g. dynamic braille displays).

I have been preaching conformance to W3C specifications since the days when HTML3.0 was state of the art. I am absolutely certain that the issue I am having is a Safari specific issue as I have confirmed this by reading reports of it on many different sites. The issue revolves around how Safari handles font smoothing.