User:Volker E. (WMF)/Project Improving reading experience

Readability or a good reading experience is of high importance to our projects. Typography and specifically font choices are building the base for such experience, no matter what device, operating system or language the users are using.

Goals and summary
With our current font choice for running text –  – we've been building on generic font stack, for historical reasons resulting in Arial or Helvetica in latin languages on majority of browsers, that mildly supports the web's universality and was the primary choice when supporting the widest variety of users like we do.

Within the last couple of years driven by emerging mobile operating systems (OS) and strong growth in markets aside of latin script languages, the system manufacturers have been introducing new default fonts, that are aiming to provide better readability and better-support (of more) languages. Those typefaces, herein summed up as system typefaces
 * deliver better native experience for readers,
 * improve cross-platform and
 * cross-language readability

Therefore we aim to bring a font stack to our mobile skin MinervaNeue, that takes advantage of the specific system fonts.

Technical background
You can read more on the technical backgrounds at Phabricator task T175877

Proposed stack (see discussion on task): font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Lato, 'Helvetica Neue', Helvetica, Arial, sans-serif;

This works specifically for all platforms as a fallback mechanism is part of the open web standard CSS that lets browser rendering engine fallback to the first font in the stack it has available. Roboto for example is Android's current default font, and none of the three fonts before in the row are installed on the system, then Roboto is taken for rendering the content.

Stack logic: User system preferred (mobile) > Wikimedia Design choice (Lato) > User operating system desktop only ( 'Helvetica Neue' > Helvetica > Arial) > generic sans-serif

Problem statement
Currently relying on web browser default font choice, which is, out of historical reasons often Arial and Helvetica as least common denominator with the widest language script support. But both fonts date back more than a dozen years. Comparison screenshots to come…

Prior art
There have been a few other web institutions facing similar challenges and taken a similar path: …