views:

4711

answers:

10

Recently we received a mockup for a website from a client that makes extensive use of the Rockwell font all over the layout for menu items, articles titles, block titles, etc...

I never heard of that font before and I assumed that it wasn't web safe, also I checked online in several places to confirm this, like here and here, but couldn't find any reference to this font.

So after telling to the designers that we are going to need to use some kind of text replacement technique for using this font they told us that this is, indeed, a web safe font and that they checked in Windows and Mac and the font is installed.

So we are going to use this font but I'm still curious if this is a standard font or it's installed with an Adobe product or any other application.

Does anyone have any info on this?

+1  A: 

Rockwell is installed with office. Might want to try running things on a computer without office!

Gavin Miller
+3  A: 

Rockwell is installed with Office 2003 and later, and with some Adobe products. It's not what I would consider web-safe, so be sure to have a fallback. Here's a list of commonly-installed fonts.

John Feminella
A: 

Rockwell's availability is inconsistent so i wouldn't rely on it.

However, if Rockwell makes the design work then I'd suggest using sIFR on the fonts to make them appear regardless of what's on the user's computer.

More on sIFR here

jerebear
Using flash to replace text with rendered graphics of the text? Brrrrrr, the idea gives me goosebumps.
Treb
+1  A: 

You can tell your designers than on Windows, Rockwell is not installed by default. It gets installed as part of the Office suite (more specifically, Publisher). More info here: http://support.microsoft.com/kb/837463

DrJokepu
+1  A: 

Any font is web safe, if you provide reasonable fall-backs. ie:

* { font-family:"Rockwell, Times New Roman, Times, serif";}

Of course that means being aware of the differences between the fall back and desired font. Make sure you test somewhere without that font.

Joel Coehoorn
Quotes should go around each (non-generic) family name, not the whole list.
bobince
@bobince: I thought quotes were only only supposed to go around multi-word names?
Mark
Quote are only *required* around multi-word names, but I'd recommend using them for all non-keyword names so that it's clear when you're using a keyword as opposed to a font just called "Sans-serif". (Which, sadly, some Unixes have! gah)
bobince
A: 

I have Mac OS 10.5.6 (Leopard) with all updates to date and have no such font on my system. I also have a fresh install of Windows XP on a virtual machine, no sign of Rockwell there either.

I think your designers just want to avoid further work.. I've never heard of Rockwell before "Sketch Rockwell" was featured in Smashing Magazine a couple of months ago.

I'd go for sIFR, too, especially if you use the font in sizes larger than 16. It's not only about not having the font, but browsers running on Windows don't antialias fonts and that makes them look terrible at larger sizes. You can find a nice sIFR tutorial here.

evilpenguin
A: 

When CSS3 is implemented by all of the major browsers, then maybe it would be safe to use it. Until then, I would avoid it.

Cory Larson
+12  A: 

There's a very small set of web-safe fonts, and Rockwell isn't one of them, because it comes with third-party software like Microsoft Office.

That said, if you must use Rockwell as your primary font, be sure to define a decent font stack for it. That is, use CSS to define a list of fallbacks, where each fallback is a web-safe font:

body, input, textarea{
  Rockwell, "Courier New", Courier, Georgia, Times, "Times New Roman", serif;
}

Some information on font stacks:

Ron DeVera
+1  A: 

As others have stated, Rockwell is not a websafe font. I, for example, am typing this on a perfectly ordinary Windows box and don't have it. It is installed with certain versions of Office.

The current accepted answer recommends using a proper CSS font stack to feed Rockwell to visitors that have it, and more-common-but-less-suitable fonts to those without. That's excellent advice, so do so.

However, you can actually do one better. All of the modern non-IE browsers either support CSS Webfonts now or will in their next release. This module lets you host fonts on your server and transparently feed it to visitors when they visit, allowing you to use a vast array of fonts that aren't dependably available. Go ahead and add Webfont support now for Rockwell, giving it as the second choice in the font stack (behind ordinary Rockwell). This will allow visitors who are using advanced browsers but don't have Rockwell installed to still get the full effect of your typography, while allowing visitors with lesser browsers to still gracefully degrade to another font.

Finally, if you really need to hit IE with the font, go with image replacement. SIFR is always an option, but it can really slow down a page, especially if you use a lot of it. I'm the developer of PIR, which is an unobtrusive and super-lightweight javascript-based image replacer that uses a PHP backend to generate the images. It grabs all relevant information from the CSS directly, and can even handle word-wrapping automatically. There is also a FastCGI backend in development by one of my users. PIR generates 32-bit PNGs, so it can deliver full transparency (it'll even make the font itself transparent if the visitor is using a browser that knows how to handle transparent colors).

Xanthir
A: 

Another useful list of web safe fonts can be found here.

http://www.prismgraphicdesign.co.uk/web%5Fsafe%5Ffonts.php

Hope this helps.

Tony