Designing the typography of Wikipedia

New typography options making Wikipedia easier to read are now available for readers in more than 300 language versions of the online encyclopedia. These options are not only based on academic research but also on hundreds of designs created by Wikipedia community members.

For years, I’ve been using the Chrome browser zoom feature at 150% or so, in order to comfortably read content on Wikimedia sites. Now […] I am able to reset Browser Zoom to 100% default, and the native tool works God’s miracles! Hooray! – Elizium23

Last year, I joined the Wikimedia Foundation as the Lead UX Designer for the Web team. Our team leads Wikipedia’s browser-based reading experience. The first big task I received when I started working for the Foundation was to make the font bigger on Wikipedia. Simple, right? The old font size was introduced over a decade ago when computer monitors and browser-based reading expectations were very different from what they are today. It seemed simple enough at first glance, but I quickly learned that the scale of our work and the complexity of our readership means nothing simple is ever simple when one is designing Wikipedia. 

The readers

To begin with, the scale of our work is staggering. In a year, people collectively spend hundreds of millennia reading Wikipedia. In just one month, all 300 plus Wikipedia language versions average 15 billion plus views. In this context, even minor changes to baseline typography could have an enormous global impact. We needed to understand the specific behaviours of our readers and how our brains and eyes work together to process text on the internet. 

So what are those readers doing every day? Given that the “target audience” for Wikipedia is every literate human on Earth with an internet connection, we needed to narrow things down and understand the readers for whom these improvements would have the biggest impact. Thanks to the incredible Design Research team at the Foundation, we learned that these readers come with a specific task in mind. 

Most people are reading Wikipedia for less than a minute. The median reading time is 25 seconds. At that time, people scan for particular pieces of information. A survey of 2500 Wikipedia readers from Sub-Saharan Africa found that readers tend to skim or scan articles for information about current events, a notable person, or school assignments. For these casual readers who make up the vast majority of readers on Wikipedia, the wikis are places to begin a search for information quickly, not the end destination for in-depth, line-by-line reading. For these reasons, we decided that casual readers who quickly scan for specific information would be the primary audience for our design interventions.

Prototyping with communities

Even with a set of principles grounded in solid research, my limited perspective could never hope to adequately consider the bewildering diversity of casual reading experiences of billions of people in hundreds of languages. We needed help. Luckily for us, editor communities are usually deeply involved in major design decisions. From a design process perspective, we wanted to encourage distributed, participatory design practices as much as possible, and we want to grow that practice more in the future. We also knew that a large, diverse range of prototypes at an early stage in the designs would improve the quality of the design in the long run.

To this end, our team experimented with a scaled-up, distributed version of a generative design approach. We reached out to 13 different Wikipedia communities, including Arabic, English, Hebrew, Japanese, Ukrainian, Vietnamese, and more. We asked them to use an interactive prototyping tool and submit prototypes of their typography preferences. We received 632 designs.

Community designs showed us that the new default typography for articles on Wikipedia should be slightly bigger with slightly more line height than our current defaults. The majority of prototypes had slightly bigger fonts with slightly more line spacing. This aligns with both the academic consensus to “Make it big”, as well as our team’s preference. A minority of people preferred Wikipedia’s current typography, which led us to decide to keep those settings as a “Small” option in the future. We also learned that bigger typography options should get relatively denser as they get bigger, which supports our research findings about scanning reading patterns. In the community prototypes, preferences for a “large text” option were the least clear, and our large text options should probably fall somewhere between the community designs and the academic recommendation of a 24px font size.

Try it now

We synthesized all of the data from the community prototypes, academic research, and the team’s design sensibilities to arrive at a set of new typography options for Wikipedia that should improve readability and accessibility for billions of people. These new options are now available for readers in over 300 languages as the new Appearance menu next to the content area. Enjoy reading Wikipedia!