Readable Web » Fonts

Destination Web At ATYPI

Richard Fink — Sun, 05 Sep 2010 17:34:28 +0000

As someone who writes a lot about fonts and typography, I joined some professional associations. In addition to SOTA, which I joined last year, I am also a new member of ATYPI, the Association Typographique Internationale. ATYPI’s annual conference is being held in Dublin, Ireland. I proposed giving a talk on Web Font formats, and the decision makers at ATYPI graciously accepted. I’m looking forward to it greatly.
Here’s what I pitched as the topic of my talk:

Destination Web: Preparing Fonts For The Browser

For the past fifteen years, web authors have been restricted to a handful of “web safe” fonts provided by the underlying operating systems like Microsoft Windows or Apple’s OS X within which web browsers are installed. This has now changed.

As of early 2010, the five major Internet browsers – Internet Explorer, Firefox, Opera, Safari, and Chrome – have all implemented various means and levels of support for “web fonts”. That is, fonts that are supplied, not by the underlying operating system, but by web servers.

This is an unprecedented development in the history of type. For the first time, there is a nascent mass-market for type, without a publisher or some other entity, acting as intermediary. Even in the past few decades of digital technology, the font-design community as a whole has remained print-oriented and the peculiar problems of creating fonts for the low-resolution environment of computer display screens have been left largely to the makers of operating systems such as Microsoft. But now, with the change in capabilities of web browsers, over the coming years, font designers will increasingly find their fonts making their way onto web pages. And this new usage, this new destination, brings with it new challenges to which font-designers, if their work is to remain relevant, need adapt.

As the sophistication of display technology and devices like the Kindle and the iPad improve, and as the demand for paperless green technology grows, the assumptions under which the type industry has worked since Gutenberg’s time, will undergo a radical change.

There will be a great need to provide fonts that are browser-friendly and work well in a low-resolution environments as opposed to the high-resolution environment of print. In addition, web browsers demand connectivity – fonts are sent digitally, on demand, and therefore need to be specially prepared for travel. The need to prepare fonts for speedy delivery and in browser-friendly formats is, once again, an unprecedented development.

Eventually, screen usage will most certainly come to dwarf print. But oddly, with the advent and continued sophistication of one-off and short-run print technology, browsers are poised to do double duty – not only as viewers but as more traditional desktop publishing applications, as well. Even today, if the number of web pages printed out on any given day were taken into account, it would amount to a significant portion of printed output, in total.

The presentation will include:

1) A brief overview of how fonts are linked to web pages with a special emphasis on backwards-compatibility issues regarding Internet Explorer 6, 7, and 8 about which I am uniquely informed.

2) Current formatting options such as: EOT, EOT “Lite”, WOFF, SVG, and Data URI’s

3) IP Protection/Obfuscation Techniques such as: File Splitting, font renaming, and sub-setting

4) Tools: The current state of the tools available for preparing fonts for the web 5. Print: The current state of browsers as a desktop publishing platform for print.

Typedia: A Font Resource In The Making

Richard Fink — Mon, 30 Aug 2010 22:29:32 +0000

Last year sometime, Typedia showed up on the radar here at Readable Web. I wasn’t quite sure what to make of it, frankly. No tag line. What’s the focus? What’s the angle? But the people behind it had gravitas in the world of web so I figured maybe I was missing something. I kept an eye out.

Lately, that’s been paying off. The posts on the Typedia Blog by Erik Vorhes have been top notch, by my lights. Enlightening reading with enriching links. This son-of-a-gun is puttin’ me to shame, really. And so……. may we have a drumroll pleeeeeeese……. I have added Typedia to the Linkworthy blogroll here at Readable Web.

What’s Typedia? Well the font loving folks who created it say this:

In a nutshell, Typedia is a community website to classify typefaces and educate people about them. Think of it like a mix between IMDb and Wikipedia, but just for type. Anyone can join, add, and edit pages for typefaces or for the people behind the type.
We love type, and we have a burning desire to learn as much as possible about typefaces: where they come from, who made them, and why they look the way they do. We want everyone to be able to share in that rich knowledge and enjoy the art and artists of type design. Over time, we think Typedia could grow into a great educational resource for people to learn about their favorite typefaces and discover new ones.

