Windows still has well over 80% of the desktop market and IT WASN'T TESTED? How can that be? It's not like this is an obscure Windows issue. View any page on your site and it would have been glaringly obvious...<p>Thanks for the fun write-up though. Overboard rage aside, it's a good reminder that we all should double-check our QC processes.
The main takeaway for me is the lack of testing before releasing a new major version. I know that the market is pretty fragmented between desktop and mobile, but you should expect that some people will access from a Windows machine. Maybe I misunderstood but it was launched without being rendered once on Windows ?
Can someone who does more UI work than me explain why you would want to future proof css like this in the first place?<p>Even forgetting the undesired outcome and lack of testing, it's css...if browsers implement this feature, release it when the time comes. Not sure what's to be gained from adding something like this now. Feels like over thinking the issue a little.
No mention of the fact that CSS actually has a mechanism to use OS system fonts? 'caption', 'menu', 'message-box' are all, for example, available system fonts.<p>This is actually a bit of a quirk in the syntax of the CSS 'font' property - <a href="http://www.w3.org/TR/CSS21/fonts.html#font-shorthand" rel="nofollow">http://www.w3.org/TR/CSS21/fonts.html#font-shorthand</a> - in that it's not strictly only a shorthand for size/style/family properties, because you can use 'message-box' as a complete font specification, but you can't use '20pt bold message-box'. On the other hand, you can stack 'font: message-box; font-weight: bold; font-size:20px;', so thats not actually a limitation.<p>Not sure what the browser support situation is, as 'caniuse' and 'quirksmode' haven't dug into the details of support for the CSS 'font' property, but it looks to be doing what you'd expect in chrome on OS X. YMMV.<p>Looks like this isn't the first time someone's missed this? <a href="http://furbo.org/2015/07/09/i-left-my-system-fonts-in-san-francisco/" rel="nofollow">http://furbo.org/2015/07/09/i-left-my-system-fonts-in-san-fr...</a>
<p><pre><code> And, somewhere within the depths of modern versions of Windows, there lay, dormant, an old-fashioned System font from 1990 — alongside some vintage software routines necessary to render it.
</code></pre>
I mean it's hardly hidden in the depths of Windows - it's right there in every single font selection menu.
I always quite liked the Windows 3.1 fonts. They were nicely put together - very crisp, and easy to read. Good use of the grid.<p>None of the screen grabs show them at their best, though, because they've been scaled unevenly. Zoom in on the Program Manager shot - if you can't spot them as-is - and you'll see the telltale signs. Tastes differ, but it makes my eyes slightly uncomfortable just looking at it.<p>Wikipedia has a much better 1:1 shot: <a href="https://upload.wikimedia.org/wikipedia/en/6/6b/Program_Manager.png" rel="nofollow">https://upload.wikimedia.org/wikipedia/en/6/6b/Program_Manag...</a> - just look at it! Aren't those pixels glorious?
Does it mean that none of the devs/designers in medium.com use Windows?<p>IMHO it's just interesting coincidence, nothing more. Even though I am not Windows user and I am not for eternal software backwards compatibility (this topic can evolve into a huge rant). Though somehow medium.com staff tries to prove, that having old font is a bad thing and shouldn't be installed today. They released a major update (even calling it version 2.0) and have not it tested it with users (remember that the goal was to use native fonts, so they must have tested it with Android, iOS, OS X, Windows, Windows Phone, Chrome OS, etc.)?<p>Article was very interesting, showing how can long history of computing produce interesting outcomes. But I felt that author is very annoyed by this coincidence, and somehow this is Microsoft's fault and not medium's and IMHO author is not right.
I'm a bit confused about the use of "just give me a system font", then several named fonts and then "sans-serif". Isn't that exactly what "sans-serif" does, giving you a sans-serif system font?
So, there's obviously a miss on testing this here [1], but I wanted to make another point about the wisdom of embedding code that you cannot test, thinking that it would have no effect, with the expectation that at some arbitrary date in the future (which you don't control) it will change the visual appearance of your landing page to something else... that you haven't tested. When iOS 9 came out, it wasn't like people were just resubmitting their apps without ever running them once.<p>[1] I'm willing to buy that Windows represents a minority of browser share to Medium, although it still seems doubtful that it's such a small share that making visual changes to your global CSS doesn't merit testing on that OS. Was this just a line in some larger diff? "By the way, I changed all the fonts; works on localhost"?
Heh, I thought the punchline was going to be people seeing _this_ San Francisco font <a href="https://en.wikipedia.org/wiki/San_Francisco_(1984_typeface)" rel="nofollow">https://en.wikipedia.org/wiki/San_Francisco_(1984_typeface)</a>
All sounded great until<p>> And, since –apple– is a typical vendor prefix for an experimental feature, we included a more future-proof system as the first entry<p>Adding system as font should have rang a few alarm bells with any designers older than 30!
Semi-related question:<p>The author posted this image of him recreating the old System font as an OpenType vector font:<p><a href="https://d262ilb51hltx0.cloudfront.net/max/800/1*gwDg2tz2R22D8Rqaxl4kCA@2x.png" rel="nofollow">https://d262ilb51hltx0.cloudfront.net/max/800/1*gwDg2tz2R22D...</a><p>The offset pixel on that look horrible, but they also look like a lot of the web fonts I see day-to-day when I have font smoothing disabled. Are modern fonts actually being designed like that for some reason?
I suspect the author (and possibly everyone in their office) is younger than this font. What was that discussion we were having the other day about ahistoricity? <a href="https://news.ycombinator.com/item?id=10412284" rel="nofollow">https://news.ycombinator.com/item?id=10412284</a>
By Marcin Wichary. That name brings back memories... I recognize his name from a site he ran called the GUIdebook [0], which documented a number of GUIs in screenshot form going back decades. Unfortunately, he stopped updating it in 2006, but the site is still up for anyone who wants to check it out.<p>[0] <a href="http://www.guidebookgallery.org/" rel="nofollow">http://www.guidebookgallery.org/</a>
This is reassuring. Designers choosing system fonts. As a non-designer, I opted for site-wide Georgia usage recently and was really happy with the result. I was doing it initially partly for performance reasons, and to stop external calls on a HTTPS-only site, in the end it felt like it was more fitting and more characterful than the (pretty, but generic) Source Sans Pro.
As of Windows 7, Windows still likes to fall back to System font if it is running low on UI resources. I see this on a regular basis in the "Find in Files" results in Visual Studio.<p>Further down the rabbit hole:<p>On Win2k, if you used non-default DPI settings, programs using System font looked particularly atrocious.
Sometimes it doesn't pay to overthink things and do more than is necessary. It doesn't seem likely that without the vendor extension "system" is going to become an official or defacto cross browser standard any time soon. Without that font name being reserved by either a standard or common usage a collision would seem inevitable.
> <i>It was not even a vector font… most personal computers couldn’t use vector fonts yet.</i><p>What are the exceptions? What "personal computers" from the Windows 3 era had a UI with vector fonts?<p>(I'm assuming that institutional workstations costing upwards of $15K don't count as personal computers.)
I don't know if this could be of help to them in their specific case but have they tried something like this<p><pre><code> font: caption | icon | menu | message-box | small-caption | status-bar
</code></pre>
to reach the desired result?