Jensen Harris: An Office User Interface Blog : Fonts

New Fonts For Documents

jensenh — Wed, 07 Dec 2005 18:00:00 GMT

Last month, I introduced Segoe UI, the new user interface font for Office 12 and Windows Vista.

Of course, you spend most of your time in Office not looking at the user interface, but working with documents. Times New Roman has been Word's default font since Word 6.0 introduced support for TrueType fonts. Although there are numerous other options available, most documents today are produced in Times New Roman, Arial, or more recently the Web-friendly choice Verdana.

Office 12 ships with six brand new fonts designed for use with the content in your document. Each of the fonts is optimized for ClearType and suitable for use both on-screen and in printed documents.

Below, courtesy of Microsoft's Advanced Reading Technology team, are pictures of the six new fonts along with brief descriptions of each font.

Consolas is aimed for use in programming environments and other circumstances where a monospaced font is specified. All characters have the same width, like old typewriters, making it a good choice for personal and business correspondence. The improved Windows font display allowed a design with proportions closer to normal text than traditional monospaced fonts like Courier. This allows for more comfortably reading of extended text on screen. OpenType features include hanging or lining numerals; slashed, dotted and normal zeros; and alternative shapes for a number of lowercase letters. The look of text can be tuned to personal taste by varying the number of bars and waves.

Calibri is a modern sans serif family with subtle roundings on stems and corners. It features real italics, small caps, and multiple numeral sets. Its proportions allow high impact in tightly set lines of big and small text alike. Calibri's many curves and the new rasteriser team up in bigger sizes to reveal a warm and soft character.

Cambria has been designed for on-screen reading and to look good when printed at small sizes. It has very even spacing and proportions. Diagonal and vertical hairlines and serifs are relatively strong, while horizontal serifs are small and intend to emphasize stroke endings rather than stand out themselves. This principle is most noticeable in the italics where the lowercase characters are subdued in style to be at their best as elements of word-images. When Cambria is used for captions at sizes over 20 point, the inter-character spacing should be slightly reduced for best results. The design isn't just intended for business documents: The regular weight has been extended with a large set of math and science symbols. The Greek and Cyrillic has been designed under close supervision of an international team of experts, who aimed to set a historical new standard in multi-script type design.

Constantia is a modulated wedge-serif typeface designed primarily for continuous text in both electronic and paper publishing. The design responds to the recent narrowing of the gap between screen readability and traditional print media, exploiting specific aspects of the most recent advances in ClearType rendering, such as sub-pixel positioning. The classic proportions of relatively small x-height and long extenders make Constantia ideal for book and journal publishing, while the slight squareness and open counters ensure that it remains legible even at small sizes.

Corbel is designed to give an uncluttered and clean appearance on screen. The letter forms are open with soft, flowing curves. It is legible, clear and functional at small sizes. At larger sizes the detailing and style of the shapes is more apparent resulting in a modern sans serif type with a wide range of possible uses.

Candara is a casual humanist sans with verticals showing a graceful entasis on stems, high-branching arcades in the lowercase, large apertures in all open forms, and unique ogee curves on diagonals. The resultant texture is lively but not intrusive, and makes for a friendly and readable text.

I Guess No One Cares About Fonts

jensenh — Mon, 28 Nov 2005 18:00:00 GMT

Last week, I wrote about Segoe UI, the new font used to render the user interface of Office 12 and Windows Vista.

I intended it to be a little fluffy "FYI" piece. Little did I anticipate the flurry of comments and feedback and e-mail and blog entries. Font this, font that! Font font font font font!!!

So today, a little more about Segoe UI, starting with a mea culpa. To save time, I pulled the picture of Segoe UI I published last week from the beta version of the Windows Vista UX Guidelines in MSDN.