Got A Yen For A Yin, Yang?

If you’re into fonts, web fonts, type, typography, web design and stuff like that there, check it out and get involved. Typophile is a great and unique resource, too, let’s not forget. But for every Yin there’s gotta be a Yang.

Dang!

WOFF Support In Chrome Starts Up

Richard Fink — Sat, 28 Aug 2010 21:45:00 +0000

WOFF web fonts are now live in Version 6 Beta of Chrome for Win XP, Win 7, and MAC OS X, as well.

Days away? A week away?

Version 6 Beta seems pretty stable.

A simple test page.

Here is an image of what you should see in any browser if WOFF support is there:

PT Sans, An Excellent Free Font For Screen

Richard Fink — Mon, 23 Aug 2010 05:17:13 +0000

Alexandra Korolkova of ParaType spoke at TypeCon 2010 about two new freely licensed fonts: PT Sans and PT Serif. They were commissioned by the Russian government. PT Sans is available for download and PT Serif will be released later this year.
Alexandra writes:

“In 2009, the Federal Agency for Press and Mass Communications commissioned the development of two type families – PT Sans and PT Serif. The intention was to develop a set of fonts that could serve all official languages of the Russian Federation and make them publicly available. Russian territory is inhabited by many peoples using about 200 languages: around 50 of them have official status. On one hand, the project is an example of collaboration between linguists and type designers, on the other hand, it’s an example of proper attitude of government to type design. PT Sans was released at the end of December 2009 and is already widely used within and outside of Russia. PT Serif will be released later this year.”

These are well hinted TrueType fonts, designed for screen, and are very freely licensed. Highly recommended for text at small sizes.

In addition to the TTF package, there’s also a package for instant web gratification, containing uncompressed EOT “Lite” files and WOFF files. (Hey, ParaType, ain’t ya heard of EOTFAST?)

[Caution: FOUT Alert] Because of the extensive language support, there are a lot of glyphs and so the files are relatively large. If your site is in English, you might want to subset down to more manageable sizes. The Font Squirrel @Font-Face Generator can be of help with that. Also – just a tip – the TTF files in the package are strangely named – preview them to find out which font is the regular, which the bold, the italic, etc….

Here are images of what PT Sans looks like:

Can’t wait to see the serif font later this year.

Note: A quick search reveals that all the members of the PT Sans family are available individually from free font service Kernest and Font Squirrel, too.

In a comment on this post, Richard Rutter – who’s done such terrific work on web typography, reports that PT Sans (in subsets for quicker download) is featured at Fontdeck, as well.

John Daggett On CSS3 At TypeCon, 2010

Richard Fink — Sun, 22 Aug 2010 17:10:03 +0000

John Hudson of Tiro Typeworks and Christopher Slye of Adobe arranged a briefing – a guide to the perplexed – by Firefox developer and editor of the W3C CSS3 Fonts Module, John Daggett.

John Daggett has kindly posted his slides.
Dave Crossland has kindly posted his notes.
Photos of the event are posted in an album on Readable Web’s Facebook photo gallery.

California Dreamin’

As Simon Daniels of Microsoft put it on the TypeCon feed, these links are the closest thing to having been there “minus the element of spending a sunny afternoon in an underground bunker with a bunch of geeky web font geeks”.
This is true. But we emerged from the bunker with good tidings: the CSS3 Fonts Module has come a long way and Daggett says there’s a possibility it will move to Candidate Recommendation status by the end of this year. Truly impressive and unusually speedy work by the WG and its panel of Invited Experts. Many parts of the draft will be implemented in IE9 and Firefox 4. With other browser makers expected to follow. As John Hudson said during the Web Fonts panel discussion a few days later, “The standards process works.”
Considering the pessimism last year, quite amazing.

Web typography and a standards process that works. Wow++.

TypeCon 2010: A New Birth Of Type

Richard Fink — Fri, 20 Aug 2010 17:10:59 +0000

As good as digital gets there is still no replacement for face-to-face. Never will be. The only thing that a human really understands is other humans. Facial expression, tone of voice, body language – the real people deal – there’s just no way to get that from afar. Technology allows us to adopt a persona in our communications, and the only way past that is to be there.
Ya gotta get out of the office.

The Past Has Passed

It’s amazing how much has changed since last year. Here at TypeCon, there is a new mood: a growing acceptance that the future of fonts is onscreen. A feeling of relief is in the air. Decisions have been made. Last night, in a keynote kick-off, Roger Black of the Font Bureau focused on screen fonts and, with optimism, stated the obvious – that the font industry has to rethink the business of type because there is no going back. Roger was understandably a little light on details but the last slide in his accompanying Powerpoint demo was a price: “99 Cents”

News And Links

Webtype

Webtype, a partnership between Font Bureau and Ascender Corp, has finally launched. Without even looking, I know the fonts look good. Webtype has a blog, too. See: New Web Font Service Launched by Partnership of Experts
FinkTip: Stop with the “we are the experts” stuff. Nobody cares. Self-congratulatory mumbo doesn’t convince anybody of anything. (Unless you’re trying to convince yourself, which is really what sales copy like that is about.) Pronouncements from on high about your own expertise doesn’t work onscreen. It only undermines the effort.
And if I see from anybody, “use fonts legally” as marketing pitch, I’m going to scream. I’m screaming right now. You might as well hang a sign that says, “Hack me, please!” And how many potential customers, pray tell, are even going to understand what you’re talking about? This is just the reality. Why not be explicit and tell customers that if they don’t do business with you, they could potentially get sued? That would be charming, eh? Either get into it, in detail, or cut the FUD. It just detracts.

Fontfonter

Some guys from Fontshop have put together a web font preview site called FontFonter which lets you see their fonts as applied to external sites. Conspicuously missing is support for Internet Explorer. I don’t think it’s a technical issue but I could be wrong. I have noticed an ideological bias – unstated, but certainly there – against Internet Explorer at Fontshop. I don’t know if it’s a beef with Microsoft in general, or what.
I’ll be trying to get to the bottom of it and will report. [Update: see report that follows]

FinkRetract: (Concerning the deleted above) I met up with Stephen Coles and Ivo Gabrowitsch of Fontshop today and was assured that there is no bias against IE and that Fontfonter’s lack of support for IE is purely technical. They just can’t make the font swap-out work in IE. And they are quite glad that Microsoft held the line and helped bring about WOFF so no biases there, either. Love is in the air. My bad for reading into things.

Typecon Pics On Facebook

I’ve been trying to get a handle on my new Canon Rebel X4 camera – and dammit I’m going to do it no matter how long it takes – and have been posting pics on Readable Web’s Facebook Page. Check it out. You might be tagged!

Good Web Fonts

Educator Laura Franz – who I met last night – has put together a side-by-side comparison site for body fonts called Good Web Fonts. Great idea. Check it out.

The Web Font Awards – A Contest

Monotype Imaging will be sponsoring a web fonts contest. The site is called Web Font Awards. Brand new. No details as yet. Kudos to Monotype for this idea. The world holds one surprise after another. Now how do we get more web designers to attend a conference like this? Two hour Web Font “panels” are fine but in the world Roger Black is describing, fonts on the web are the main event with two hour panels on print fonts.

Playing Up WOFF At TypeCon, LA

Richard Fink — Wed, 18 Aug 2010 19:14:30 +0000

[Los Angeles, CA]
The W3C is seizing the opportunity to publicize WOFF – the Web Open Font Format – in conjunction with TypeCon here in LA.

Here are some relevant links:

W3C Opens Typography on the Web
WOFF Frequently Asked Questions
W3C Leads Discussion at TypeCon 2010 on New Open Web Font Format (WOFF)

The Lions Get Down With The Lambs

In the legal wrangling surrounding font licensing, WOFF is a kind “settlement” between browser makers and commercial font producers. The hoopla reminds me of the settlement between Google Books and the publishing industry. On a technical level, WOFF doesn’t do much except provide compression and a small barrier to installation in an OS like Windows, but at least it puts an end to the acrimony and that’s a lot in and of itself. We can move on. And so the W3C, major font producers like Microsoft, Adobe, Monotype Imaging, and others are hailing it as a big achievement.

It is. And congrats to all who made it happen.

Last night there was a “WOFF” party sponsored by Microsoft held at the Otis School of Art and Design. I was jet lagged and kept a low profile. I did vow, however, to find the person responsible for the eccentric vegetarian cuisine and make them pay. As font designer Juliet Chen said, maybe it was just a trendy West Coast/LA thing.

Today John Daggett of Mozilla and editor of the CSS3 Fonts Module, will be briefing attendees about the work of the W3C Fonts working group and the CSS3 Fonts Module. This was arranged and sponsored by Tiro Typeworks (John Hudson and Ross Mills).
A great idea and thanks in advance. Readable Web will be there.

I think I’ll bring along a bag of Doritos, just in case.

TypeCon 2010

Richard Fink — Mon, 16 Aug 2010 20:24:43 +0000

The yearly font fest, TypeCon, is being held in Los Angeles this year. As last year, Readable Web will be there to report.

TypeCon is sponsored by SOTA – The Society Of Typographic Aficionados.

Posts and pics from last year:
Web Font Players Converge At TypeCon 2009
Web Fonts At TypeCon 2009

Fun stuff. And I always learn a lot. Join us next year!

Microsoft WOFFles On SVG Web Fonts In IE9

Richard Fink — Sat, 07 Aug 2010 20:56:11 +0000

In a post on the IE Blog, the following excuse was given for not supporting SVG Fonts:

“As IE9 has implemented more of the standards that developers use and value, IE9’s Acid3 score has continued to rise. The remaining points involve two particular technologies (SVG Fonts and SMIL animation of SVG) that are in transition.

Support for SVG Fonts in the web development and font communities has been declining for some time. There’s already been discussion without objection of dropping SVG fonts from the Acid3 test. The community has put forth a proposal in the SVG Working Group to give SVG Fonts optional status.

Instead, developers can use the Web Open Font Format (WOFF, supported in IE9 Platform Preview 3 as well as other browsers) for both HTML and SVG content. It works well in conjunction with the CSS3 Fonts module and has broad support from leading font vendors (e.g. here, “a majority of font makers have already settled on WOFF or services like Typekit as their format of choice”). WOFF fonts are a better long-term solution for many reasons discussed previously.

Here is my reply as it appeared in the comments:

I find this post’s explanation for tossing SVG Fonts under the bus completely unpersuasive. I don’t know what to make of it. You’ve written nothing about the technical merits or the lack thereof of SVG Fonts at all. Just excusy dance-arounds.

“Support for SVG Fonts in the web development and font communities has been declining for some time.“

To what kind of “support” are you referring? Actual implementations or enthusiasm about the technology? If the latter, who’s enthusiasm has waned?

Did somebody do a poll?

Chrome, Safari, and Opera all have running code for SVG Fonts.

“There’s already been discussion without objection of dropping SVG fonts from the Acid3 test. The community has put forth a proposal in the SVG Working Group to give SVG Fonts optional status.“

First, I object. So now you have an objection.

Second, so what? Are you in favor of SVG Fonts or not? Does it give developers valuable options that they would not otherwise have, or not?

“Instead, developers can use the Web Open Font Format (WOFF, supported in IE9 Platform Preview 3 as well as other browsers) for both HTML and SVG content.“

Huh? Excuse me for being a little in the dark here, but could you be specific about where and how WOFF – which is a wrapped TTF or OTF file and works no differently than the system installed web-safe fonts – can be manipulated via script in the way SVG fonts can be? Are you saying WOFF is *the same* as SVG Fonts?

“It works well in conjunction with the CSS3 Fonts module and has broad support from leading font vendors (e.g. here, “a majority of font makers have already settled on WOFF or services like Typekit as their format of choice”).“

This has the standards process backwards and it isn’t even true. If it’s true, prove it.

“WOFF fonts are a better long-term solution for many reasons“

Says you. What are the differences, why are you declining to suport SVG Fonts, *that* is the point.

Some elaboration would be appreciated.

Regards,

Rich

I think everybody deserves a truthful and rational explanation for any decision that effects digital publishing as profoundly as the display of fonts. From any browser maker. And especially from Microsoft who writes so many rules of the game.
Whatever disagreements there may be between some font producers and myself there is no disagreement on this: type is important, it’s fundamental. If questions are raised and the answer is, simply, “Suck it up. This is what we’ve decided to do.”, that may or may not be OK – it depends upon what we’re talking about – but I’d rather hear that, than jive posing as reason supported by wishes presented as facts.

What’s WOFF Got To Do With It?

Tina Turner sang that, right? What’s WOFF but a second hand emotion…♫♪♫♫
Anyway, to end, here’s an example of SVG fonts at work. Viewable in Opera, Chrome, and Safari:
http://devfiles.myopera.com/articles/593/webfonts_in_svg.svg

Fixing Web Fonts, A Case Study

Richard Fink — Tue, 03 Aug 2010 17:07:49 +0000

Zoe Gillenwater writes about web design, especially Cascading Style Sheets. She’ll be speaking at John Allsopp’s Web Directions USA in Atlanta on Sept 21 in a presentation titled Efficient and Effective Design With CSS3.
A few months ago she announced a new book in the works called Stunning CSS3. I went to the book’s dedicated page to have a look.
Web fonts were being used. But in IE I didn’t like the way they looked at all:

Recreation of the page here.

The fonts used were Fertigo and Museo by Jos Buivenga.

Here’s what I did to fix:

1) I downloaded the fonts fresh. (They are available only in OTF format. Why? I don’t know. One would think that – as a promotional giveaway – making sure the fonts look good in every browser would be important. And at least one font designer – Peter Bilak at Typotheque – seems to grasp this reality. Good looking font rendering requires what it requires. And telling users of IE 6 through 8 to go take a hike is not a nice or smart thing to do. Bad for business.)

2) I subsetted the fonts (deleting unnecessary characters) to match the original files I got from Zoe’s site.

3) I converted the OTF files to TTF using the Font Squirrel Generator with auto-hinting enabled.

4) I re-did the TTF to EOT conversions using EOTFAST to get a compressed file. (Smaller files, quicker page load.)

Note: Auto-hinting is a hit-and-miss proposition – it works great for some fonts, not so well for others. But it worked very nicely for Museo and Fertigo, so I sent Zoe the improved fonts.
Here’s the result:

Recreation of the page here.

This was all one-click stuff that anybody can do. The worst that could happen is that the TTF wouldn’t look any better than what you had before. Was it worth the time spent? Absolutely.

Looks Bad Delivered By Typekit, Too

On Jos Buivenga’s site, I noticed that Typekit was listed as a source for Museo so I went and took a look there, too. Unfortunately, it looked as scraggly as the original on Zoe’s site:

Now, one of the arguments I’ve heard in favor of FHOS (Font Hosting and Obfuscation Services) is that they relieve web authors of the burden of taking different browsers into account. Well, what’s happening here? What’s up with this?

Don’t Deny What’s In Front Of Your Face

Recently, in a thread on Typophile, font designer Karsten “Cool Hand” Luecke wanted a piece of me for, according to him, putting ideas in people’s heads, for the notion that there are lots of fonts that look like crap onscreen. Fonts that need fixing. Fonts that could use improvement. It seems I’m an instigator for suggesting that web designers take matters into their own hands and mash, slash, and smack the font around until it looks right. Well, I plead guilty as charged. Please excuse me for suggesting that upholding some minimum level of aesthetic quality might be a good thing for users, web authors, and font designers alike.

Incidentally, Zoe G is using the web font Nadia from the free font service Kernest on her blog, and it looks very very good across the whole browser spectrum. (See if you can spot it.)

So here we have one case of free delivering better than paid, and a DIY derivative performing better than what could be purchased. (The single “normal” weight of Museo is free, the rest of the family you pay for.)

Make of this what you will.