SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: Embedding Fonts

  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2009
    Posts
    67
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Embedding Fonts

    I'm not sure if I'm putting this in the correct forum, mainly because I don't really know how this is done. I think that I've heard that you can embed fonts in CSS, so we'll just give this a shot, and if I totally misplaced this a Mod can move it.

    So.... how do you do this? Does it work in all browsers? I really know nothing about it except that it can be done. How does this work?

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Hi fendeanson,

    This is done with @font-face in CSS. There are several issues with it, but with a few workarounds you basically can do it in all (or most) browsers.

    Basically, the font files are included with the website and get downloaded with the web page. So there are big copyright issues involved. The font foundries are only just beginning to come to terms with this.

    Here are some useful links:
    http://paulirish.com/2009/bulletproo...tation-syntax/
    http://www.alistapart.com/articles/r...l-web-context/

    There are some nice collections of fonts that are free to use, and the code is all set up to work with the various browser conditions:

    http://www.fontsquirrel.com/fontface
    http://www.josbuivenga.demon.nl/

    Another option is to pay a licence fee to use fonts this way:

    http://typekit.com/

    Hope that helps!

    PS
    You could also use sIFR instead, in which you place the font (mainly headings) in a Flash file. (With Flash off, the default font text can be shown instead):
    http://wiki.novemberborn.net/sifr/


Bookmarks

Posting Permissions

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