HELP! Font Display problems

  1. 7 years ago

    Hi there, I am trying to create interactive phonics books, and I am running into a big problem -- fonts.

    I use two very specific fonts for education purposes. Unfortunately, these fonts aren't used by Google, Android or Kindle. ;-( (Aaaah! They have some great fonts, but none of them are appropriate for beginning readers.)

    The fonts I want to use are included as assets in my project file, and I have clearly specified the fonts in my project CSS. But....

    (a) Quick Preview (whole project) doesn't use/show the correct fonts
    (b) "Send Project Preview To Browser" shows the WRONG fonts in Internet Explorer.
    (c) "Send Project Preview To Browser" shows the right fonts in Firefox (yay!)
    (d) I haven't yet tried downloading the project onto an Android device, so I don't know what happens there. (My internal wifi card isn't working, so I have to fix that first.)
    (e) I don't know how the project will display in an iOS device or on a Kindle (no preview option for those).

    I can't risk having display devices choose their own font, so what are my choices?

    (1) Do I have to put all the text into image files (.gif, .jpg, .png) ?
    (2) Or is there some magic code that forces devices to display text in the designated font?

    Thanks very much.

  2. Anna S 2

    10 Jan 2017 Administrator

    Hi Suzette,
    can you send the file .pubcoder with a link to support@pubcoder.zendesk.com?

    Thanks

    Anna

  3. Hi Anna,

    I sent a link (a Dropbox link) -- I haven't heard back, so I was wondering if I need to send the link another way?

    Thanks. ;-)
    Suzette

  4. Angelo S

    23 Jan 2017 Administrator

    Hello Suzette,
    are you sure the font is legally eligible for web embedding?
    Internet Explorer is strict on this: it reads font metadata and does not display it if it is marked as not eligible for web embedding.

    If you are sure you are allowed to embed the font, you can pass it through FontSquirrel Generator , that will convert the font to WOFF format, getting rid of those metadata and allowing you to display it on IE.

    Once you get the WOFF file, you can replace the OTF/TTF file in your project with that: be sure to have it named exactly the same as the older one (extension excluded, of course) and you will not need to modify the text in PubCoder.

    Hope this helps.

    Bye,
    Angelo

 

or Sign Up to reply!