Specific Font in CSS

Discussion in 'Web Design and Development' started by SwiftLives, Aug 26, 2009.

  1. SwiftLives macrumors 65816

    SwiftLives

    Joined:
    Dec 7, 2001
    Location:
    Charleston, SC
    #1
    I very much want my website to display text in Helvetica. And not Arial. Or Verdana. I come from a print background and am just starting to delve into CSS. And I admit that I have certain control issues over my typography - which doesn't translate too well to the web. :)

    I know how to do the font family tag. However, I don't know how to force someone's browser to display text in Helvetica if they don't have it installed on their machine. Is that even doable/legal? I've been searching the web for awhile on this topic, and haven't found a viable answer. In fact, after reading this, I'm not sure it's possible - or even supported by type foundries.

    Anyone have any luck with cufon?

    Thanks.
     
  2. notjustjay macrumors 603

    notjustjay

    Joined:
    Sep 19, 2003
    Location:
    Canada, eh?
    #2
    sIFR is another approach, though it could get unwieldy for big sites.
     
  3. Mal macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #3
    You're better off just choosing a font that will likely be on everyone's machine. The number of people that will visit your site and not have Helvetica installed is, well, miniscule. Same with Arial (unless I'm remembering wrong and that's not a Windows font as well).

    jW
     
  4. run-kmc macrumors member

    Joined:
    Aug 11, 2009
    #4
    As mentioned, sIFR is the only option, and that's useful for only a headline or two.

    You could always use Helvetica, take a screenshot of the site, and put that up instead.
    :D
     
  5. polar-blair macrumors regular

    Joined:
    Apr 20, 2008
    #5
    Is it not possible to embed a type face, for example Helvetica, into your website. Im sure I read in a web design magazine a tutorial on how to do it just cant remember how to do it at the moment.
    (Sorry thats not very helpfull :eek:)
     
  6. Joined:
    Jun 30, 2009
    #6
    I think here is everything you need. Apart from the fact that this guy is a design genius, the post is comprehensive and has all of the most used tricks. I also salute and use the image replacement one, but regarding the specified fonts... I highly doubt any of your site's visitors will be missing these fonts...
     
  7. SwiftLives thread starter macrumors 65816

    SwiftLives

    Joined:
    Dec 7, 2001
    Location:
    Charleston, SC
    #7
    I'm resigned to the fact that embedding a font is essentially going to require a hack. Or at least patience until CSS3 decides to become legitimate. I'm also starting to suspect that it needs to be reserved for a few headlines, and not all of the text on the entire page.

    Ugh. Web design is quite an adjustment for print designers with control issues.

    Thanks everyone. I appreciate your help.
     
  8. Joined:
    Jun 30, 2009
    #8
    Don't rely on that. Web standards are not standard at all...
     
  9. joshysquashy macrumors 6502a

    Joined:
    May 13, 2005
    Location:
    UK
    #9
    If it is just used for headings, you could create an image of the text you want. It can have very desirable outcomes. Apple does this on their website. As long as the alt text says the same as the image, it is also accessible.

    This technique is no good for body text though. Use a standard font, or at least a font that has 95% adoption rate. And use a font list. Eg:
    Code:
    font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif;
    will be fine.
     
  10. notjustjay macrumors 603

    notjustjay

    Joined:
    Sep 19, 2003
    Location:
    Canada, eh?
    #10
    Isn't Arial close enough to Helvetica for web work? Or, for that matter, specify "Helvetica, Arial" in your stylesheet and half your users will see what you want. :)
     
  11. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #11
    Font embedding is not universally supported, the user who posted about CSS is absolutely correct, and I'll add the major problem is MSIE which is the one browser you can embed. But don't forget most browsers allow custom fonts and stylesheets so you can't control. The reason is because of accessibility concerns, not just "freedom to choose" concerns.

    For now read this for MSIE font embedding:

    http://forums.macrumors.com/showthread.php?t=656505

    The above procedure is what I personally would like to see officially adopted, but for now you use that for MSIE and then use other methods for most other popular browers. For those methods, please view the sticky topic I posted in this forum, "Helpful links..." and see the section on font embedding, two links.

    -jim
     
  12. Ride9650 macrumors 6502

    Joined:
    Jun 29, 2007
    #12
    Have you tried Cufon?

    http://cufon.shoqolate.com/generate/

    It seems to work reasonably well.

    EDIT: whoops didn't see you already thought of that.

    I haven't tried it myself, but I've seen a few examples in a recent issue of Web Designer and it seems to look pretty good.
     

Share This Page