Internationalization/Styling and typography

This is a summary of recent conversations that were held in the Internationalization team about making the next generation of Wikimedia typography and styling guideline properly internationalized and usable in all our communities.

The TL;DR version: Before writing a big new movement-wide style guide we must understand and document the different content and UI elements that need styling in different languages and communities.

The long version:

There are several issues with fonts and i18n. Some are technical, for example:

  • Making sure that all the elements have the correct line-height to show the letters completely and not cut.
  • Making sure that fonts are not too small (Japanese and Indic fonts can be unreadable when they are too small).
  • Making sure that the fonts have all the needed weights: some fonts, especially non-Latin, come only as regular and don't have a proper bold or italic version and trying to make them bold or italic artificially usually produces bad results.

All of the above issues are important, but their importance is medium. These are matters of implementation that can be solved if the specification is right. The most important issue, however, is to define the needs: before defining which fonts must be used and of which sizes, it must be defined what are they used for. Talking directly about font style characteristics is not quite relevant for some languages. For example, italic is common in Latin and Cyrillic, but its usage in some other scripts is considered a bad practice, at least by some designers; both Hebrew and Malayalam are examples of such scripts.

So the right question that must be asked first is not which italic, serif or sans-serif font to use, but what is it used for: if it's used for a quotation, then future MediaWiki style should provide a way for making quotations; if it's for emphasis, then future MediaWiki style should provide a way for making emphasis; etc. What that way will actually be is a separate engineering question: it may be done using new wiki syntax,[1] using templates, using Lua, using logical HTML tags,[2] using <span>s and <div>s with relevant CSS classes, using some internal Visual Editor magic, or some combination of the above.

So the users should be able to apply the correct semantic definition to the content and styling can be applied to it later according to the language's requirements. (There's also the issue of this being both cross-language and cross-project, for example: how will a citation in French appear in the English Wikipedia - according to the English style guide or the French?)

Currently core MediaWiki provides very little content styling: it has headings, tables of contents, ordered and unordered lists, definition lists, (convoluted) tables, image thumbnails, and little else. Widely used extensions provide formatting for footnotes, poems, math formulas and source code. This are sometimes customized locally, but mostly they are quite the same in all projects.

Other content and UI elements, however, are done manually in each project: These include quotations, infoboxes, phonetic guides (such as IPA), maintenance templates ("citation needed", "This article does not cite any references or sources.", etc.). It's done using a combination of templates and custom CSS. Some look very similar to how they are in other languages, and some look very different. These templates and styles probably reflect the project's needs at least to some degree, but there are several issues with them:

  • They are usually unknown to English Wikipedia people and to the Foundation people.
  • They may be useful in other languages, too, but it's hard to port them.
  • Software upgrades break them, because they assume English configuration and style.

The best way to get to know the projects' style needs is to make a survey of the currently used styles and content elements in the different languages. This work doesn't require a lot of knowledge in design and programming - it only requires documenting the widely used templates and styles and making summarized translations of Manuals of Style in different languages. (This is not as big as it may sound: The Manuals of Style in about 20 major languages are a lot shorter then the gigantic and scary English Wikipedia MOS.) The result of this work should be a list of the needed content elements and the different ways to implement them in different languages. Doing it this way will ensure that the style guide will be useful not just for the English, but for more languages.

Another important question that Pau had is whether this should be done for content elements or for user interface elements. The answer is - both; There are some significant user interface customizations in many projects and from surveying them we can learn a lot about the different communities' needs.


  1. Well, hopefully not that.
  2. A technical footnote: The HTML tags <q>, <blockquote> and <em> already provide the logical functionality for doing this, but unfortunately <q> is completely unused, <i> is used instead of <em>, and work on integrating <blockquote> was started once and then abandoned. Here's a nice example of support for properly localized emphasis in CSS.