Fonts, webfonts & embedding

[KrisM]

I am getting the following warning when previewing a webpage I'm working on -



Obviously the font is installed or how would it be in my design. That leaves the matter of the format. The font displays correctly in Xara. It is an otf font. This is a font which I purchased and which is licensed to use on a website. I also have a version of this font which is a webfont and is ttf. I tried to use this font instead but windows doesn't recognize it as a ttf font for some reason. I understand that webfonts need to be referenced in the css sheet but can't see how to do this from Xara.
Any thoughts would be appreciated. I not quite sure why this has to be so convoluted.
Thanks in advance.
Kris

[gwpriester]

Welcome to TalkGraphics Kris

Fonts installed on your computer will display fine when you preview the page. But for visitors without the font on her or his computer a font will be substituted.

If you purchased the rights to use these fonts as web fonts then there will be a link to the website that will load the font in your visitor's browser.

I am not sure how to designate this but I think if you create a dummy page and use some of the Google web fonts, then publish to a folder and open the published CSS file you will probably see the format for embedding.

You can use a placeholder to insert this code but that too I do not know. Check back and see if one of the more web savvy members has the answer.

[KrisM]

Gary,

Thanks for your reply.
The fonts actually do not display in the preview window. As per the warning - the fonts are not in a format which allows embedding. I am curious as to what this actually means. The fonts are substituted in the preview window. The fonts are in otf format. They are legitimately purchased and licensed for use in a website. They display properly in Xara. There is a webfont version of the font which is in ttf format but which Windows doesn't recognize as a ttf font if I try to install it. Fonts are obviously more complex than meets the eye.
Any comments from someone who understands font structure would be appreciated.
Kris

[mwenz]

Wherever you bought the font from should have instructions on their website. Usually, one downloads a zip file that has the instructions as well as sample HTML that will display the font. As well, one needs more than one type of web font in order to display in all the various browsers.

[KrisM]

Gary,

I do have the various forms of the webfont required as well as the code to paste into the css stylesheet but I was hoping that Xara would do this for me since it does so much else automatically. Still curious about the font structure etc.

Kris

[gwpriester]

I'm sure (or more or less sure) there is a way to use a placeholder to get the font info in the CSS style sheet.

This is the code generated for Droid @import url(http://fonts.googleapis.com/css?fami...subset=latin);

Sketch or Acorn or Paul or ANYBODY, do you know how Kris can get her font information to embed in her document?

[gwpriester]

Acorn provided this explanation:

...I suspect it is down is Xara using IE for preview and that MS does not like embedding either OFT or TTF.

Two things to try:

1. Click the preview buttons in Chrome / Firefox / Opera / Safari from the Xara IE Preview.
2. Convert the TTF version to EOT (Embedded OpenType) using TTF2EOT: http://code.google.com/p/ttf2eot/. There could be an issue with the licensing after this.

I would then use the on-line Generator here to add the result to the Website Head:

http://www.fontsquirrel.com/tools/webfont-generator

Acorn

You can research from here: http://snook.ca/archives/html_and_cs...bedding-master

Thanks Acorn

[KrisM]

Gary & Acorn,

Thanks for your answers. It is indeed a browser issue. The fonts don't work in IE or Firefox but do work in Chrome. Didn't try Safari as I don't have it installed. I have changed the fonts to a Google version to keep things simple. The internet as always is a minefield of inconsistencies.
Gary, by the way, the she is a he. ... 63 year old curmudgeon.

Kris

[gwpriester]

Mia culpa. 72 year old super-curmudgeon.