That was a mistake. It turns out that whomever made the picture used Segoe (Microsoft's corporate branding font) and not Segoe UI (which is the font we are using in the Office 12 interface.)

Simon Daniels, lead fonts program manager for Microsoft Typography, sent me mail to correct my mistake. He also provided me with an updated picture of Segoe UI, which I reproduce below. (I've also updated the picture in the original post.)

Segoe UI is the new user interface font for Office 12 and Windows Vista

Simon, who knows 500x more about fonts than I do, has been one of our point people on the Segoe UI effort for Office. He wrote the following short background on Segoe UI which I hope you'll find interesting:

"Segoe UI is a four member typeface family included with Windows Vista and Office 12 for User Interface use. Its used widely by Windows Vista components but can also be specified by third party apps running on Windows Vista that may wish to take advantage of it in order to have the Windows Vista look and feel. Efforts are underway to enable third party apps running on Windows XP to access the fonts too.

"Each Segoe UI font includes well over 2,200 characters, supporting Unicode 4.1 coverage of Latin, Cyrillic and Greek based languages and includes support for IPA (international phonetic alphabet) and combining diacritics.

"The Segoe fonts are provided as TrueType flavor OpenType fonts, and as such can be used to author regular documents or create graphics, but the fonts themselves have been tuned for use as UI fonts at 8pt, 9pt, and 10pt under the ClearType rendering environment.

"Although the fonts have been optimized for ClearType (the Windows Vista and Windows Presentation Framework default experience), concessions have been made for regular bi-level (black and white or aliased) rendering, or for regular grayscale antialiasing.

"Segoe UI was drawn in the humanist sans-serif style evoking natural, almost hand drawn letter shapes. As a humanist sans design it shares characteristics with Adobe Myriad, Verdana, Corbel, Lucida Sans and the father of the humanist sans movement Frutiger. Unlike Verdana and Frutiger the typeface has a lively true italic, not based on an obliqued or slanted regular style. Also unlike the humanist sans faces designed primarily for print-use the fonts include distinctive letter shapes that help the user distinguish between easily confused characters like lowercase l and uppercase I.

"Finally, Segoe UI is just one part of the extended Segoe family of typefaces. This family also includes contextual cursive handwriting fonts (Segoe Script), a hand drawn non-cursive font (Segoe Print), special fonts for TV use (Segoe TV), a symbol font for hardware decals (Segoe HW) and a fourteen member set used for branding and corporate communications.

"One final note: The original Segoe fonts were not created for or by Microsoft. It was an existing Monotype design which we licensed and extensively extended and customized to meet the requirements of different processes, apps and devices."

There you have it, direct from the expert. Thanks, Simon!

Making the Letters Better

jensenh — Wed, 16 Nov 2005 18:00:00 GMT

We're not just introducing a new UI in Office 12--we're also introducing a new UI font.

Windows 95 used "MS Sans Serif" as the UI font in Western locales. It was a straightforward font which looked fairly good, if plain, at small sizes. Office 95, as well as previous versions running on Windows 95, used this font for menus and dialog boxes.

With Office 97, a new UI font was introduced called "Tahoma." Tahoma was designed by Matthew Carter and hinted by Tom Rickner, and was optimized for on-screen reading at small point sizes. Tahoma 8pt. is still used as the main font in Office 2003 today; it has also been used as the main UI font in Windows since Windows 98.

A piece of trivia: the very popular Verdana font is the wider cousin of Tahoma. Verdana was created by starting with Tahoma and increasing the spacing between letters a bit and updating the hinting accordingly. There's a lot more you can read about the history of Tahoma and Verdana in this interesting article.

Fast forward to today, nearly a decade after the adoption of Tahoma. One major innovation that has transpired in the interim is the introduction and widespread adoption of ClearType, which many people feel allows crisper on-screen text, especially on LCD-based displays.

With the UI changes happening in Windows Vista and Office 12, we felt like it was time to commission a more modern UI font, designed specifically to take advantage of ClearType. In addition, we wanted a more humanistic, friendly font that would seem less "computer-y" than Tahoma. Most importantly, we wanted the font to take advantage of the research done in Microsoft Typography over the last decade in specifically creating fonts that are easy to scan and read on-screen. These guys know their stuff, and we knew it would make a positive difference in the user interface.

The result is a font called "Segoe UI" which will ship in both Office 12 and Windows Vista. It was conceived, designed, and totally optimized for ClearType, and I think it's beautiful at both small and larger point sizes.

The Segoe UI font will ship in Office 12 and Windows Vista

That said, the creation of a font good enough to use in Windows and Office must seem sometimes like a thankless job. The designers have been iterating on it for nearly two years now, making changes based on our requirements and those of Windows. We will primarily be using the 8pt. size, while Windows will be using primarily 9pt., and so keeping those in sync design-wise has been a challenge.

It's amazing to me how much work goes into making a great font--sometimes we send back feedback just about a certain glyph ('g' looks weird in this specific situation) and they tweak the hinting just a bit to improve it. Tightening up line spacing has been a constant issue--we don't want the Ribbon to take up any more space than necessary, yet Tahoma "cheated" by having certain accents drawn over descenders from the previous line sometimes. We can't allow Segoe UI to use the same trick.

Learning all about the ins and outs of font design has been another one of those unexpected job perks. You know when you show up for work at Perkins that you're going to be making pancakes, but you never expect to get to help design the syrup bottle too.