Web Designers: Not Everyone Uses A Mac
By Monji in General96 CommentsThere’s a new trend in web design that I’m already getting sick of. Designers, listen up! I know you love your Apple products and it’s great that you’ve found so much inspiration from their designs but please, for the sake of people who aren’t using OS X or Safari, make sure your web designs look good on other operating systems too.
Stats Speak For Themselves
Unless you’re selling something Apple-related (iPhone & Mac apps, etc.), chances are you’re going to have a decent amount of traffic from people who aren’t running OS X. Shouldn’t you make your design look nice for those users too? Check your Google Analytics visitor info and you’ll see that a lot of people still use Windows (gasp!).
UPDATE: Just to be clear, the stats above are indeed for DevGrow, a site marketed towards web developers and designers. I checked a few of my other websites, including the last 400,000 visitors for a site that’s not as targeted, and Windows XP was unequivocally the dominant platform (for that site, 90% use Windows, of which 60% use XP).
What to Avoid
Most of my complaints stem from websites that use certain fonts that are illegible at certain sizes and with certain effects applied to them. Now, I’m not asking you to abandon your typographical instincts, just test out your design on Windows or Linux to make sure it looks decent. I don’t think I’m knowledgeable enough to suggest the perfect OS-friendly fonts stack, however there are many articles out there that discuss it.
A handful of websites are able to somewhat pull off using exotic fonts, like Elliot Jay Stocks:
Apple has positively inspired a lot of great designers and I admire the bulk of it, especially if they look good on any computer (Tapbots I’m looking at you!).
Parting Thoughts
I’m just ranting off from my personal experiences – can anyone else relate to this sentiment at all? I’m still relatively new to web design so maybe I’m missing something here, or maybe I should just turn on smooth fonts in my Windows Display options, but do I really have to? For some reason, I kind of like my Windows fonts they way they look – does that make me a bad person?
And if you’re curious, I use either Windows XP or Ubuntu for work. For everything else and when I’m traveling, I use my 15″ Macbook Pro.
Smashing Magazine
Six Revisions
Noupe
SpeckyBoy
Dawghouse Design
Hongkiat.com
Great article.. I’ve seen alot of sites with those messy fonts while using Windows
This comment was originally posted on Digg
No, they don’t.
This comment was originally posted on Reddit
Thanks Samer, I appreciate it!
This comment was originally posted on Digg
Ya this is annoying but most of is is browser based , especially when people are using css font-face. I’ve occasionally hit a high traffic site or designers site that looks like total garbage because they have not tested the font across browsers and platforms.
This comment was originally posted on Reddit
I agree, a lot of it is browser-based. Platform can make a difference too, however, which I highlight in an image (of slicehost.com).
This comment was originally posted on Reddit
Why not?!
This comment was originally posted on Reddit
The examples cited look fine on my Linux machines, so wouldn’t this be better phrased as "Windows has awful font rendering"? And … is that even still true? Don’t they ship Windows and IE with sub-pixel anti-aliasing turned on these days? I know that XP looks awful, but what’s IE8 on Vista or 7 like?
This comment was originally posted on Reddit
I have a Mac and a Windows box side by side for testing many different browsers at once, it’s not uncommon for me to have six browser open, three and three, side by side. I also do the initial design work on the Mac, move it to Windows to tune the colors and fonts (Windows seems to yield the most color and font surprises), then dump it back to the Mac … How’s that for cross platform awareness?
In vista and 7 smooth fonts are turned on by default, but sites that use font-face still often look like garbage in firefox on windows ( in ie7+ and chrome they usually render fine). A lot of designers that use Mac and firefox do not know this it seems.
This comment was originally posted on Reddit
The only way in wish tapbot manages to have nice fonts is imae replacement, a rather intensive hack, the world has to move on from crap font rendering..
I’ve been watching the above post go from 1 to 0 to -1 to 0 and so on and so forth, I think it’s hilarious. Presumably Apple fans and non-Apple fans are taking it in turns to read the post. ;D
This comment was originally posted on Reddit
I use Apple hardware and software although I am far from a fan. Regardless of that, I gave you an upvote – we don’t need any platform persecution here!
This comment was originally posted on Reddit
I’d say I’m the same. I use their products because in my **opinion** they are better but I’m definitely not a fan, far from it.
This comment was originally posted on Reddit
I’d rather push my exotic fonts on users whether they look good or not in hopes that users will eventually push their browser vendors (primarily microsoft) to provide better font hinting and anti-aliasing.
The only time I have problems with type on the web is when I’m using the windows operating system. That needs to be fixed so badly.
Hey Steve, thanks for replying. It’s great to want browser vendors to improve their products but I’m not sure if that outweighs meeting the needs of your visitors/users. It certainly isn’t for businesses, as every visitor can potentially be converted to a paying customer.
What’s worse is that browser vendors take forever to make these kinds of changes. I don’t think it’s fair to make your users suffer for that duration, especially if a large portion are using Windows.
I just checked my Analytics for the last 20,000 visitors to my sites – an average of 65% use Windows and from that, 50% use Windows XP. Windows 7 comes in second with 20-25% average and Vista is takes up the rest. Goes to show that XP is still widely in use..
This comment was originally posted on Reddit
He’s right. I suffer from this mentality.
This comment was originally posted on Reddit
Those are browser based issues for the most part, not OS based…
This comment was originally posted on Reddit
Well then why pick on the platform? Why not say: hey, everyone should consider that some OSes haven’t updated their font handing in ten years and need some careful attention?
This comment was originally posted on Reddit
The problem is that OSes will take 10+ years to make those changes – that doesn’t excuse designers from neglecting users of those platforms, which is what I was trying to point out. I found that a large majority of my visitors use Windows XP – that means I need to make sure my design is compatible on XP. It may be the fault of the platform that the fonts look ugly but that doesn’t excuse me from making sure my visitors have a pleasant experience.
This comment was originally posted on Reddit
The problem is that OSes will take 10+ years to make those changes – that doesn’t mean designers can or should neglect users of those platforms, which is what I was trying to point out. I found that a large majority of my visitors use Windows XP – that means I need to make sure my design is compatible on XP. It may be the fault of the platform that the fonts look ugly but that doesn’t excuse me from making sure my visitors have a pleasant experience.
This comment was originally posted on Reddit
Not really. If the text wasn’t fully opaque then, yes, it would be a Windows Firefox issue. However, this article is still disingenuous. He’s got Helvetica on both systems in [this image](http://devgrow.com/wp-content/uploads/2010/04/fonts.png) — something that nearly any random WinXP user *won’t* have. So, it’ll be rendered with Arial instead, a font that doesn’t have hinting/ClearType issues like Helvetica.
This comment was originally posted on Reddit
The question is, if someone is using an OS that has buggy font rendering, do they really have license to be offended by something looking a little scraggly if it otherwise ‘should’ work? I feel like they are used to things being ugly.
This comment was originally posted on Reddit
Helvetica + [ClearType](http://en.wikipedia.org/wiki/Cleartype) = terrible at small font sizes. ClearType doesn’t stay true to any font face when rendering — it renders them as it thinks will be the most readable. This really fucks up fonts that weren’t designed with ClearType or simple hinting in mind. The reason the stuff in that article looks so bad is because he’s using Helvetica on a Windows machine — a no-no. Most Windows people won’t even have it so the article is halfway pointless. Here’s a good example of what ClearType tries to do for the sake of "readability" (Windows on top; OS X on bottom): http://i.imgur.com/BoUk9.png
This comment was originally posted on Reddit
No random Windows user is going to have Helvetica. Helvetica looks *terrible* rendered by Windows — hence why that comparison image looks like shit. Even if a designer specifies Helvetica, nearly all Windows users are going to get Arial instead, and Arial looks fine on Windows.
WHOA. It stole my comments from reddit and put them here. Weird. Now I sound like a broken record. Oh well.
The power of BackType! I appreciate the comments though, you brought up some good points. I’ll try to find some other examples but you’re right, I have installed a lot of fonts on my Windows machine so the font stacks don’t degrade as nicely.
I solve this problem by forcing the fonts I like in my browser. I hate when people think they know what my preferred font size is for reading.
This comment was originally posted on Reddit
Everyone speaks so poorly about clear type.. but I love it… I think designers need to just realise a lot of people don’t have the same keen eyes that they do. You walk a slippery slope with the "smaller font sizes look nicer" thing.
This comment was originally posted on Reddit
>Goes to show that XP is still widely in use.. Goes to show that XP is still widely in use ON MY WEBSITE FTFY
This comment was originally posted on Reddit
<http://i.imgur.com/xmOQ1.jpg> Top: Firefox on Windows XP with ClearType off Bottom: Firefox on Windows XP with ClearType on Windows [looks like shit](http://i.imgur.com/uFXc7.png) without it, and it’s annoying because, from what I’ve seen, the majority of common users have it disabled.
This comment was originally posted on Reddit
I like to browse with an old black and white monitor at 680×420. Web designers, quit using colors and making your sites to big!! I can’t stand you. Why don’t you design everything how I like it! Whahhhh. Meow meow meow. I’m gonna hold my breath and stomp my feet until you change. Oh yea, I’d better throw in an anti-mac sentiment so that my childish rant gets noticed. Otherwise I’ll just appear like a spoiled kid. Ok, here goes…um…macs suck. And people who use them make more money than I do. So there!
This comment was originally posted on Reddit
We need stats for Firefox & IE6 users on XP – bearing in mind that only 1/3 of them are likely to have ClearType off (it’s on by default in all reasonably new machines)
This comment was originally posted on Reddit
Helvetica isn’t typically installed on Windows machines.
This comment was originally posted on Reddit
I would argue you’re being unreasonably negative here. I know it stuffs up existing fonts, but the hinting actually results in a nicer look overall – *especially* in Direct2D mode (see:IE9 technical preview)
This comment was originally posted on Reddit
What? How did I say that at all? I was using Windows XP with 1680×1050 resolution. Windows XP is still widely used today, it’s certainly more common than Windows 7 or even Windows Vista, at least for all of the sites I manage and for over the 100k visitors I analyzed. And I like my Mac but I like my workstation too.
This comment was originally posted on Reddit
This browser part of this problem applies to firefox on vista as well, not sure about windows 7 but I’d assume it does too. Chrome and IE render fonts perfectly, the problem is that Mac designers think that because it looks fine on firefox/mac that it renders the same on windows, but it doesn’t. It is just further complicated by XP default font’s, because you have an OS and a browser based problem.
This comment was originally posted on Reddit
On 4 of my websites, 3 of which have nothing to do about web development. And for over 100k users. But yes, on my websites, XP is still widely in use.
This comment was originally posted on Reddit
You’re welcome :) Is it your website btw?
This comment was originally posted on Digg
No, it doesn’t. Vista has Cleartype turned on by default for *all applications*.
This comment was originally posted on Reddit
This is not entirely true, the default Firefox uses it own fonts. It is very apparent when reading sites that use font-face, that is why I linked to the article above. I know this because A. I’m using Vista right now and B. I have a lot of font experience . Please do not downvote me when I know what I’m talking about.
This comment was originally posted on Reddit
I kid you not, we got XP last year.
This comment was originally posted on Reddit
I just updated my post with stats from another site I run that’s not targeted towards web developers and designers. For the past 400,000 visitors, about 90% use Windows and out of that, 60% use Windows XP. It would be cool if someone else with a decently trafficked site can analyze their stats and reply (either here or in the comments).
This comment was originally posted on Reddit
One thing I forgot to mention was how apply text-shadow can sometimes make fonts illegible on certain browsers (mainly Chrome on XP). It’s a lot more work having to open multiple browsers on multiple platforms but if you’re trying to make your site more accessible, it’s well worth the efforts.
This comment was originally posted on Reddit
It really depends on the site I think. Like TUAW’s (Apple) stats would be really different from say something like "Windows 7 Essentials Blog" or "Workplace Secretarial Forums" (which will more likely be XP). It really depends. However even on XP, you can activate Cleartype.
This comment was originally posted on Reddit
Less than 3% of my company’s users are on a Mac. My design and dev team all use PCs. I can understand why the design community used macs 10 years ago – but not now. My CS4 suite crashes far more often on my Macbook Pro than any of my XP or Win7 machines.
This comment was originally posted on Reddit
Oh, and dear web designers, while you’re at it, please remove the Windows-only stuff as well. Thank you.
This comment was originally posted on Digg
Right. And not all browsers on a given platform suck, so it’s still something the user has control over.
This comment was originally posted on Reddit
You don’t know what you’re talking about. Firefox doesn’t use its own fonts. [I just tested it](http://imgur.com/3ISxm). It works perfectly normally.
This comment was originally posted on Reddit
With Virtualbox being free there’s no reason not to test your designs in IE.
This comment was originally posted on Reddit
You would still need to pay for Windows though.
This comment was originally posted on Reddit
I disable it, it looks ‘better’ to me without it.
This comment was originally posted on Reddit
Helvetica doesn’t do well at small sizes with any form of rendering (even in print). It’s hardly an indictment of ClearType. That aside, you’re totally right about Helvetica on Windows. Just give up and use Arial.
This comment was originally posted on Reddit
There are also some browser screenshot websites out there with a good spread of browsers, but they generally only screenshot above the fold.
This comment was originally posted on Reddit
I use a PC—to browser check the work I did on the Mac.
This comment was originally posted on Reddit
A better title would have been "I don’t know how to turn on ClearType"
This comment was originally posted on Reddit
Look at the site linked in the OP, that links to a designers site. he is using font-face for his intro, open them in Firefox default and Chrome and compare ( his site doesn’t really work in ie). The difference is not huge but it’s noticeable, I’ll try find a better one, they get much worse.
This comment was originally posted on Reddit
Why? What kind of monitor do you have? Is it RGB or BGR?
This comment was originally posted on Reddit
Fair enough. I thought this was a randomly linked article and never realised that the author would be listening! lol.
This comment was originally posted on Reddit
> or maybe I should just turn on smooth fonts in my Windows Display options, but do I really have to? For some reason, I kind of like my Windows fonts they way they look – does that make me a bad person? Uhm, yes? Yes, and yes! credibility = nil
This comment was originally posted on Reddit
I pay what Windows is worth.
This comment was originally posted on Reddit
It might actually be GBR.
This comment was originally posted on Reddit
What about ies4linux, it works on a Mac doesnt it?
This comment was originally posted on Reddit
hakuna matata!
This comment was originally posted on Reddit
I’m wondering what the overlap is between people saying "I use a PC" and people who can’t tell their browser from a website (Q: "What’s your browser called?" A: "I use Google."). The Mac ads were bad enough. Microsoft doing the same with their MSIE ads is just shameful, though.
This comment was originally posted on Reddit
Is everyone missing the point of that blog, it has become a Mac vs PC argument. The point of the blog is that the visitor/customer is more important than how OS/browser should render fonts. If the customer cant read your site then they wont buy from it. The argument applys equally to designers on any system.
This comment was originally posted on Reddit
I don’t know any designers who make sites that look good on OS X but shit on Windows, unless you’re talking about people how make sites that look amazing in WebKit, great in Firefox and shit in IE. This is because IE is shit. I’m not designing for the lowest common denominator, I’m designing for the people who have the best and then making it work for the rest of them.
Otherwise I’d just as well only build things that work in IE6 and I would rather shoot myself in my head.
“I’m not designing for the lowest common denominator, I’m designing for the people who have the best and then making it work for the rest of them.”
there are no words to express how sorry I feel for you and those poor souls that decide to hire you…
I agree with you on that one!
wtf? I use a Windows and a Mac as a designer and I see no difference. :O
This post annoys me.
Maybe if Microsoft got their act together from the start by using an open source engine instead of trying to reinvent the wheel, a lot more websites would look better in IE.
Hey Joshua, thanks for replying. The sites look different in Firefox and Chrome too, not just IE.
Anyone claiming to be a web designer should know off the bat that the websites they create should be cross-browser compatible and also platform compatible. Why would you want your client’s site only to be viewed by a handful of people, especially if you created it?
I use Windows (Vista) an Elliot Jay Stocks’s site looks just fine, how did you take that ugly screenshot?
Hey Natalia, I used FF3 on Windows XP to take that screenshot.
I’m using FF3 on Windows 7 and it looks fine and smooth :)
I agree with what you say. It shouldn’t matter what platform or browser the visitors use, they deserve the very best but most sites do look better when a Mac is used :-)
Monji, bite your tongue when looking at this one -> sjobs.me Use different OS and browsers.
This trend you’re referring to is going to annoy a lot of people and move everyone towards using a Mac. I’m not sure that’s a bad thing, it depends how you look at it.
Hey Kris, thanks for replying. I tried out your link and was told I needed a webkit-based browser (I was using FF3 on XP). While I applaud the effort of these designers to push open standards, this makes zero sense for people who are utilizing the web for business (which is the point I was trying to get across). Your visitors are your customers and your customers drive your business, why alienate or ignore even a small portion of them? It’s OK for a site like sjobs.me – he’s obviously not in it to make money (I think?) – but for a SaaS site or someone selling a product, browser and OS compatability are absolutely crucial.
why not??
I got two words for you:
“Right Click”
First thank you very much for this article i was planning to write about the same subject also. i think for us as web designers we shouldn’t limit our self to a specific platform .
Thanks Mohammed, I appreciate it!
The problem is that to me and most of the designers I know, just about *any* Website looks ugly as sin on Windows, due to the bad font rendering (and the poor selection of fonts availabe) so even as a typographer myself, I simply fail to see the minute differences between fonts that look only hideous in contrast to others that look petrifyingly hideous on Windows. It’s not as easy as you point out in your article.
Of course you are right that designers need to make Websites usable and readable for everyone, but if the OS and its font rendering makes this almost an impossible task to begin with, who are we to blame if we don’t catch the peculiarities between puke-ugly and sufferably ugly?
I must admit I have had a lot lot of work to prepare our company website’s to have exactly the same feeling on mac and pc.
You’ve got to be kidding me! You’ve got it the other way around, bub. It’s the notorious Windows ‘designed’ sites that fail to take into account other platforms like Apple and Linux. Not only are windows-centric sites mostly on the ugly side, they also don’t play well with the other kids in the playground.
I’m relatively new to the web design game but I’ve been quite surprised by how many designers I’ve met that decide to ignore their analytics.
If a significant percentage of visitors are using IE/MS OS how can you ignore this. Especially when it comes to fancy non-standard fonts.
Cross browser testing is a must not an optional afterthought.
I wholeheartedly agree!
RE Font rendering.
It seems many peeps are print designers only or something and have little concept of the web medium. I have been successfully designing now for web for 10 years, but I used to design for print hence the following analogy.
Would you ever design a print job for a particular paper stock if you knew most of the job would be printed on a different stock that would have problems rendering your design leading to bad bleed or thin lines dissappearing? NO. If you did your client would probably sack you.
Yes Mac Os have their own hinting engine that overall makes fonts look better, but if you are specifying a non web-safe font (web-safe fonts are the ones we are pretty sure are on all systems) using a font stack or @fontface, you MUST check what it renders like on all systems BEFORE you specify it. Many fonts are currently being re hinted because of growth in @fontface use.
Blaming the 90% of users systems, users browser or Os choice is a poor excuse. Many people don’t even know what a browser is let alone that they have a choice of them or that some browsers offer a better/different experience. All they see is badly aliased fonts.
Please give us good looking type.
Thanks for the eloquent response Maak, I completely agree with you.
we are still waiting for PC/Windows/Internet exploder to catch-up. Maybe we should all move to a system that actually works.
I mainly design in a Windows machine at work, and use Mac at home for play more or less, I’ve used it for design before though and it is more enjoyable but that’s probably because I am in the comfort of my own home more than anything. There is however a calming element about the Mac, just so silent. Sad that I require so many Windows applications for work so can’t use Macs there :( I guess it’s pretty much true what they say “Windows for work, Mac for play” at least in my case anyway… my Mac can’t even open spreadsheets I need to edit… It can be a pain being a Mac owner with a technical career, guess I’ll have to get Windows on boot camp… ah the Mac’s first virus. :P
Thank you, that is exactly what I was trying to get across! It doesn’t matter what platform or even browser you’re using, if a significant percentage of your visitors have difficulty with your website, chances are they’re not going to buy your product.
Well we see a screenshot above with the same browser ona different platform. The font problems are absolutely platform based. Not browser based.
Because browsers use your system’s fonts.
So no, it’s not browser based.