On Mon, Apr 14, 2014 at 6:54 PM, Steven Walling <steven.walling(a)gmail.com>wrote;wrote:
On Wikitech-l, Design-l, and in the extensive
documentation on
mediawiki.org,
people have laid out highly objective rationales for why each font and the
associated type sizing, spacing, leading, and more were selected to be
harmonious with each other.
While I do not want to belittle that effort at all, I think at this stage
the discussion might benefit more from data than from rationales. There was
a lot of guessing about the availability and readability of certain fonts;
to a large extent, this could be measured:
- you can create a font with zero-width characters, download it as a web
font, set up a staging area somewhere outside the viewport, fill it with
some text, set "font-family: testedFont, zeroWidthFont" on it and query the
width. This is a fairly reliable way of testing for the presence of a font
name (although not the font itself, since the OS might match a different
font to the name - but at least it tells you which font name on the stack
is matched). Do this for all the fonts in the stack, report the results
(together with browser, OS and location) back with EventLogging, and you
will have a good idea of how widely each font is supported, and how that
correlates with OS, wiki language etc. (There are more direct methods with
Flash, but the browser support for it is worse.)
- the same width-measurement trick can also be used to tell apart fonts:
for example if the same string has the exact same width in Helvetica and
Arial, the OS is faking Helvetica. (It might be even possible to build some
sort of font fingerprint by specifying all CSS properties relevant for text
layout in absolute sizes, and measuring the width of a few different
strings on a reference machine. This could be used to identify fonts on the
user's machine, although with all the subtle differences in font display
that depend on browser and OS, this might not be useful in practice.)
- instead of guessing about user preferences, you could just create a
simple survey which shows them the same text with two different font stacks
side by side, and ask them which is more readable. This is good for making
aesthetic decisions more objective, and also for catching weird issues with
old machines, CJK fonts etc: you can add a comment field to the survey, and
if the browser is sufficiently modern to support canvas elements, you can
even save a snapshot if the rendered text; you can skim through the survey
replies which are different from what you have expected, and look for
display problems.