www.webdeveloper.com
Results 1 to 6 of 6

Thread: Embedding fonts

  1. #1
    Join Date
    Nov 2011
    Posts
    3

    Embedding fonts

    I have tried embedding several fonts in my website. and although they do work, the quality of them is terrible and I dont understand why. They work perfectly in photoshop etc. Any ideas? Im really stuck

  2. #2
    Join Date
    Mar 2011
    Posts
    1,136
    It's tough to help without seeing the actual code. Does the page render normally on your system, but looks bad on the server?
    Rick Trethewey
    Rainbo Design

  3. #3
    Join Date
    Nov 2011
    Posts
    3
    Quote Originally Posted by rtrethewey View Post
    It's tough to help without seeing the actual code. Does the page render normally on your system, but looks bad on the server?
    @font-face {
    font-family: 'CODE-LIGHT';
    font-weight: normal;
    src: url('fonts/CODE-LIGHT.OTF');
    }

    Yes, it just looks bad on the server.

  4. #4
    Join Date
    Nov 2011
    Posts
    3
    Uh I answered wrong ^. It doesnt render properly on both.

  5. #5
    Join Date
    Mar 2011
    Posts
    1,136
    Then you may have the wrong path in the 'src' parameter. Remember that in stylesheets, relative URIs are calculated from the folder where the stylesheet resides. Keep in mind that Internet Explorer doesn't support .otf fonts (at least not directly) so you'll want to have a fallback font selection. Good luck!
    Rick Trethewey
    Rainbo Design

  6. #6
    Join Date
    Jan 2012
    Posts
    7
    Also looks as though you aren't embedding enough to fully be cross browser compliant see below for an example:

    Code:
    @font-face {
        font-family: 'ArialRoundedMTBold';
        src: url('fonts/arlrdbd.eot');
        src: url('fonts/arlrdbd.eot?#iefix') format('embedded-opentype'),
             url('fonts/arlrdbd.woff') format('woff'),
             url('fonts/arlrdbd.ttf') format('truetype'),
             url('fonts/arlrdbd.svg#arlrdbd') format('svg');
        font-weight: normal;
        font-style: normal;
    }

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles