544998 - Use Meta WOFF font on AMO

Status: RESOLVED FIXED

(addons.mozilla.org Graveyard :: Public Pages, enhancement, P4)

Description

[Justin Scott [:fligtar]]

We should use the open Meta font for the application name in the header for all locales.

I'll email the WOFF files to whoever takes this bug.

Considerations:
* We'll need to test every locale to make sure the characters are there for the ones that localize app names. Marketing says they're all there, but we should double check.

* We may want to set up a shared font domain between mozilla.com and AMO so that the fonts can be cached better. This font is already used on the Firefox 3.6 firstrun and whatsnew pages. (Alex, thoughts?)

* We will need to do some annoying referrer checking to prevent hotlinking and direct access, as described in bug 540859. If we set up a special domain, this may be taken care of automatically with that.

* Note that the license we agreed to for use of this font prevents us from modifying it, as jbalogh wants to do.

Comment 1

[Wil Clouser [:clouserw]]

I strongly object to doing this.  Working around the ridiculous license terms on mozilla.com was a pain - why do we need to do it again on AMO?  There are plenty of open fonts and plenty of talent that isn't hidden behind licenses like this.

Comment 2

[Justin Scott [:fligtar]]

Firefox branding and wordmarks are build around Meta. This time last year we wanted to use the actual wordmark images in the header, and you wanted us to find an open Meta font instead. If you'd like to go back to images, I'd be fine with that instead.

If we use the font, we get to show off Firefox 3.6 technology and can also use it in other headings around the site.

As someone who cares strongly about details and consistency, I hate looking at the generic "Firefox" word in our header and would very much like to see it fit in with the branding on all of the other Mozilla sites.

Comment 3

[John Slater]

As noted in bug 545012, we really need to have a conversation about fonts that brings together a bunch of different people so we can figure out a policy that's not dependent on any specific project or implementation.

But, having said that, +1 for Fligtar's comments. We have a WOFF font that allows us to have the *correct* branding on one of our most widely-trafficked sites. Would love to see that cleaned up, and even if this isn't 100% perfect it feels like a big step in the right direction.

Comment 4

[Jeff Balogh (:jbalogh)]

Past the licensing and linking debacle, my issue with this is the size of this file.  fligtar tells me that it's 70K, and that's already compressed.  Currently, addons.mozilla.org is 290K.  A page with the font would be 125% as big as our current pages, which is a lot of extra bandwidth and time to get content to our users.

I would feel much more comfortable adding the font if we only included the letters we're actually using.  Of course, that's not allowed according to the license.  Also, I bet a stripped-down font is not too attractive for hot-linking.

Comment 5

[Fred Wenzel [:wenzel]]

It's quite big, but you can obviously cache it forever. And if we stripped down the font, we couldn't use it for other parts of the page (like headers etc) anymore.

I am for using the wordmarks as images if we only do the wordmarks. If we plan on using it in other parts of the page, let's use the WOFF file and have it cache well, by sharing domains between m.com and amo.

Comment 6

[Fred Wenzel [:wenzel]]

We could ship the font with Firefox and just access it via chrome://... ;-)

Comment 7

[Justin Scott [:fligtar]]

Assigning to me to follow up with marketing and the font folks.

Comment 9

[Justin Scott [:fligtar]]

Filed bug 562388 to set up our fonts domain, after which we can continue with this bug. We'll need to investigate lazy loading and the best ways to implement the font in a perf-friendly manner.

Comment 10

[Jeff Balogh (:jbalogh)]

Performance considerations:
1. Size of the file(s)
2. When they get downloaded
3. If the font files block page load or javascript onready
4. Note: webkit shows a blank page until @font-face gets loaded

If we do lazy loading through javascript, the page load won't be blocked but there will always be a flash when we add in @font-face.

Comment 11

[Potch [:potch]]

We're doing this!