font-face

How to add some non standard font to website?

Is there any way to add some custom font on website without using images, flash or some other graphics. For example, I was working on some wedding website, and I was found a lot of nice fonts for that subject, but I can't find the right way to add that font on the server, and how to include that font with css into the html. Is this possi...

Using @font-face slows load time. Can I force the client to cache the font?

Update: Looks like the header request information is the culprit. How would I change the max-age property of the request header? TIA. Hi, I'm using @font-face on a website and i'm experiencing delayed loading of the text (presumably due to the loading of the font every page). I understand the client has to download the font once to di...

Cufón font security

I've been trying to research a safer way to implement Cufón that would store the actual font data in a MySQL database that could be queried and returned when necessary, without having to store the converted .js file on the server (and break EULA). Is this even possible? I'm still in the beginning stages of testing this out. I've alread...

@font-face is deprecated on the iPhone version of Safari. What are my alternatives?

According to Apple's documentation, @font-face is deprecated for use on the iPhone version of Safari. The iPhone only includes 11 fonts, AFAIK, and, in any case, I need a nice blackletter font for an app I'm building. I'll be generating random text, so images are not an option. What alternatives do I have? Am I stuck with a JavaScript so...

@font-face isn't working in Firefox 3.5?

I have an OpenType font being referenced in a CSS file, but it doesn't seem to work in Firefox 3.5. It works perfectly in Safari. The font is being referenced relatively, and is hosted on the same server, but in another sub-directory: @font-face { font-family:'Font Name'; src:url(../fonts/Font-Name.otf) format('opentype') } Has anyone...

Preloading @font-face fonts?

Is it possible to preload or otherwise cache @font-face fonts, most likely with javascript, before the page loads so you don't get that ugly jump when the page finally does load? ...

Automating HTML font embedding PHP backend

Hi, I understand that css3.0 supports the Font-Face tag, correctly in the latest Opera, Safari, and Firefox browsers, but that Internet Explorer still requires the microsoft .eot format. Is there a reliable way to generate an eot file server side from a .ttf given that the hosting server may not be Windows? I need the entire process a...

Embed font in webpage

Ive googled alot trying to figure out how to embed fonts on a webpage. As i understand it you should upload the fonts to your webpage in .ttf and .eot formats. and the use @font-face in a stylesheet. I have placed the Kingthings_Italique.eot and Kingthings_Italique.ttf in the root of my webpage. Createt a stylesheet like this. .MyStyl...

adding @font-face to CKEditor

I would like to add a font to the CKEditor font combo box. This in itself is easy enough. However the font I would like to add is a custom font that I use with the @font-face CSS3 attribute. I managed to do that but the editor itself does not show the custom font. If I just take the html created by CKEditor and show it in a div on the pa...

Any advantage to using SVG font in @font-face instead of TTF/EOT?

I am investigating the usage of SVG fonts in @font-face declaration. So far, only Safari 4 and Opera 10 seem to support it (see an example for test [1]). Firefox 3.5 does not support it but there is a bug report [2] but no fix has been supplied yet (though there are patches). I also came across this discussion[3] which tangentially talks...

Compress/Deflate @font-face fonts

I am using the @font-face CSS property to load a special font for headings on a website, and I want Apache to send the font compressed to reduce loading time. However, the "AddOutputFilterByType" declaration in Apache 2's deflate module only accepts mime types and, as AFAIK, neither opentype nor truetype have registered mime types. So,...

Is it possible to disable anti-aliasing in CSS when using @font-face with pixel fonts?

I want to use a pixel font on the web. I'm including it using @font-face however all the browsers are applying anti-aliasing to the font. I can't seem to find a CSS rule to disable this, can anyone think of another method of disabling anti-aliasing? ...

Internet Explorer @font-face is failing

I'm trying to get Internet Explorer to render my pretty fonts. It's not working. They work fine in Firefox and I can see in my Apache access logs that IE has pulled the fonts. So it's parsing the font-face CSS tag, just not rendering them. The site I used to convert the fonts was: http://www.kirsle.net/wizards/ttf2eot.cgi. I tried that ...

Custom font and a CMS

I'm building a web site for an artist who has had a custom font made from his handwriting. He'd like to use this font extensively throughout the site - not for all body copy because it'd be difficult to read, but for headings, navigation, callouts, things like that. I've got the file - it's a TrueType font file. We're going to be using...

Get good @font-face fonts

Hello, do you know some good sites within good fonts that could be used in websites with font-face? There are some sites I know, but I search for fonts that I can use in "commercial projects" and they should be licensed optimally under MIT or (New) BSD? ...

@font-face support in major email clients?

Do major web and desktop email clients support the font-face feature? It would be only logical to assume that they don't but thought I'd ask anyway. Has anybody tested? ...

@font-face rendering

I'm using a font in my site: http://www.fontsquirrel.com/fonts/Bentham But I have a problem: This @font-face displayed font looks different in every supported browser. How could I mostly render it everywhere equally? ...

@font-face in IE with modal window: once in the modal font reverts back to Helvetica

I'm using @font-face and it's working perfectly even in IE when loading the index page. However, when I open my modal window using IE it still works and then I click on a link within the modal to display a new page in the modal - it reverts to Helvetica on that page, on the previous page and even when I close the modal my index is now in...

How can I convert OTF/TTF files to EOT format?

I need to use @font-face feature and my fonts are in OTF/TTF format and Microsoft browsers support only EOT format. I tried to use Microsoft tool WEFT, but it didn't work or I didn't understand how it works. Is there any other way to convert my fonts to EOT format? ...

@font-face nested within @media does not work in Firefox 3.5 and IE8

Update: Looks like I got caught up in a correlation that was not in fact the cause of the problem. Problem was actually an unrelated issue in how CSS files were deployed. See my answer below for details. I have @font-face working well in WebKit (Safari and Chrome) and Opera, but not in Firefox 3.5 or IE 8. Per recommendations by Google...