9 replies to this topic

[pateeg]

Hi Folks,

What font(s) is apple using here?

apple newsletter

I'm assuming it is a common font on PC's as well?

Can you tell me the right way to write the CSS style for it?

Thank you,

pateeg

[joedolson]

Well, they're using several fonts on that page --- but the principal font is "Lucida Grande" --- and no, it's not actually a common font on PCs. There are a number of similar fonts (Lucida Sans and Lucida Sans Unicode) which are common on PC, but Lucida Grande is actually fairly unusual.

There's a great article about emulating Lucida Grande for the PC which is worth referencing here.

For a long time, Lucida Grande was actually not available for the PC --- that's changed, but it's still not that widespread.

As far as "the right way" to write a CSS style for Lucida Grande - I'd say the method mentioned in the article referenced above is probably the best choice. The concept is, basically, to mix and match the PC substitutes for Lucida Grande according to which one gives the best look:

body {
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

strong, em {
font-family: "Lucida Sans", "Lucida Sans Unicode","Lucida Grande", sans-serif;
}

Basically, the Sans/Unicode version is best at normal weight and style, but the Sans version is better in bold or italics --- so you declare them separately.

Edited by joedolson, 16 April 2008 - 09:31 PM.

[pateeg]

joed,
thank you for coming to my rescue. a couple of things...

while I've got some other style sheets that might be causing a complication, you code worked within dreamweaver, but not when viewing through Safari.

the majority of the viewers of the page I'm designing will be pc users. Maybe I should just stay away from this font?

pateeg

[joedolson]

The styles I posted above are on root elements, so it's very likely that you've got styles already specified with a higher degree of specificity which will outweight those elements. You might want to try giving them a higher level of specificity to check them in actual browsers.

I don't particularly see any reason you shouldn't try to use the font, as long as you test thoroughly on both Mac and PC browsers - at least through a service such as BrowserCam.

[Autocrat]

You could always look into embedding the font (as it's mainly for Windows users, a portion of which use IE).

Not perfect... but might help a little.
If it's onyl for short bits (titles etc.), then maybe sIFR (flash image replacement for text... and I think you can use your own font in that too ... plenty of mentions on here about it ).


Just 2 other alternatives to consider.

[joedolson]

Autocrat's got a good point - there are additional solutions, which depend significantly on the context of your usage and the probable target audience.

[Respree]

Interesting idea, Autocrat, about embedding the fonts. Frankly, I had not considered that.

I found this tutorial, pateeg, in case you want to explore Autocrat's suggestion a little further. I can't be sure if it will 100% across all browser and all versions, but you can have a look and decide for yourself if giving your site a distinction look outweights any potential risks.
http://www.webmonkey.../tutorial2.html

[joedolson]

I can't be sure if it will 100% across all browser and all versions,

It won't - that, I can guarantee. In addition to the fact that the referenced tutorial is very old, embedding of fonts never became a widely supported feature, and probably won't any time soon. Just an FYI.

[Autocrat]

As far as I'#m aware, it is an IE only thing... and only on Windows (I don't think the MAc ever took to it).

Further more, it was never popular, partly due to the added size of any downloads and for the server resources it used up.
But now adays, I don't think that would be such an issue.


In fact, I might just have to have a play to see what it goes like.
(Who knows, after several years, I might get it right this time around )

[DonnaFontenot]

Not that you need it this time around, but in the future, you might want to check with What The Font to help figure out what a particular font might be.