Link to home
Start Free TrialLog in
Avatar of kmead6
kmead6Flag for United States of America

asked on

Embedding fonts

I'm creating a website and would like to use the true type font Myriad Pro Condensed for my headings and navigation menu (in actuality I would rather use Myriad Pro Semibold Condensed but DW doesn't even see that that font exists on my computer). I'm making the site with Dreamweaver CS3 on a Mac and it previews fine in the program but when published it defaults to Times New Roman. I realize I need to make the font a .pfr file and embed it in the site, but cannot figure out how to do so. I'm looking for some sort of shareware or trial version to convert the font but cannot find anything. I keep hearing about Typograph 2 and TrueDoc but see no way to download/use these programs.
Thanks!
Avatar of lherrou
lherrou
Flag of Ukraine image

kmead6,

As you probably know, for a font to display in a client browser, the client computer MUST have that font installed. Site visitors who does not have it installed will not be able to see the text in that face. There's no easy way around this. Microsoft tinkered with WEFT (the embedded fonts you reference: http://www.microsoft.com/typography/Web/embedding/weft3/default.htm), but development of that stalled a few years ago, and never was a reliable solution for most sites - it only works in IE, so that mean's something like 30% of your visitors will not see it.

However, there IS a technique using flash to substitute fonts but it's tricky, and has it's own drawbacks. The technique is called sIFR (scalable Inman Flash Replacement). Essentially, you replace short bits of plain text rendered in the default or CSS-specified font with text rendered in your selected font by a combination of javascript, CSS, and Flash.

Here's the official page of the original sIFR, with more information, how-to's, and links:
http://www.mikeindustries.com/sifr/

Since then, sIFR has evolved, and the latest is version 3:
http://wiki.novemberborn.net/sifr3

Some drawbacks:
1) Limited to those with flash and modern browsers (due to the CSS and JS needed to implement it - but remember that using this technique, users who are unsupported still get the text specified by HTML/CSS prior to replacement). Flash is well-supported these days; JS, even in supported browsers, may be turned off in some instances. Flash may be limiting in accessibility. The bottom line is know your audience.

2) In some cases, Flash areas can be "sticky" and not allow scrolling via mouse wheel (user annoyance factor).

4) Text cannot be selected (for copy-n-paste, for example). This may not always be a bad thing.

5) Loading times in the font-replaced areas may be increased. The more you use it in a page, the more of an issue this can become.

6) The original sIFR doesn't work properly on clickable link text (I believe this is resolved in sIFR3)

None of these are necessarily show-stoppers, just tradeoffs (like many others we make as we design web pages) that you should be aware of.

Cheers,
LHerrou
ASKER CERTIFIED SOLUTION
Avatar of rafe_
rafe_
Flag of New Zealand image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial